JavaScript 객체의 속성을 나열하는 방법은 무엇입니까?

따라서 객체를 생성한다고 가정 해보십시오.

var myObject =
        {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

속성 이름 목록을 검색하는 가장 좋은 방법은 무엇입니까? 즉, 다음과 같은 변수 '키'로 끝나고 싶습니다.

keys == ["ircEvent", "method", "regex"]

최신 브라우저 (IE9 +, FF4 +, Chrome5 +, Opera12 +, Safari5 +)에서는 내장 Object.keys 메소드를 사용할 수 있습니다 .

var keys = Object.keys(myObject);

위는 완전한 폴리 필을 가지고 있지만 단순화 된 버전은 다음과 같습니다.

var getKeys = function(obj){
   var keys = [];
   for(var key in obj){
      keys.push(key);
   }
   return keys;
}

또는로 교체 var getKeys하여 객체 Object.prototype.keys를 호출 할 수 있습니다 .keys(). 프로토 타입을 확장하면 부작용이 생길 수 있으므로 권장하지 않습니다.

으로 slashnick는 지적, 당신은 그 속성 이름에 대한 개체를 반복하는 구조 "에 대한"를 사용할 수 있습니다. 그러나 객체의 프로토 타입 체인에서 모든 속성 이름을 반복하게됩니다. 객체 자체의 속성에 대해서만 반복 하려면 Object # hasOwnProperty () 메서드를 사용할 수 있습니다 . 따라서 다음과 같은 것이 있습니다.

for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
        /* useful code here */
    }
}

Sam Dutton이 대답하자마자이 목적을위한 새로운 방법이 ECMAScript 5th Edition에 도입되었습니다. Firefox 4 , Chrome 6, Safari 5 및 IE 9Object.keys() 에서 원하는 작업을 수행합니다 .

메소드를 지원하지 않는 브라우저에서 메소드를 매우 쉽게 구현할 수도 있습니다. 그러나 일부 구현은 Internet Explorer와 완전히 호환되지 않습니다. 보다 호환 가능한 솔루션은 다음과 같습니다.

Object.keys = Object.keys || (function () {
    var hasOwnProperty = Object.prototype.hasOwnProperty,
        hasDontEnumBug = !{toString:null}.propertyIsEnumerable("toString"),
        DontEnums = [ 
            'toString', 'toLocaleString', 'valueOf', 'hasOwnProperty',
            'isPrototypeOf', 'propertyIsEnumerable', 'constructor'
        ],
        DontEnumsLength = DontEnums.length;

    return function (o) {
        if (typeof o != "object" && typeof o != "function" || o === null)
            throw new TypeError("Object.keys called on a non-object");

        var result = [];
        for (var name in o) {
            if (hasOwnProperty.call(o, name))
                result.push(name);
        }

        if (hasDontEnumBug) {
            for (var i = 0; i < DontEnumsLength; i++) {
                if (hasOwnProperty.call(o, DontEnums[i]))
                    result.push(DontEnums[i]);
            }   
        }

        return result;
    };
})();

현재 허용되는 답변에는 hasOwnProperty ()에 대한 검사가 포함되어 있지 않으며 프로토 타입 체인을 통해 상속 된 속성을 반환합니다. 또한 프로토 타입 체인에서 열거 할 수없는 속성으로 인해 같은 이름을 가진 로컬로 선언 된 속성이 DontEnum 속성을 상속하는 Internet Explorer의 유명한 DontEnum 버그를 설명하지 않습니다.

Object.keys () 를 구현 하면 보다 강력한 솔루션을 얻을 수 있습니다.

편집 : 프로토 타입에 잘 알려진 kangax 와의 최근 토론에 이어 , 여기 에있는 그의 Object.forIn()기능 코드를 기반으로 DontEnum 버그에 대한 해결 방법을 구현했습니다 .

Object.keys 및 기타 ECMAScript 5 방법은 Firefox 4, Chrome 6, Safari 5, IE 9 이상에서 지원됩니다.

예를 들면 다음과 같습니다.

var o = {"foo": 1, "bar": 2}; 
alert(Object.keys(o));

ECMAScript 5 호환성 표 : http://kangax.github.com/es5-compat-table/

새로운 방법에 대한 설명 : http://markcaudill.com/index.php/2009/04/javascript-new-features-ecma5/

Object.getOwnPropertyNames(obj)

이 함수는로 표시되는 속성 외에 열거 할 수없는 속성도 표시합니다 Object.keys(obj).

JS에서 모든 속성에는 boolean을 포함하여 몇 가지 속성이 enumerable있습니다.

일반적으로 열거 할 수없는 속성은 "내부"이고 덜 자주 사용되지만 실제 상황을 확인하기 위해 가끔 살펴 보는 것이 통찰력이 있습니다.

예:

var o = Object.create({base:0})
Object.defineProperty(o, 'yes', {enumerable: true})
Object.defineProperty(o, 'not', {enumerable: false})

console.log(Object.getOwnPropertyNames(o))
// [ 'yes', 'not' ]

console.log(Object.keys(o))
// [ 'yes' ]

for (var x in o)
    console.log(x)
// yes, base

또한 방법에 유의하십시오.

