JavaScript 객체 키 목록 가져 오기


295

나는 JavaScript 객체를 가지고있다.

var obj = {
   key1: 'value1',
   key2: 'value2',
   key3: 'value3',
   key4: 'value4'
}

이 객체의 길이와 키 목록을 어떻게 얻을 수 있습니까?



@ TJ 나는 완전히 동일하지 않다고 생각합니다. 이것은 객체이고, 중복은 JSON 객체입니다.
GuyT

밑줄이 있으면 간단히 _.keys (your_object)
minhajul

1
2010 년 이후 상황이 바뀌 었으므로 가장 많이 답한 답변을 "답변"으로 받아들이는 것이 좋습니다.
Jonas Wilms

답변:


341

var obj = {
   key1: 'value1',
   key2: 'value2',
   key3: 'value3',
   key4: 'value4'
};
var keys = [];

for (var k in obj) keys.push(k);

alert("total " + keys.length + " keys: " + keys);


Javascript가 PHP와 같다고 생각하지 않습니다. 첫 번째 줄을 모두 건너 뛸 수 있습니까? 어쨌든 그렇게하는 것이 바람직하지 않습니다.
Bart van Heukelom

@Bart : 아니요. 첫 번째 줄은 JavaScript에서 필요합니다.
Daniel Vassallo

6
아래에서 사례에 대한 David Morrissey의 의견을 살펴보십시오. 때때로이 방법을 사용하면 원치 않는 프로토 타입 멤버가에 표시 될 수 있습니다 keys.

2
@pat : 객체 리터럴을 사용하는 경우 확장 할 때만 발생 Object.prototype하며 어쨌든 수행해서는 안됩니다. 그러나 커스텀 생성자에게는 맞습니다.
Sasha Chedygov

@BartvanHeukelom은 2010 년 6 월에도 개체를 암시 적으로 입력했음을 알리는 알림을 표시했습니다. []그것에 할당 (또는 array()그때)하면 배열로 만들어 안전하게 배열로 사용할 수 있습니다.
Niels Keurentjes

627

var obj = {
   key1: 'value1',
   key2: 'value2',
   key3: 'value3',
   key4: 'value4'
}
var keys = Object.keys(obj);
console.log('obj contains ' + keys.length + ' keys: '+  keys);

현재 대부분의 주요 브라우저 에서 지원 됩니다.


7
Chrome에서 작동한다는 사실은 둘 다 V8 자바 스크립트 엔진을 기반으로하므로 Node.js에서도 작동한다는 것을 의미합니다.
Homme Zwaagstra

9
요즘 @fet. 2 년 전에는 그리 많지 않았습니다.
AlbertEngelB

4
이것은 for(key in ob)! 와 다릅니다 . Object.keys프로토 타입의 키는 나열 .. in obj하지 않지만 그렇지 않습니다.
Albert

9
@fet windows7은 IE8과 함께 제공됩니다. 사람들이 IE8 사용을 중단 할 때까지 이것이 받아 들여질 수있는 방법은 없습니다.
snuggles

1
여기 developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… 이전 브라우저에서 올바르게 작동하고 최신 브라우저의 기능을 덮어 쓰지 않는 JavaScript 메소드를 찾을 수 있습니다. 또한 아래 답변을 참조하십시오.
산드로

27

Underscore.js는 변환을 매우 깨끗하게 만듭니다.

var keys = _.map(x, function(v, k) { return k; });

편집 : 나는 당신도 이것을 할 수있는 것을 놓쳤다.

var keys = _.keys(x);

실제 밑줄 소스가 맞습니다. : nativeKeys = Object.keys; hasOwnProperty = ObjProto.hasOwnProperty; .has = function (obj, key) {return hasOwnProperty.call (obj, key); }; _.keys = nativeKeys || function (obj) {if (obj! == Object (obj)) throw new TypeError ( '잘못된 객체'); var keys = []; for (obj의 var 키) if ( .has (obj, key)) keys.push (key); 리턴 키; };
미구엘 알레한드로 푸엔테스 로페즈

18

파생 된 prototype속성이 아닌 특정 객체에 특정한 키만 원하는 경우 :

function getKeys(obj) {
    var r = []
    for (var k in obj) {
        if (!obj.hasOwnProperty(k)) 
            continue
        r.push(k)
    }
    return r
}

