Computer >> 컴퓨터 >  >> 프로그래밍 >> Java

자바스크립트에서 객체의 값을 추출하는 방법: Object.values() vs Underscore.js _.values()

자바스크립트에서 객체(object)의 값들을 가져오는 대표적인 방법으로 Object.values() 메서드가 있습니다. 하지만 이 메서드를 활용해 실제로 값을 출력하려면 별도의 반복문(for-loop)을 작성해야 하는 번거로움이 있습니다. 이러한 불편함을 줄이기 위해 자바스크립트 라이브러리인 Underscore.js는 _.values()라는 편리한 메서드를 제공합니다.

_.values() 메서드는 반복문 없이도 객체의 모든 값을 한 번에 직접 추출할 수 있어 코드가 훨씬 간결해진다는 장점이 있습니다.

Object.values()를 사용하는 예제

다음 예제는 Object.values() 메서드를 사용하여 객체의 값을 출력합니다. 이 방식은 값을 하나씩 꺼내기 위해 for...of 반복문을 함께 사용해야 합니다.

<html>
<body>
<script>
    var user = {
      name: "Rahim",
      designation: "content developer"
    };
    for (let value of Object.values(user)) {
        document.write(value + "</br>");
    }
</script>
</body>
</html>

실행 결과

Rahim
content developer

위 예제에서 볼 수 있듯이, Object.values()만으로는 배열 형태로 값이 반환되기 때문에 화면에 출력하려면 반복문으로 각 요소를 순회해야 합니다.

Underscore.js의 _.values()를 사용하는 예제

반면, 다음 예제처럼 _.values() 메서드를 사용하면 반복문 없이 객체의 값들을 바로 배열로 얻을 수 있습니다. 훨씬 직관적이고 간단한 방식입니다.

<html>
<body>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script>
    <script>
        var res = JSON.stringify(_.values({"name": 'ElonMusk', age: 47, "Organization":'Spacex' }));
        document.write((res));
    </script>
</body>
</html>

실행 결과

["ElonMusk",47,"Spacex"]

_.values()는 객체 내부의 모든 프로퍼티 값을 배열 형태로 즉시 반환하기 때문에, 추가적인 가공이나 출력 작업이 필요할 때 특히 유용합니다. 참고로 최신 자바스크립트 환경이라면 ES2017(ES8)부터 도입된 Object.values()가 표준으로 지원되므로, 외부 라이브러리 없이 이를 사용하는 것이 일반적입니다.