객체의 속성 이름 얻기


179

JavaScript에서 객체를 반복하는 방법이 있는지 궁금합니다.

for(var i in myObject) {
    // ...
}

그러나 이와 같이 각 속성의 이름을 얻으십시오.

for(var i in myObject) {
    separateObj[myObject[i].name] = myObject[i];
}

Google에서 이와 비슷한 것을 찾을 수 없습니다. 그들은 변수의 이름을 그들과 함께 전달한다고 말하지만 이것은 내가 달성하려는 것에 대한 옵션이 아닙니다.

도움을 주셔서 감사합니다.



4
seperate해야separate
후안 멘데스에게

13
@JuanMendes 감사합니다. 와우,이 질문은 과거의 폭발입니다. 그 'l' + new Array(1000).join('o') + 'ng'이후로 길을 왔습니다.
Olical

1
확인 된 답변이 올바르지 않으면 Object.keys () 메소드를 사용하십시오.
Kevin Florida

확인 된 답변과 Object.keys ()는 다른 일을하므로 원하는 것에 따라 둘 중 하나가 옳을 수 있습니다.
Gabe Johnson

답변:


163

Object.keys ()를 사용하십시오 .

var myObject = { a: 'c', b: 'a', c: 'b' };
var keyNames = Object.keys(myObject);
console.log(keyNames); // Outputs ["a","b","c"]

Object.keys() 입력 객체에 속하는 속성 이름 배열을 제공합니다.


3
보다 구체적으로, Object.keys (obj)는 전달 된 obj에 속하는 속성 이름, 즉 키의 배열을 반환합니다.
수강생의 이름은