예 :

var keys = getKeys({'eggs': null, 'spam': true})
var length = keys.length // access the `length` property as usual for arrays

4
var keys = new Array();
for(var key in obj)
{
   keys[keys.length] = key;
}

var keyLength = keys.length;

객체의 값에 액세스하려면 obj [key];


배열 인덱스를 증가시켜야합니다
Vivek

배열 인덱스는에 의해 자동으로 증가하며 keys.length, 각 반복마다 값이 삽입 될 때마다 반복마다 다릅니다.
KrekkieD

4
obj = {'a':'c','b':'d'}

당신은 시도 할 수 있습니다:

[index for (index in obj)] 

이것은 다음을 반환합니다 :

['a','b']

키 목록을 얻거나

[obj[index] for (index in obj)]

가치를 얻기 위해


Chrome v16.0.912.75에서는 작동하지 않지만 Firefox v10.0에서는 작동합니다.
RobM

4

Anurags 답변은 기본적으로 정확합니다. 그러나 Object.keys(obj)이전 브라우저에서도 지원 하려면 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys 에서 복사 된 아래 코드를 사용할 수 있습니다 . Object.keys(obj)브라우저에서 사용할 수없는 경우 메소드를 추가 합니다.

if (!Object.keys) {
 Object.keys = (function() {
 'use strict';
 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 = [], prop, i;

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

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

3

coffeescript에서는 모든 브라우저와 노드에서 다음과 같이 수행 할 수 있습니다.

k for k of obj

따라서

(1 for _ of obj).length

3

ECMAScript 5를 지원하는 브라우저를위한 재귀 솔루션 :

var getObjectKeys = function(obj) {
    var keys = Object.keys(obj);
    var length = keys.length;

    if (length !== 0) {
        for (var i = 0; i < length; i++) {
            if (typeof obj[keys[i]] === 'object') {
                keys[keys[i]] = getObjectKeys(obj[keys[i]]);
            }
        }
    }

    return keys;
};

3
var obj = {
   key1: 'value1',
   key2: 'value2',
   key3: 'value3',
   key4: 'value4'
}

console.log(Object.keys(obj));
console.log(Object.keys(obj).length)


3

Underscore.js를 사용하기로 결정한 경우 더 잘 수행하십시오.

var obj = {
    key1: 'value1',
    key2: 'value2',
    key3: 'value3',
    key4: 'value4'
}

var keys = [];
_.each( obj, function( val, key ) {
    keys.push(key);
});
console.log(keys.lenth, keys);

3

JavaScript에서 객체는 속성과 유형을 가진 독립형 엔터티입니다.

배열 형태로 Object에서 값을 가져 오는 경우 : Object .values ​​(obj) // obj는 사용한 결과 이름 -> [ "value1", "value2", "value3", "value4"]

배열 형식으로 Object에서 키를 가져 오는 경우 : Object .keys (obj) // obj는 사용한 결과 이름 -> [ "key1", "key2", "key3", "key4"]

두 함수 모두 배열을 반환하므로 length 속성을 사용하여 키 또는 값의 길이를 얻을 수 있습니다. 예를 들어 - 개체 .values (OBJ) .length 또는 개체 .keys (OBJ) .length


2

JSON 객체의 키를 나열하는 쉼표로 구분 된 문자열의 경우 다음을 시도하십시오.

function listKeys(jObj){
    var keyString = '';
    for(var k in jObj){
        keyString+=(','+k);
    }
    return keyString.slice(1);
}



/* listKeys({'a' : 'foo', 'b' : 'foo', 'c' : 'foo'}) -> 'a,b,c' */

2

ES6 forEach을 사용하면 객체의 키를 반복 할 수 있습니다 . 사용할 수있는 모든 키를 얻으려면 Object.keysObject의 모든 키를 반환합니다.

Object.keys(obj).forEach(function(keyValue, index, map) { 
  console.log(keyValue); 
});

위 스 니펫의 숏 핸드는 하나의 매개 변수 만 사용합니다.

Object.keys(obj).forEach(function(keyValue) { 
  console.log(keyValue); 
});


0

슬라이스, 적용 및 결합 방법을 사용합니다.

var print = Array.prototype.slice.apply( obj );
alert('length='+print.length+' list'+print.join());
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.