{"componentChunkName":"component---src-templates-blog-post-js","path":"/algorithm/트리-순회-tree-traversal/","result":{"data":{"site":{"siteMetadata":{"title":"Bottlehs Tech Blog","description":"웹·앱·AI 개발자 전병훈(bottlehs)의 기술 블로그. AI·LLM, JavaScript·Vue, Spring Boot, 알고리즘, 블록체인 실무 가이드를 다룹니다","siteUrl":"https://www.bottlehs.dev","author":{"name":"Jeon Byung Hun","summary":"개발을 즐기는 bottlehs - Engineer, MS, AI, FE, BE, OS, IOT, Blockchain, 설계, 테스트"},"social":{"github":"bottlehs","codepen":"bottlehs"}}},"markdownRemark":{"id":"397cf054-8f13-56b1-9031-3b1cb2eae950","excerpt":"트리 순회 (Tree Traversal) 트리 순회는 이진 트리의 모든 노드를 체계적으로 방문하는 방법으로, 방문 순서에 따라 전위·중위·후위 순회로 나뉜다. 정의 이진 트리의 각 노드를 정확히 한 번씩 방문하는 방법이다. 방문 순서에 따라 세 가지로 구분한다. 전위 순회(Pre…","html":"<p><img src=\"/assets/algorithm.png\" alt=\"트리 순회 (Tree Traversal)\" title=\"트리 순회 (Tree Traversal)\"></p>\n<p>트리 순회는 이진 트리의 모든 노드를 체계적으로 방문하는 방법으로, 방문 순서에 따라 전위·중위·후위 순회로 나뉜다.</p>\n<h2 id=\"정의\" style=\"position:relative;\"><a href=\"#%EC%A0%95%EC%9D%98\" aria-label=\"정의 permalink\" class=\"anchor-header before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>정의</h2>\n<p>이진 트리의 각 노드를 정확히 한 번씩 방문하는 방법이다. 방문 순서에 따라 세 가지로 구분한다. 전위 순회(Pre-order)는 ” root → 왼쪽 서브트리 → 오른쪽 서브트리” 순서로, 중위 순회(In-order)는 “왼쪽 서브트리 → 루트 → 오른쪽 서브트리” 순서로, 후위 순회(Post-order)는 “왼쪽 서브트리 → 오른쪽 서브트리 → 루트” 순서로 방문한다.</p>\n<p>중위 순회는 이진 탐색 트리에서 오름차순으로 값을 얻을 때 유용하다. 전위 순회는 트리를 복사하거나 전위 표기식을 구할 때, 후위 순회는 트리를 삭제하거나 후위 표기식을 구할 때 자주 쓰인다. 레벨 순서 탐색은 BFS와 동일하며, 큐를 사용해 같은 레벨의 노드를 차례로 방문한다.</p>\n<h2 id=\"구현\" style=\"position:relative;\"><a href=\"#%EA%B5%AC%ED%98%84\" aria-label=\"구현 permalink\" class=\"anchor-header before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>구현</h2>\n<p>재귀를 사용하면 각 순회가 매우 간결하게 구현된다. 전위는 루트를 먼저 방문 처리(배열에 추가)한 뒤 왼쪽과 오른쪽 자식에 재귀 호출을 한다. 중위는 왼쪽 자식을 먼저 방문하고 루트를 방문한 뒤 오른쪽을 방문한다. 후위는 양쪽 자식을 모두 방문한 뒤 마지막에 루트를 방문한다.</p>\n<p>스택을 사용한 반복적 구현도 가능하다. 전위의 경우 루트를 스택에 넣고, 스택이 빌 때까지 노드를 꺼내 방문한 뒤 오른쪽과 왼쪽 자식을 순서대로 스택에 넣는다. 중위 순회의 경우 노드와 왼쪽 자식들을 모두 스택에 넣은 뒤 꺼내며 방문하고, 오른쪽 자식이 있으면 다시 스택에 넣는다. 레벨 순서는 BFS와 동일하게 큐를 사용한다.</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token keyword\">class</span> <span class=\"token class-name\">TreeNode</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token function\">constructor</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">val<span class=\"token punctuation\">,</span> left <span class=\"token operator\">=</span> <span class=\"token keyword\">null</span><span class=\"token punctuation\">,</span> right <span class=\"token operator\">=</span> <span class=\"token keyword\">null</span></span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n    <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>val <span class=\"token operator\">=</span> val\n    <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>left <span class=\"token operator\">=</span> left\n    <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>right <span class=\"token operator\">=</span> right\n  <span class=\"token punctuation\">}</span>\n<span class=\"token punctuation\">}</span>\n\n<span class=\"token comment\">// 전위 순회: Root → Left → Right</span>\n<span class=\"token keyword\">function</span> <span class=\"token function\">preorder</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">root</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span><span class=\"token operator\">!</span>root<span class=\"token punctuation\">)</span> <span class=\"token keyword\">return</span> <span class=\"token punctuation\">[</span><span class=\"token punctuation\">]</span>\n  <span class=\"token keyword\">return</span> <span class=\"token punctuation\">[</span>root<span class=\"token punctuation\">.</span>val<span class=\"token punctuation\">,</span> <span class=\"token operator\">...</span><span class=\"token function\">preorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">.</span>left<span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token operator\">...</span><span class=\"token function\">preorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">.</span>right<span class=\"token punctuation\">)</span><span class=\"token punctuation\">]</span>\n<span class=\"token punctuation\">}</span>\n\n<span class=\"token comment\">// 중위 순회: Left → Root → Right</span>\n<span class=\"token keyword\">function</span> <span class=\"token function\">inorder</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">root</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span><span class=\"token operator\">!</span>root<span class=\"token punctuation\">)</span> <span class=\"token keyword\">return</span> <span class=\"token punctuation\">[</span><span class=\"token punctuation\">]</span>\n  <span class=\"token keyword\">return</span> <span class=\"token punctuation\">[</span><span class=\"token operator\">...</span><span class=\"token function\">inorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">.</span>left<span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> root<span class=\"token punctuation\">.</span>val<span class=\"token punctuation\">,</span> <span class=\"token operator\">...</span><span class=\"token function\">inorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">.</span>right<span class=\"token punctuation\">)</span><span class=\"token punctuation\">]</span>\n<span class=\"token punctuation\">}</span>\n\n<span class=\"token comment\">// 후위 순회: Left → Right → Root</span>\n<span class=\"token keyword\">function</span> <span class=\"token function\">postorder</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">root</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span><span class=\"token operator\">!</span>root<span class=\"token punctuation\">)</span> <span class=\"token keyword\">return</span> <span class=\"token punctuation\">[</span><span class=\"token punctuation\">]</span>\n  <span class=\"token keyword\">return</span> <span class=\"token punctuation\">[</span><span class=\"token operator\">...</span><span class=\"token function\">postorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">.</span>left<span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token operator\">...</span><span class=\"token function\">postorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">.</span>right<span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> root<span class=\"token punctuation\">.</span>val<span class=\"token punctuation\">]</span>\n<span class=\"token punctuation\">}</span>\n\n<span class=\"token comment\">// 레벨 순서 탐색 (BFS)</span>\n<span class=\"token keyword\">function</span> <span class=\"token function\">levelOrder</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">root</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span><span class=\"token operator\">!</span>root<span class=\"token punctuation\">)</span> <span class=\"token keyword\">return</span> <span class=\"token punctuation\">[</span><span class=\"token punctuation\">]</span>\n  <span class=\"token keyword\">const</span> result <span class=\"token operator\">=</span> <span class=\"token punctuation\">[</span><span class=\"token punctuation\">]</span>\n  <span class=\"token keyword\">const</span> q <span class=\"token operator\">=</span> <span class=\"token punctuation\">[</span>root<span class=\"token punctuation\">]</span>\n  \n  <span class=\"token keyword\">while</span> <span class=\"token punctuation\">(</span>q<span class=\"token punctuation\">.</span>length<span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n    <span class=\"token keyword\">const</span> node <span class=\"token operator\">=</span> q<span class=\"token punctuation\">.</span><span class=\"token function\">shift</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span>\n    result<span class=\"token punctuation\">.</span><span class=\"token function\">push</span><span class=\"token punctuation\">(</span>node<span class=\"token punctuation\">.</span>val<span class=\"token punctuation\">)</span>\n    <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>node<span class=\"token punctuation\">.</span>left<span class=\"token punctuation\">)</span> q<span class=\"token punctuation\">.</span><span class=\"token function\">push</span><span class=\"token punctuation\">(</span>node<span class=\"token punctuation\">.</span>left<span class=\"token punctuation\">)</span>\n    <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>node<span class=\"token punctuation\">.</span>right<span class=\"token punctuation\">)</span> q<span class=\"token punctuation\">.</span><span class=\"token function\">push</span><span class=\"token punctuation\">(</span>node<span class=\"token punctuation\">.</span>right<span class=\"token punctuation\">)</span>\n  <span class=\"token punctuation\">}</span>\n  \n  <span class=\"token keyword\">return</span> result\n<span class=\"token punctuation\">}</span>\n\n<span class=\"token comment\">// 예시 트리</span>\n<span class=\"token comment\">//       1</span>\n<span class=\"token comment\">//      / \\</span>\n<span class=\"token comment\">//     2   3</span>\n<span class=\"token comment\">//    / \\</span>\n<span class=\"token comment\">//   4   5</span>\n<span class=\"token keyword\">const</span> root <span class=\"token operator\">=</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">TreeNode</span><span class=\"token punctuation\">(</span><span class=\"token number\">1</span><span class=\"token punctuation\">,</span>\n  <span class=\"token keyword\">new</span> <span class=\"token class-name\">TreeNode</span><span class=\"token punctuation\">(</span><span class=\"token number\">2</span><span class=\"token punctuation\">,</span>\n    <span class=\"token keyword\">new</span> <span class=\"token class-name\">TreeNode</span><span class=\"token punctuation\">(</span><span class=\"token number\">4</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span>\n    <span class=\"token keyword\">new</span> <span class=\"token class-name\">TreeNode</span><span class=\"token punctuation\">(</span><span class=\"token number\">5</span><span class=\"token punctuation\">)</span>\n  <span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span>\n  <span class=\"token keyword\">new</span> <span class=\"token class-name\">TreeNode</span><span class=\"token punctuation\">(</span><span class=\"token number\">3</span><span class=\"token punctuation\">)</span>\n<span class=\"token punctuation\">)</span>\n\nconsole<span class=\"token punctuation\">.</span><span class=\"token function\">log</span><span class=\"token punctuation\">(</span><span class=\"token function\">preorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>   <span class=\"token comment\">// [1, 2, 4, 5, 3]</span>\nconsole<span class=\"token punctuation\">.</span><span class=\"token function\">log</span><span class=\"token punctuation\">(</span><span class=\"token function\">inorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>    <span class=\"token comment\">// [4, 2, 5, 1, 3]</span>\nconsole<span class=\"token punctuation\">.</span><span class=\"token function\">log</span><span class=\"token punctuation\">(</span><span class=\"token function\">postorder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>  <span class=\"token comment\">// [4, 5, 2, 3, 1]</span>\nconsole<span class=\"token punctuation\">.</span><span class=\"token function\">log</span><span class=\"token punctuation\">(</span><span class=\"token function\">levelOrder</span><span class=\"token punctuation\">(</span>root<span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span> <span class=\"token comment\">// [1, 2, 3, 4, 5]</span></code></pre></div>\n<h2 id=\"데모\" style=\"position:relative;\"><a href=\"#%EB%8D%B0%EB%AA%A8\" aria-label=\"데모 permalink\" class=\"anchor-header before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>데모</h2>\n<p><a href=\"https://codepen.io/pen/?template=yLgbWPj\">https://codepen.io/pen/?template=yLgbWPj</a></p>","tableOfContents":"<ul>\n<li><a href=\"/algorithm/%ED%8A%B8%EB%A6%AC-%EC%88%9C%ED%9A%8C-tree-traversal/#%EC%A0%95%EC%9D%98\">정의</a></li>\n<li><a href=\"/algorithm/%ED%8A%B8%EB%A6%AC-%EC%88%9C%ED%9A%8C-tree-traversal/#%EA%B5%AC%ED%98%84\">구현</a></li>\n<li><a href=\"/algorithm/%ED%8A%B8%EB%A6%AC-%EC%88%9C%ED%9A%8C-tree-traversal/#%EB%8D%B0%EB%AA%A8\">데모</a></li>\n</ul>","wordCount":{"words":200},"fields":{"slug":"/algorithm/트리-순회-tree-traversal/","image":"/assets/algorithm.png","faq":[]},"frontmatter":{"title":"트리 순회 (Tree Traversal)","date":"2025년 11월 1일","dateISO":"2025-11-01T00:00:00.000Z","updatedISO":null,"category":"algorithm","description":"이진 트리에서 노드를 방문하는 순서를 다르게 하는 세 가지 순회 방법. 전위, 중위, 후위 순회로 나뉘며 재귀 또는 스택으로 구현 가능하다.","tags":["트리 순회","Tree Traversal","전위 순회","중위 순회","후위 순회","알고리즘","Algorithm","JavaScript"]}}},"pageContext":{"slug":"/algorithm/트리-순회-tree-traversal/","previous":{"fields":{"slug":"/algorithm/깊이우선탐색-depth-first-search/"},"frontmatter":{"title":"깊이 우선 탐색 (Depth-First Search, DFS)","tags":["깊이 우선 탐색","Depth-First Search","DFS","알고리즘","Algorithm","JavaScript"]}},"next":{"fields":{"slug":"/algorithm/최장-공통-부분수열-lcs/"},"frontmatter":{"title":"최장 공통 부분수열 (LCS)","tags":["최장 공통 부분수열","LCS","Longest Common Subsequence","동적 계획법","알고리즘","Algorithm","JavaScript"]}}}},"staticQueryHashes":["213619243","3262363727"]}