JavaScript 개체의 속성을 열거하려면 어떻게 해야 합니까?

JavaScript 개체의 속성을 열거하려면 어떻게 해야 합니까?

이 질문에는 이미 답변이 있습니다.

JavaScript 개체를 루프하거나 열거하려면 어떻게 해야 합니까? (47개 답변)

닫힘6년 전에요.

JavaScript 개체의 속성을 열거하려면 어떻게 해야 합니까?

정의된 변수와 값을 모두 나열하고 싶은데 변수를 정의하면 실제로 창 객체의 속성이 생성된다는 것을 배웠습니다.

매우 심플:

for(var propertyName in myObject) {
   // propertyName is what you want
   // you can get the value like this: myObject[propertyName]
}

개인 변수는 사용할 수 없기 때문에 이 방법으로는 얻을 수 없습니다.

---

편집: @bitwiseplatypus가 옳습니다.hasOwnProperty()method, 당신은 상속된 속성을 얻게 될 것입니다 - 하지만 객체 지향 프로그래밍에 익숙한 사람이 왜 그 이하를 기대하는지 모르겠습니다!일반적으로, 이 문제를 제기하는 누군가가 더글라스 크록포드의 경고를 받았기 때문에, 아직도 좀 혼란스럽습니다.다시 말하지만, 상속은 OO 언어의 일반적인 부분이며, 따라서 프로토타입임에도 불구하고 JavaScript의 일부입니다.

자, 그 말은hasOwnProperty() 필터링에는 유용하지만 상속 재산을 취득하는 데 위험한 일이 있는 것처럼 경고음을 울릴 필요는 없습니다.

편집 2: @bitwiseplatypus는 처음에 (프로토타입에서) 오브젝트를 썼을 때보다 나중에 다른 사람이 오브젝트에 속성이나 메서드를 추가했을 때 발생할 수 있는 상황을 야기합니다.이 때문에 예기치 않은 동작이 발생할 수 있는 것은 사실이지만, 개인적으로는 전혀 제 문제라고 생각하지 않습니다.그냥 의견의 문제일 뿐이야.게다가 오브젝트 작성 중에 프로토타입을 사용하여 오브젝트의 속성을 반복하는 코드를 가진 상태에서 상속된 모든 속성을 원하는 경우 어떻게 해야 합니까?나는 사용하지 않을 것이다.hasOwnProperty()그 후 누군가가 새로운 속성을 추가했다고 칩시다.그때 상황이 안 좋으면 그게 내 잘못인가요?난 그렇게 생각 안 해.이것이 바로 jQuery가 예를 들어 동작 방식을 확장하는 방법을 지정한 이유라고 생각합니다.jQuery.extend그리고.jQuery.fn.extend).

를 사용하다for..in루프를 클릭하여 오브젝트의 속성을 열거하지만 주의해야 합니다.열거는 열거 중인 개체의 속성뿐만 아니라 상위 개체의 프로토타입에서도 속성을 반환합니다.

var myObject = {foo: 'bar'};

for (var name in myObject) {
  alert(name);
}

// results in a single alert of 'foo'

Object.prototype.baz = 'quux';

for (var name in myObject) {
  alert(name);
}

// results in two alerts, one for 'foo' and one for 'baz'

되지 않도록 , 「 」를 .hasOwnProperty():

for (var name in myObject) {
  if (myObject.hasOwnProperty(name)) {
    alert(name);
  }
}

편집: 상속된 자산을 열거하는 것에 대해 걱정할 필요가 없다는 JasonBunting의 진술에 동의하지 않습니다.예상하지 못한 상속 속성을 열거하면 코드의 동작이 변경될 수 있으므로 위험이 있습니다.

이 문제가 다른 언어에도 존재하는지 여부는 중요하지 않습니다. 사실 이 문제는 존재하며, JavaScript는 인스턴스화 후에 수정이 이루어지더라도 개체의 프로토타입에 대한 수정이 하위 개체에 영향을 미치기 때문에 특히 취약합니다.

가 'JavaScript'를 제공하는 입니다.hasOwnProperty()따라서 서드파티 코드(또는 프로토타입을 수정할 수 있는 기타 코드)가 파손되지 않도록 하기 위해 이 코드를 사용해야 합니다.하는 것 외에, 코드 바이트를 몇 바이트 추가하는 것 에 코드 바이트를 사용해도 문제 .hasOwnProperty().

이미 여러 번 제안된 표준 방법은 다음과 같습니다.

for (var name in myObject) {
  alert(name);
}

그러나 Internet Explorer 6, 7, 8에서는 JavaScript 인터프리터에 오류가 있어 일부 키가 열거되지 않습니다.이 코드를 실행하는 경우:

var obj = { toString: 12};
for (var name in obj) {
  alert(name);
}

IE를 제외한 모든 브라우저에서 "12"로 경고합니다.IE는 이 키를 무시합니다.영향을 받는 키 값은 다음과 같습니다.

• isPrototypeOf
• hasOwnProperty
• toLocaleString
• toString
• valueOf

