Development Tip

자바 스크립트 개체 키 이름 가져 오기

yourdevel 2020. 12. 3. 20:42
반응형

자바 스크립트 개체 키 이름 가져 오기


팔로우에 대한 키 이름은 어떻게 얻습니까? 예를 들어 "button1"과 "button2"를 원합니까?

var buttons = {
    button1: {
        text: 'Close',
        onclick: function(){

        }
    },
    button2: {
        text: 'Close2',
        onclick: function(){

        }
    }
}

var i;
for(i in buttons){
    if(buttons.hasOwnProperty(i)){
        alert(buttons[i].text);
    }
} 

.push()작동하지 않았지만 사용해 보았습니다 .


문구를 약간 수정하면 더 잘 이해할 수 있습니다.

var buttons = {
  foo: 'bar',
  fiz: 'buz'
};

for ( var property in buttons ) {
  console.log( property ); // Outputs: foo, fiz or fiz, foo
}

여기서는 property각 후속주기 동안 각각에 대한 참조로 사용하여 개체의 속성을 반복하고 있음을 유의하십시오 .

MSDNfor ( variable in [object | array ] )다음과 같이 말합니다 .

루프가 반복 될 때마다 변수에는 객체의 다음 속성 이름 또는 배열의 다음 요소 인덱스가 할당됩니다. 그런 다음 루프 내부의 모든 문에서이를 사용하여 객체의 속성 또는 배열 요소를 참조 할 수 있습니다.

또한 객체의 속성 순서는 일정하지 않으며 배열의 인덱스 순서와 달리 변경 될 수 있습니다. 유용 할 수 있습니다.


ECMAscript 에디션 5는 깔끔한 방법 Object.keys()Object.getOwnPropertyNames().

그래서

Object.keys( buttons );  // ['button1', 'button2'];

변경 alert(buttons[i].text);alert(i);


변수 i는 보이는 키 이름입니다.


Prototype에 대한 액세스 권한이 있다고 가정하면 작동 할 수 있습니다. 이 코드는 몇 분 전에 직접 작성했습니다. 한 번에 하나의 키만 필요했기 때문에 키 : 값 쌍의 큰 목록이나 여러 키 이름을 뱉어내는 경우에는 시간 효율적이지 않습니다.

function key(int) {
    var j = -1;
    for(var i in this) {
        j++;
        if(j==int) {
            return i;
        } else {
            continue;
        }
    }
}
Object.prototype.key = key;

두통을 줄이기 위해 배열과 동일한 방식으로 작동하도록 번호가 지정됩니다. 코드의 경우 :

buttons.key(0) // Should result in "button1"

다음은 객체 키 이름을 얻는 데 도움이되는 간단한 예입니다.

var obj ={parts:{costPart:1000, salesPart: 2000}}; console.log(Object.keys(obj));

출력은 'parts'입니다.


ES6 업데이트 ...하지만 필터와 맵 모두 사용자 지정이 필요할 수 있습니다.

Object.entries(theObj) returns a [[key, value],] array representation of an object that can be worked on using Javascript's array methods, .each(), .any(), .forEach(), .filter(), .map(), .reduce(), etc.

Saves a ton of work on iterating over parts of an object Object.keys(theObj), or Object.values() separately.

const buttons = {
    button1: {
        text: 'Close',
        onclick: function(){

        }
    },
    button2: {
        text: 'OK',
        onclick: function(){

        }
    },
    button3: {
        text: 'Cancel',
        onclick: function(){

        }
    }
}

list = Object.entries(buttons)
    .filter(([key, value]) => `${key}`[value] !== 'undefined' ) //has options
    .map(([key, value], idx) => `{${idx} {${key}: ${value}}}`)
    
console.log(list)

참고URL : https://stackoverflow.com/questions/10334267/javascript-get-object-key-name

반응형