[javaScript] 자식 노드 탐색 (재귀)

기존 tree 라이브러리의 getNodeByKey함수를 사용하던 것을 div로 바꾸면서 만든 특정 key값를 가진 노드를 찾는 함수입니다.

const objArr = [
  { id: 1, name: 'Alice', children: [{ id: 11, name: 'Bob' }] },
  { id: 2, name: 'Charlie', children: [{ id: 21, name: 'Dave' }] }
];
const key = 'Bob';
let node = getNodeByKey(objArr, key);
    
function getNodeByKey(arr, value) {
  let result = null;

  for (let i = 0; i < arr.length; i++) {
    const obj = arr[i];
    if (obj.key  == value) {
      // key를 가진 값을 찾은 경우
      result = obj;
      break;
    } else if (Array.isArray(obj.children)) {
      // 자식 노드가 있는 경우 재귀적으로 탐색
      result = getNodeByKey(obj.children, value);
      if (result != null) {
        break;
      }
    }
  }

  return result;
}

 

만약 key 값이 아니라 특정 속성을 가진 노드를 찾고 싶으면 아래 코드로 찾을 수 있습니다.

const objArr = [
  { id: 1, name: 'Alice', children: [{ id: 11, name: 'Bob' }] },
  { id: 2, name: 'Charlie', children: [{ id: 21, name: 'Dave' }] }
];
const key = 'name';
let node = getNodeByKey(objArr, key);

function findValueByKey(arr, key) {
  let result = null;

  for (let i = 0; i < arr.length; i++) {
    const obj = arr[i];

	if(typeof obj != 'object' ){
    	continue;
    }
    if (obj.hasOwnProperty(key)) {
      // key를 가진 값을 찾은 경우
      result = obj[key];
      break;
    } else if (!Array.isArray(obj)) {
      // 자식 노드가 있는 경우 재귀적으로 탐색
      result = findValueByKey(Object.values(obj), key);
      if (result !== null) {
        break;
      }
    }
  }

  return result;
}