[javascript] JavaScript 객체를 반복하거나 열거하는 방법

 

다음과 같은 JavaScript 객체가 있습니다.

var p = {
    "p1": "value1",
    "p2": "value2",
    "p3": "value3"
};

지금은 모든을 통해 루프를 원하는 p요소 ( p1, p2, p3…) 그리고 자신의 키와 값을 얻는다. 어떻게해야합니까?

필요한 경우 JavaScript 객체를 수정할 수 있습니다. 내 궁극적 인 목표는 일부 키 값 쌍을 반복하는 것이며 가능한 경우을 사용하지 않기를 원합니다 eval.

1. for in

for-in다른 사람들이 보여주는 것처럼 루프를 사용할 수 있습니다 . 그러나 얻는 키가 객체의 실제 속성이며 프로토 타입에서 가져 오지 않았는지 확인해야합니다.

스 니펫은 다음과 같습니다.

var p = {
    "p1": "value1",
    "p2": "value2",
    "p3": "value3"
};

for (var key in p) {
    if (p.hasOwnProperty(key)) {
        console.log(key + " -> " + p[key]);
    }
}

코드 스 니펫 실행

스 니펫 확장

Object.keys () 대안으로 :

2. for of

var p = {
    0: "value1",
    "b": "value2",
    key: "value3"
};

for (var key of Object.keys(p)) {
    console.log(key + " -> " + p[key])
}

코드 스 니펫 실행

스 니펫 확장

사용주의 for-of대신을 for-in, 그것은 명명 된 속성에 정의되지 않은, 그리고 반환됩니다 사용하지 않을 경우 Object.keys()전체 프로토 타입 체인 특성없이 개체 만의 고유 속성의 사용을 보장합니다

새로운 Object.entries()방법 사용 하기 :

 

참고 : 이 방법은 Internet Explorer에서 기본적으로 지원되지 않습니다. 구형 브라우저에는 Polyfill 사용을 고려할 수 있습니다.

const p = {
    "p1": "value1",
    "p2": "value2",
    "p3": "value3"
};

for (let [key, value] of Object.entries(p)) {
  console.log(`${key}: ${value}`);
}