개발자 Q&A

개발하다 막혔다면? 여기서 질문하세요! 초보부터 고수까지, 함께 고민하고 해결하는 공간입니다. 누구나 자유롭게 질문하고 답변을 남겨보세요!

2025.08.07 00:22

Object.entries(obj)와 Array.prototype.forEach()를 사용하여 객체의 키-값 쌍을 출력하는 방법

목록
  • UX개발자 9시간 전 2025.08.07 00:22 새글
  • 1
    1
제가 Object.entries(obj)를 사용하여 객체의 키-값 쌍을 출력하려고 하는데, Array.prototype.forEach()를 사용할 때 어떤 문제가 있는지 모르겠습니다.

예를 들어, 다음 객체를 살펴보겠습니다.

javascript

const obj = {

  'name': 'John Doe',

  'age': 30,

  'city': 'New York'

};



이 객체를 Object.entries(obj)로 변환하고, Array.prototype.forEach()를 사용하여 키-값 쌍을 출력하려고 합니다. 하지만, forEach() 메서드는 undefined를 반환하네요.

javascript

const entries = Object.entries(obj);

entries.forEach(([key, value]) => {

  console.log(`${key}: ${value}`);

});



왜 forEach() 메서드는 undefined를 반환할까요?

혹시 제가 Object.entries(obj)를 사용할 때 잘못된 방법을 사용하고 있는지 알려주세요.

    댓글목록

    profile_image
    나우호스팅  9시간 전



    Object.entries(obj)는 객체의 키-값 쌍을 배열로 반환합니다. 이 배열의 각 요소는 [키, 값] 형식의 배열입니다.

    Array.prototype.forEach()는 배열의 각 요소를 순회하며 콜백 함수를 실행합니다.

    forEach() 메서드는 undefined를 반환하는 것은 일반적인 동작이 아닙니다.

    문제는 forEach() 메서드가 반환하는 undefined는 콜백 함수의 반환값이 undefined인 경우에만 반환됩니다.

    따라서, forEach() 메서드의 콜백 함수에서 console.log()를 사용하여 콘솔에 출력하는 경우, undefined를 반환하지 않습니다.

    하지만, forEach() 메서드의 반환값을 변수에 할당하거나, 다른 연산에 사용하는 경우 undefined를 반환할 수 있습니다.

    예를 들어, 다음과 같이 forEach() 메서드를 사용하여 키-값 쌍을 출력하는 코드를 작성할 수 있습니다.

    #hostingforum.kr
    javascript
    
    const obj = {
    
      'name': 'John Doe',
    
      'age': 30,
    
      'city': 'New York'
    
    };
    
    
    
    const entries = Object.entries(obj);
    
    entries.forEach(([key, value]) => {
    
      console.log(`${key}: ${value}`);
    
    });
    
    


    이 코드는 키-값 쌍을 콘솔에 출력합니다.

    하지만, 다음과 같이 forEach() 메서드의 반환값을 변수에 할당하는 코드를 작성할 경우, undefined를 반환할 수 있습니다.

    #hostingforum.kr
    javascript
    
    const obj = {
    
      'name': 'John Doe',
    
      'age': 30,
    
      'city': 'New York'
    
    };
    
    
    
    const entries = Object.entries(obj);
    
    const result = entries.forEach(([key, value]) => {
    
      console.log(`${key}: ${value}`);
    
    });
    
    console.log(result); // undefined
    
    


    이 코드는 undefined를 콘솔에 출력합니다.

    따라서, forEach() 메서드의 반환값을 변수에 할당하거나, 다른 연산에 사용하는 경우 undefined를 반환할 수 있습니다.

    Object.entries(obj)를 사용할 때 잘못된 방법을 사용하고 있는지 알려드릴 수는 없지만, forEach() 메서드의 반환값을 변수에 할당하거나, 다른 연산에 사용하지 않는 것이 좋습니다.

    대신, forEach() 메서드를 사용하여 키-값 쌍을 출력하는 코드를 작성할 수 있습니다.

    #hostingforum.kr
    javascript
    
    const obj = {
    
      'name': 'John Doe',
    
      'age': 30,
    
      'city': 'New York'
    
    };
    
    
    
    Object.entries(obj).forEach(([key, value]) => {
    
      console.log(`${key}: ${value}`);
    
    });
    
    


    이 코드는 키-값 쌍을 콘솔에 출력합니다.

    또한, forEach() 메서드 대신, for...of 문을 사용할 수 있습니다.

    #hostingforum.kr
    javascript
    
    const obj = {
    
      'name': 'John Doe',
    
      'age': 30,
    
      'city': 'New York'
    
    };
    
    
    
    for (const [key, value] of Object.entries(obj)) {
    
      console.log(`${key}: ${value}`);
    
    }
    
    


    이 코드는 키-값 쌍을 콘솔에 출력합니다.

    forEach() 메서드 대신, for...of 문을 사용하는 것이 좋습니다.

    forEach() 메서드는 배열의 각 요소를 순회하며 콜백 함수를 실행합니다.

    but, for...of 문은 배열의 각 요소를 순회하며 반복 변수를 선언합니다.

    따라서, for...of 문은 더 안전하고, 더 효율적인 방법입니다.

    forEach() 메서드 대신, for...of 문을 사용하는 것이 좋습니다.

    2025-08-07 00:23

  • 개발자 Q&A 포인트 정책
      글쓰기
      50P
      댓글
      10P
  • 전체 42,117건 / 5 페이지

검색

게시물 검색