1
추가는 Object.keys는 () 만 해당) enumuable 특성, Object.getOwnProperties을 (를 반환하는 모든 그것의 속성을 반환합니다
bitfishxyz

191

i 이름입니다.

for(var name in obj) {
    alert(name);
    var value = obj[name];
    alert(value);
}

그래서 당신은 할 수 있습니다 :

seperateObj[i] = myObject[i];

1
대괄호 구문을 통해 객체 속성에 액세스 할 수 있습니다. obj.prop1은 obj [ 'prop1']과 동일합니다.
Josiah Ruddell

5
좋은 연습은 사용하는 것입니다 HasOwnProperty for..in을 사용하는 경우
Bakudan

5
@Bakudan은 당신이 의미하는 바를 알고 있지만 더 좋은 방법은 hasOwnProperty상속 된 속성을 원하지 않으면 사용해야한다는 것 입니다. 그렇게하면 맹목적으로 규칙을 따르지 않습니다. 경우에 따라 상속 된 속성을 실제로보고 싶을 수도 있습니다. 객체 자체 속성을 반복하는 또 다른 방법은 Object.keys를 사용하는 것 입니다. Object.keys(obj).forEach(function(prop){ alert obj[prop]})
Juan Mendes

@Juan Mendes 네, 상속받은 속성을 가진 경우를 의미했습니다. IE8은 Object.keys를 지원하지 않기 때문에 (슬프게도)이 접근법을 사용해야합니다.
Bakudan

17

면책 조항 나는 "객체가 부착 된 속성 이름을 알 수 있습니까?"라는 질문을 오해했지만 일부 사람들은 그것을 찾는 동안 여기에 올 수 있기 때문에 답을 남기기로 결정했습니다.


아니요, 객체를 여러 속성에 연결할 수 있으므로 이름을 알 수 없습니다.

var obj = {a:1};
var a = {x: obj, y: obj}

obj의 이름은 무엇입니까?

for 루프에서 속성 이름을 원하지 않습니까?

for (var propName in obj) {
  console.log("Iterating through prop with name", propName, " its value is ", obj[propName])
}

@ChadSchouggins 당신이 말한 것은 사실이지만, 내가 대답하고있는 질문은 아닙니다. 그렇습니다. 각 속성 이름을 얻는 객체를 반복 할 수 있기 때문입니다. OP가 의도 한 것이 아닐 수도있는 질문에 대답하고 있습니다. 여러 속성이 동일한 객체를 가리킬 수 있음을 분명히하고 싶었습니다.
Juan Mendes

7

객체를 쉽게 반복 할 수 있습니다

예 : 객체가 var a = {a : 'apple', b : 'ball', c : 'cat', d : 'doll', e : 'elephant'} 인 경우;

Object.keys(a).forEach(key => {
   console.log(key) // returns the keys in an object
   console.log(a[key])  // returns the appropriate value 
})

6

위치별로 객체 속성에 직접 액세스하려면 ... 일반적으로 속성 [0]에 유용합니다 ... 그래서 추가 정보에 대한 정보를 보유하거나 첫 번째로드 된 외부 모듈의 node.js 'require.cache [0]'에 등

Object.keys( myObject )[ 0 ]
Object.keys( myObject )[ 1 ]
...
Object.keys( myObject )[ n ]

4

"Object.keys (obj)"외에, 우리는 매우 간단한 "for ... in"루프를 가지고 있는데, 이것은 객체의 열거 가능한 속성 이름을 반복합니다.

const obj = {"fName":"John","lName":"Doe"};

for (const key in obj) {
    //This will give key
      console.log(key);
    //This will give value
    console.log(obj[key]);
    
}


3

모국어가 무엇인지에 따라 객체의 속성 또는 "배열 키"또는 "배열 인덱스"를 가져 오려면 ..... Object.keys () 메서드를 사용하십시오.

중요 : 이것은 "현대 브라우저"와만 호환됩니다 :

따라서 객체가 호출되면 myObject ...

var c = 0;
for(c in myObject) {
    console.log(Object.keys(myObject[c]));
}

사람! 이것은 최신 파이어 폭스와 ie11 및 크롬에서 확실히 작동합니다 ...

다음은 MDN https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys의 설명서입니다.


2

ES5에서

EG 이런 종류의 물건이 있습니다 :

var ELEMENTS = {
    STEP_ELEMENT: { ID: "0", imageName: "el_0.png" },
    GREEN_ELEMENT: { ID: "1", imageName: "el_1.png" },
    BLUE_ELEMENT: { ID: "2", imageName: "el_2.png" },
    ORANGE_ELEMENT: { ID: "3", imageName: "el_3.png" },
    PURPLE_ELEMENT: { ID: "4", imageName: "el_4.png" },
    YELLOW_ELEMENT: { ID: "5", imageName: "el_5.png" }
};

그리고 이제 '0'을 매개 변수로 전달하면 'STEP_ELEMENT'를 얻고 '2'이면 'BLUE_ELEMENT'를 얻는 함수를 원합니다.

function(elementId) {
    var element = null;

    Object.keys(ELEMENTS).forEach(function(key) {
        if(ELEMENTS[key].ID === elementId.toString()){
            element = key;
            return;
        }    
    });

    return element;
}

이것은 아마도 문제에 대한 최상의 해결책은 아니지만 그것을 수행하는 방법을 알려주는 것이 좋습니다.

건배.


1

2018 년 현재 개발자 Mozilla 설명서에Object.getOwnPropertyNames() 설명 된대로 사용할 수 있습니다.

const object1 = {
  a: 1,
  b: 2,
  c: 3
};

console.log(Object.getOwnPropertyNames(object1));
// expected output: Array ["a", "b", "c"]

0

for / in 루프를 수행 할 때 먼저 배치하면 i가 특성 이름입니다. 따라서 속성 이름 i가 있으며 myObject [i]를 수행하여 값에 액세스하십시오.


0

이 솔루션들도 효과가 있습니다.

// Solution One
function removeProperty(obj, prop) {
  var bool;
  var keys = Object.keys(obj);
  for (var i = 0; i < keys.length; i++) {
    if (keys[i] === prop) {
      delete obj[prop];
      bool = true;
    } 
  }
  return Boolean(bool);
}


//Solution two
function removeProperty(obj, prop) {
  var bool;
  if (obj.hasOwnProperty(prop)) {
      bool = true;
      delete obj[prop];
  }
  return Boolean(bool);
}

0

Object.keys()에서 속성을 가져 오는 함수를 사용하면 Object이름으로 속성을 검색 할 수 있습니다. 예를 들면 다음과 같습니다.

const Products = function(){
    this.Product = "Product A";
    this.Price = 9.99;
    this.Quantity = 112;
};

// Simple find function case insensitive
let findPropByName = function(data, propertyName){
 let props = [];
 Object.keys(data).forEach(element => {
    return props.push(element.toLowerCase());
  });
  console.log(props);
  let i = props.indexOf(propertyName.toLowerCase());

  if(i > -1){
    return props[i];
  }
  return false;
};

// calling the function
let products = new Products();
console.log(findPropByName(products, 'quantity'));

-1

빠르고 더러운 :

function getObjName(obj) {
  return (wrap={obj}) && eval('for(p in obj){p}') && (wrap=null);
}
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.