programing

JavaScript 개체의 속성 값을 배열로 추출하려면 어떻게 해야 합니까?

closeapi 2023. 4. 1. 09:19
반응형

JavaScript 개체의 속성 값을 배열로 추출하려면 어떻게 해야 합니까?

JavaScript 개체 지정:

var dataObject = {
   object1: {id: 1, name: "Fred"}, 
   object2: {id: 2, name: "Wilma"}, 
   object3: {id: 3, name: "Pebbles"}
};

내부 객체를 어레이로 효율적으로 추출하려면 어떻게 해야 합니까?오브젝트[n] ID에 대한 핸들을 유지할 필요가 없습니다.

var dataArray = [
    {id: 1, name: "Fred"}, 
    {id: 2, name: "Wilma"}, 
    {id: 3, name: "Pebbles"}]
var dataArray = Object.keys(dataObject).map(function(k){return dataObject[k]});
var dataArray = [];
for(var o in dataObject) {
    dataArray.push(dataObject[o]);
}

ES6 버전:

var dataArray = Object.keys(dataObject).map(val => dataObject[val]);

밑줄 사용:

var dataArray = _.values(dataObject);

jQuery를 사용하면 다음과 같이 할 수 있습니다.

var dataArray = $.map(dataObject,function(v){
     return v;
});

데모

ES2017 사용:

const dataObject = {
    object1: {
        id: 1,
        name: "Fred"
    },
    object2: {
        id: 2,
        name: "Wilma"
    },
    object3: {
        id: 3,
        name: "Pebbles"
    }
};

const valuesOnly = Object.values(dataObject);

console.log(valuesOnly)

dataObject가 지정된 방식으로 정의되어 있다고 가정하면 다음과 같이 수행합니다.

var dataArray = [];
for (var key in dataObject)
    dataArray.push(dataObject[key]);

결과적으로 dataArray에 내부 객체가 채워지게 됩니다.

승인된 답변을 사용하여 Object.values()ECMAScript 2017 Draft에 제안되어 있음을 알면 다음 방법으로 개체를 확장할 수 있습니다.

if(Object.values == null) {
    Object.values = function(obj) {
        var arr, o;
        arr = new Array();
        for(o in obj) { arr.push(obj[o]); }
        return arr;
    }
}

[답변 편집 및 업데이트 중]다른 답변은 제 답변과 거의 겹치는 것 같습니다만, 저는 다른 답변이 있다고 생각하고 대안을 제시했습니다.

이 문제에 대한 3가지 해결책을 제시하겠습니다.

  • 오브젝트.키
  • Object.values
  • 오브젝트.엔트리

Objects.keys() 솔루션:

let keys = Object.keys(dataObject); // ["object1", "object2", "object3" ];
let keysToResult = keys.map( e => dataObject[e] ); // [{"id":1,"name":"Fred"},{"id":2,"name":"Wilma"},{"id":3,"name":"Pebbles"}]

Object.values 솔루션:

let values = Object.values(dataObject); // [{"id":1,"name":"Fred"},{"id":2,"name":"Wilma"},{"id":3,"name":"Pebbles"}]

Object.entries 솔루션:

let entries = Object.entries(dataObject); // [["object1",{"id":1,"name":"Fred"}],["object2",{"id":2,"name":Wilma"}],["object3",{"id":3,"name":"Pebbles"}]]
let entriesToResult = entries.map( ([k,v]) => v ); [{"id":1,"name":"Fred"},{"id":2,"name":"Wilma"},{"id":3,"name":"Pebbles"}]

세 가지 솔루션 모두 고유한 기능이 있습니다.

Object.keys()는 결과가 불충분한 배열을 반환합니다.따라서 Array.protype.map을 사용하여 어레이 내의 각 값을 보충하고 원하는 값에 접근합니다.일반적으로 Object.keys()와 맵을 조합하여 결과 목록을 원하는 대로 맞춤화하는 메커니즘으로 생각할 수 있습니다.

Object.values()는 키를 폐기하고 결과만 반환하므로 흥미롭다.사실 이 문제에 대해서는 답변을 더 이상 처리할 필요가 없기 때문에 이 문제는 완벽합니다.

Object.entries()는 키와 값을 모두 반환하므로 필요한 값보다 많은 값을 반환합니다.결과를 맞춤화하기 위해 지도를 사용해야 합니다.사실, 우리는 여분의 정보를 잘라낼 필요가 있다.

Object.keys(), Object.values() 및 Object.entries()는 모두 매우 유용한 함수이기 때문에 이 문제에 대한 해결책으로 3가지 모두를 표시하려고 합니다.특정 사용 사례에 따라 문제 해결에 더 적합한 사용 사례를 찾을 수 있습니다.

다소 장황하지만 견고하고 빠른

var result = [];
var keys = Object.keys(myObject);
for (var i = 0, len = keys.length; i < len; i++) {
    result.push(myObject[keys[i]]);
}

Object.values() 메서드가 지원되게 되었습니다.그러면 개체의 값 배열이 제공됩니다.

Object.values(dataObject)

참조: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Object/values

에는 d3를 사용하면 .d3.values(dataObject) 렇렇 which which which which가 된다.

여기에 이미지 설명 입력

객체 값을 배열로 삭제하는 것을 선호합니다.

[...Object.values(dataObject)]

var dataObject = {
   object1: {id: 1, name: "Fred"}, 
   object2: {id: 2, name: "Wilma"}, 
   object3: {id: 3, name: "Pebbles"}
};

var dataArray = [...Object.values(dataObject)];

이건 나한테 효과가 있었어

var dataArray = Object.keys(dataObject).map(function(k){return dataObject[k]});

언급URL : https://stackoverflow.com/questions/1718777/how-might-i-extract-the-property-values-of-a-javascript-object-into-an-array

반응형