• Object.getOwnPropertyNames그리고 Object.keys 하지 않습니다 찾기 위해 프로토 타입 체인을 이동base
• for in 않습니다

프로토 타입 체인에 대한 자세한 내용은 여기 ( https://stackoverflow.com/a/23877420/895245)

나는 덤프 기능을 좋아합니다.

http://ajaxian.com/archives/javascript-variable-dump-in-coldfusion

다음과 같이 jQuery로 수행 할 수 있습니다.

var objectKeys = $.map(object, function(value, key) {
  return key;
});

함수만이 아닌 요소 만 얻으려고하면이 코드가 도움이 될 수 있습니다

this.getKeys = function() {

    var keys = new Array();
    for(var key in this) {

        if( typeof this[key] !== 'function') {

            keys.push(key);
        }
    }
    return keys;
}

이것은 HashMap 구현의 일부이며 키만 원합니다. "this"는 키가 포함 된 해시 맵 객체입니다.

이것은 IE8에서도 대부분의 브라우저에서 작동하며 어떤 종류의 라이브러리도 필요하지 않습니다. var i는 당신의 열쇠입니다.

var myJSONObject =  {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}; 
var keys=[];
for (var i in myJSONObject ) { keys.push(i); }
alert(keys);

js 1.8을 지원하는 브라우저에서 :

[i for(i in obj)]

Mozilla는 지원되지 않는 브라우저에서 지원하는 방법에 대한 자세한 구현 세부 정보 를 제공합니다.

if (!Object.keys) {
  Object.keys = (function () {
    var hasOwnProperty = Object.prototype.hasOwnProperty,
        hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
        dontEnums = [
          'toString',
          'toLocaleString',
          'valueOf',
          'hasOwnProperty',
          'isPrototypeOf',
          'propertyIsEnumerable',
          'constructor'
        ],
        dontEnumsLength = dontEnums.length;

    return function (obj) {
      if (typeof obj !== 'object' && typeof obj !== 'function' || obj === null) throw new TypeError('Object.keys called on non-object');

      var result = [];

      for (var prop in obj) {
        if (hasOwnProperty.call(obj, prop)) result.push(prop);
      }

      if (hasDontEnumBug) {
        for (var i=0; i < dontEnumsLength; i++) {
          if (hasOwnProperty.call(obj, dontEnums[i])) result.push(dontEnums[i]);
        }
      }
      return result;
    };
  })();
}

원하는대로 포함시킬 수도 있지만 extensions.js스크립트 스택 맨 위에 있는 일종의 파일에 포함시킬 수도 있습니다 .

사용하다 Reflect.ownKeys()

var obj = {a: 1, b: 2, c: 3};
Reflect.ownKeys(obj) // ["a", "b", "c"]

Object.keys 및 Object.getOwnPropertyNames 는 열거 할 수없는 속성을 가져올 수 없습니다 . 열거 할 수 없는 속성 에서도 작동 합니다.

var obj = {a: 1, b: 2, c: 3};
obj[Symbol()] = 4;
Reflect.ownKeys(obj) // ["a", "b", "c", Symbol()]

IE는 기본 속성에 대해 (i에서 obj)를 지원하지 않습니다. 내가 찾을 수있는 모든 소품의 목록입니다.

stackoverflow가 바보 같은 필터링을 수행하는 것 같습니다.

목록은이 Google 그룹 게시물의 맨 아래에 있습니다 .- https://groups.google.com/group/hackvertor/browse_thread/thread/a9ba81ca642a63e0

내가 사용하기 때문에 underscore.js을 거의 모든 프로젝트에, 내가 사용하는 것이 keys기능 :

var obj = {name: 'gach', hello: 'world'};
console.log(_.keys(obj));

그 결과는 다음과 같습니다.

['name', 'hello']

허용 된 답변을 바탕으로합니다.

Object에 .properties ()라고 부르는 속성이 있으면 시도하십시오!

var keys = Object.keys(myJSONObject);

for (var j=0; j < keys.length; j++) {
  Object[keys[j]].properties();
}

이 솔루션은 내 경우와 크로스 브라우저에서 작동합니다.

var getKeys = function(obj) {
    var type = typeof  obj;
    var isObjectType = type === 'function' || type === 'object' || !!obj;

    // 1
    if(isObjectType) {
        return Object.keys(obj);
    }

    // 2
    var keys = [];
    for(var i in obj) {
        if(obj.hasOwnProperty(i)) {
            keys.push(i)
        }
    }
    if(keys.length) {
        return keys;
    }

    // 3 - bug for ie9 <
    var hasEnumbug = !{toString: null}.propertyIsEnumerable('toString');
    if(hasEnumbug) {
        var nonEnumerableProps = ['valueOf', 'isPrototypeOf', 'toString',
            'propertyIsEnumerable', 'hasOwnProperty', 'toLocaleString'];

        var nonEnumIdx = nonEnumerableProps.length;

        while (nonEnumIdx--) {
            var prop = nonEnumerableProps[nonEnumIdx];
            if (Object.prototype.hasOwnProperty.call(obj, prop)) {
                keys.push(prop);
            }
        }

    }

    return keys;
};