IE에서 정말 안전하려면 다음과 같은 방법을 사용해야 합니다.

for (var key in myObject) {
  alert(key);
}

var shadowedKeys = [
  "isPrototypeOf",
  "hasOwnProperty",
  "toLocaleString",
  "toString",
  "valueOf"
];
for (var i=0, a=shadowedKeys, l=a.length; i<l; i++) {
  if map.hasOwnProperty(a[i])) {
    alert(a[i]);
  }
}

는 EcmaScript 5를 하고 있습니다.Object.keys(myObject)이 함수는 오브젝트의 키를 어레이로 반환하고 일부 브라우저(Safari 4 등)에서 이미 구현되어 있습니다.

최신 브라우저(ECMAScript 5)에서는 열거 가능한 모든 속성을 가져올 수 있습니다.

Object.keys(obj) (이전 브라우저에서의 하위 호환성에 대한 스니펫을 가져오려면 링크를 확인하십시오.)

또는 열거할 수 없는 속성도 가져옵니다.

Object.getOwnPropertyNames(obj)

ECMAScript 5 호환성 표 확인

추가 정보:열거형 속성이란 무엇입니까?

내가 깜짝 놀랐던 사례의 한 예가 관련이 있다고 생각한다.

var myObject = { name: "Cody", status: "Surprised" };
for (var propertyName in myObject) {
  document.writeln( propertyName + " : " + myObject[propertyName] );
}

하지만 놀랍게도, 결과는

name : Cody
status : Surprised
forEach : function (obj, callback) {
    for (prop in obj) {
        if (obj.hasOwnProperty(prop) && typeof obj[prop] !== "function") {
            callback(prop);
        }
    }
}

왜요? 페이지의 다른 스크립트에서 개체 프로토타입을 확장했습니다.

Object.prototype.forEach = function (obj, callback) {
  for ( prop in obj ) {
    if ( obj.hasOwnProperty( prop ) && typeof obj[prop] !== "function" ) {
      callback( prop );
    }
  }
};

for (prop in obj) {
    alert(prop + ' = ' + obj[prop]);
}

간단한 JavaScript 코드:

for(var propertyName in myObject) {
   // propertyName is what you want.
   // You can get the value like this: myObject[propertyName]
}

j쿼리:

jQuery.each(obj, function(key, value) {
   // key is what you want.
   // The value is in: value
});

개체의 속성을 열거하는 방법은 다음과 같습니다.

var params = { name: 'myname', age: 'myage' }

for (var key in params) {
  alert(key + "=" + params[key]);
}

★★★★★★★★★★★★。for (property in object) { // do stuff }는 모든 속성을 나열합니다.따라서 윈도 오브젝트에 글로벌하게 선언된 모든 변수가 표시됩니다.

.for루프의

어레이를 사용하는 경우:

Object.keys(object1)

참조: Object.keys()

Underscore.js 라이브러리를 사용하는 경우 함수 키를 사용할 수 있습니다.

_.keys({one : 1, two : 2, three : 3});
=> ["one", "two", "three"]

Python의 dict에는 '키' 메서드가 있어 매우 유용합니다.JavaScript에는 다음과 같은 것이 있습니다.

function keys(){
    var k = [];
    for(var p in this) {
        if(this.hasOwnProperty(p))
            k.push(p);
    }
    return k;
}
Object.defineProperty(Object.prototype, "keys", { value : keys, enumerable:false });

편집: 하지만 @carlos-ruana의 답변은 매우 효과적입니다.Object.keys(윈도)를 테스트했더니 예상대로 결과가 나왔습니다.

후 : 5년 연장하는 않습니다.Object 다른 할 수 있기 keys@는 사물의입니다.@swer-ruana answer 。

오브젝트에 대해 새로운 코드를 쓰기 위해 속성을 열거하려고 한다면 Firebug와 같은 디버거를 사용하여 시각적으로 확인할 것을 권장합니다.

또 하나의 편리한 기술은 프로토타입의 Object.toJSON()을 사용하여 객체를 JSON으로 시리얼화하면 속성 이름과 값이 모두 표시됩니다.

var data = {name: 'Violet', occupation: 'character', age: 25, pets: ['frog', 'rabbit']};
Object.toJSON(data);
//-> '{"name": "Violet", "occupation": "character", "age": 25, "pets": ["frog","rabbit"]}'

http://www.prototypejs.org/api/object/tojson

저는 아직 JavaScript 초보자이지만 객체와 객체의 모든 속성을 재귀적으로 인쇄하는 작은 함수를 썼습니다.

getDescription(object, tabs) {
  var str = "{\n";
  for (var x in object) {
      str += Array(tabs + 2).join("\t") + x + ": ";
      if (typeof object[x] === 'object' && object[x]) {
        str += this.getDescription(object[x], tabs + 1);
      } else {
        str += object[x];
      }
      str += "\n";
  }
  str += Array(tabs + 1).join("\t") + "}";
  return str;
}

언급URL : https://stackoverflow.com/questions/85992/how-do-i-enumerate-the-properties-of-a-javascript-object