programing

키를 모르는 상태에서 JavaScript 객체의 모든 속성 값을 가져오려면 어떻게 해야 합니까?

firstcheck 2022. 11. 7. 22:01
반응형

키를 모르는 상태에서 JavaScript 객체의 모든 속성 값을 가져오려면 어떻게 해야 합니까?

JavaScript 개체가 있는 경우:

var objects={...};

50개가 넘는 속성을 가지고 있으며 속성 이름을 모르는 경우('키'를 모르는 경우) 루프에서 각 속성 값을 가져오는 방법은 무엇입니까?

지원해야 하는 브라우저에 따라 다양한 방법으로 수행할 수 있습니다. 5를 에서는 ECMAScript 5(ES5)를 사용하는 .Object.keys(IE < 9에서는 사용할 수 없습니다).호환성 표를 참조하십시오.

ECMAScript 3+

구버전의 IE를 서포트할 필요가 있는 경우는, 다음의 옵션을 참조해 주세요.

for (var key in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
        var val = obj[key];
        // use val
    }
}

" " "if에서는 오브젝트의 프로토타입 체인(거의 확실하게 원하는 동작)에서 속성을 열거하지 않도록 합니다.하셔야 합니다.

Object.prototype.hasOwnProperty.call(obj, key) // ok

보다는

obj.hasOwnProperty(key) // bad

5하면 ECMAScript 5+를 사용하여 개체를 수 .Object.create(null)에는 「」는 hasOwnProperty방법.또한 악성코드는 이 코드보다 우선하는 개체를 생성할 수 있습니다.hasOwnProperty★★★★★★ 。

ECMAScript 5 이상

ECMAScript 5 이후를 지원하는 모든 브라우저에서 이러한 방법을 사용할 수 있습니다.이러한 값은 개체에서 가져오므로 프로토타입 체인에 열거되지 않습니다.서 ★★★★★obj이 목적입니다.

var keys = Object.keys(obj);

for (var i = 0; i < keys.length; i++) {
    var val = obj[keys[i]];
    // use val
}

더루프에 경우는, 다음의 에 따라 주세요.Array.prototype.forEach다음 중 하나:

Object.keys(obj).forEach(function (key) {
    var val = obj[key];
    // use val
});

다음 방법에서는 객체의 값을 포함하는 배열을 구축합니다.이것은 루프 오버에 편리합니다.

var vals = Object.keys(obj).map(function (key) {
    return obj[key];
});

// use vals array

만약 당신이 그것들을 사용하길 원한다면Object.keysnull: (예:)for-in를 사용하여 ( )을(를)」를 실행할 수 .Object.keys(obj || {})....

Object.keys열거 가능한 속성을 반환합니다.단순한 오브젝트를 반복하는 경우 보통 이 정도면 충분합니다.사용할 수 없는 속성을 가진 것이 있으면 다음을 사용할 수 있습니다.Object.getOwnPropertyNamesObject.keys.

ECMAScript 2015+(A.K.A. ES6)

ECMAScript 2015를 사용하면 어레이 반복이 쉬워집니다.루프내의 값을 1개씩 조작하는 경우는, 이것을 유효하게 사용할 수 있습니다.

for (const key of Object.keys(obj)) {
    const val = obj[key];
    // use val
}

ECMAScript 2015 fat-arrow 함수를 사용하면 객체를 값 배열에 매핑할 수 있습니다.

const vals = Object.keys(obj).map(key => obj[key]);

// use vals array

2015 ECMAScript 2015 »Symbol할 수 의 기호를 을 Object.getOwnPropertySymbols(이 함수는Symbol 개인 자산을 만드는 데 사용할 수 없습니다.)새로운ReflectECMAScript 2015의 API는 다음을 제공합니다.Reflect.ownKeys속성 이름(숫자가 없는 속성 포함) 및 기호 목록을 반환합니다.

어레이 통합(사용 시도 안 함)

어레이의 압축은 공개 전에 ECMAScript 6에서 삭제되었습니다.삭제하기 전의 솔루션은 다음과 같습니다.

const vals = [for (key of Object.keys(obj)) obj[key]];

// use vals array

ECMAScript 2017+

ECMAScript 2016은 이 주제에 영향을 미치지 않는 기능을 추가합니다.ECMAScript 2017 사양은 다음과 같습니다.Object.values그리고.Object.entries양쪽 어레이가 모두 반환됩니다(이러한 어레이는 일부에서는, 사용자, 사용자, 사용자, 사용자, 사용자, 사용자, 사용자, 사용자, 사용자 모두Array.entries).Object.values그대로 또는 와 함께 사용할 수 있다for-of고리.

const values = Object.values(obj);

// use values array or:

for (const val of Object.values(obj)) {
    // use val
}

키와 값을 모두 사용하는 경우Object.entries널 위한 거야다음과 같은 배열을 생성합니다.[key, value]이것은 그대로 사용할 수 있습니다.또는 (ECMAScript 2015 destructing assignment도 참조)를 사용하여for-of루프:

for (const [key, val] of Object.entries(obj)) {
    // use key and val
}

Object.values

마지막으로, 코멘트나 다른 답변의 te_senaus에 기재된 바와 같이, 이들 중 하나를 심으로 사용할 가치가 있을 수 있습니다.걱정하지 마세요. 다음 사항은 프로토타입을 변경하는 것이 아닙니다.그냥 방법을 추가할 뿐입니다.Object(그것이 훨씬 덜 위험합니다.)팻 화살표 기능을 사용하면 다음 한 줄에서도 이 작업을 수행할 수 있습니다.

Object.values = obj => Object.keys(obj).map(key => obj[key]);

이 기능을 사용하여

// ['one', 'two', 'three']
var values = Object.values({ a: 'one', b: 'two', c: 'three' });

원어민일 때 흔들리는 것을 피하고 싶다면Object.values다음 작업을 수행할 수 있습니다.

Object.values = Object.values || (obj => Object.keys(obj).map(key => obj[key]));

드디어...

지원해야 하는 브라우저/버전에 유의하십시오.위의 내용은 메서드 또는 언어 기능이 구현되어 있는 부분에 해당됩니다.예를 들어, 최근까지 ECMAScript 2015에 대한 지원은 Chrome과 같은 브라우저를 탑재한 V8에서는 기본적으로 꺼져 있었습니다.ECMAScript 2015 의 기능은, 서포트하는 브라우저가 필요한 기능을 실장할 때까지 사용하지 말아 주세요.babel을 사용하여 코드를 ECMAScript 5로 컴파일하면 이 답변의 모든 기능에 액세스할 수 있습니다.

심플하게for..in루프:

for(var key in objects) {
    var value = objects[key];
}

다음은 값을 배열로 가져오기 위한 재사용 가능한 기능입니다.시제품도 고려합니다.

Object.values = function (obj) {
    var vals = [];
    for( var key in obj ) {
        if ( obj.hasOwnProperty(key) ) {
            vals.push(obj[key]);
        }
    }
    return vals;
}

Underscore.js에 액세스할 수 있는 경우 다음과 같은 함수를 사용할 수 있습니다.

_.values({one : 1, two : 2, three : 3}); // return [1, 2, 3]

ES5 Object.keys

var a = { a: 1, b: 2, c: 3 };
Object.keys(a).map(function(key){ return a[key] });
// result: [1,2,3]

값 배열이 필요한 경우 를 사용하여 어레이를 구축하는 것보다 더 깔끔합니다.루프를 이루다

ECMA 5.1+

function values(o) { return Object.keys(o).map(function(k){return o[k]}) }

대부분의 경우 값 배열이 실제로 필요하지 않으므로 이를 수행하는 것이 더 빠릅니다.

for(var k in o) something(o[k]);

이것은 오브젝트 o의 키에 걸쳐 반복됩니다.각 반복에서 k는 o의 키로 설정됩니다.

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

모든 값 가져오기:

  • 최단 경로:

    • const myValues = Object.values(myObj)
  • const myValues = Object.keys(myObj).map(key => myObj[key])

키를 루프할 수 있습니다.

foo = {one:1, two:2, three:3};
for (key in foo){
    console.log("foo["+ key +"]="+ foo[key]);
}

출력:

foo[one]=1
foo[two]=2
foo[three]=3

ECMA2017 이후:

Object.values(obj)는 모든 속성 값을 배열로 가져옵니다.

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

이 질문에서는 상속된 속성과 열거할 수 없는 속성을 원하는지 여부를 지정하지 않습니다.

구글이 쉽게 찾을 수 없는 모든 것, 상속된 재산, 그리고 열거할 수 없는 재산들을 얻는 것에 대한 질문이 있다.

상속된 속성과 열거할 수 없는 속성을 모두 취득할 경우 이를 위한 솔루션은 다음과 같습니다.

function getAllPropertyNames(obj) {
    let result = new Set();
    while (obj) {
        Object.getOwnPropertyNames(obj).forEach(p => result.add(p));
        obj = Object.getPrototypeOf(obj);
    }
    return [...result];
}

그런 다음 반복하여 for-of-loop을 사용합니다.

function getAllPropertyNames(obj) {
  let result = new Set();
  while (obj) {
    Object.getOwnPropertyNames(obj).forEach(p => result.add(p));
    obj = Object.getPrototypeOf(obj);
  }
  return [...result];
}

let obj = {
  abc: 123,
  xyz: 1.234,
  foobar: "hello"
};

for (p of getAllPropertyNames(obj)) console.log(p);

CofeeScript 시대에 일찍 적응하는 사람들을 위해 이와 동등한 것을 하나 더 소개합니다.

val for key,val of objects

보다 더 수도 '이것보다 더 좋다'는 말은objects다시 입력할 수 있도록 줄이고 가독성을 떨어뜨릴 수 있습니다.

objects[key] for key of objects

최근에 알게 된 것처럼, 이것이 가장 빠른 방법인 것 같습니다.

var objs = {...};
var objKeys = Object.keys(obj);
for (var i = 0, objLen = objKeys.length; i < objLen; i++) {
    // do whatever in here
    var obj = objs[objKeys[i]];
}

다음과 같은 폴리필 사용:

if(!Object.values){Object.values=obj=>Object.keys(obj).map(key=>obj[key])}

그 후

Object.values(my_object)

3) 이익!

const object1 = {
  a: 'somestring',
  b: 42
};

for (let [key, value] of Object.entries(object1)) {
  console.log(`${key}: ${value}`);
}

// expected output:
// "a: somestring"
// "b: 42"
// order is not guaranteed

조금 늦은 건 알지만 여기 새로운 파이어폭스 47을 위한 이 있습니다.Object.values

Object.prototype.values = Object.prototype.values || function(obj) {
  return this.keys(obj).map(function(key){
    return obj[key];
  });
};

Object.entries는 더 나은 방법으로 작업을 수행합니다.

  var dataObject = {"a":{"title":"shop"}, "b":{"title":"home"}}
 
   Object.entries(dataObject).map(itemArray => { 
     console.log("key=", itemArray[0], "value=", itemArray[1])
  })

: ★★★★Object.values()오브젝트를 인수로 전달하고 값 배열을 반환값으로 받습니다.

지정된 개체 자체의 열거 가능한 속성 값의 배열을 반환합니다. 해서 같은 수 .for in루프하지만 프로토타입의 속성은 없습니다.를 들어보면 . '보다, 보다, 보다, 보다, 보다, 보다

function person (name) {
  this.name = name;
}

person.prototype.age = 5;

let dude = new person('dude');

for(let prop in dude) {
  console.log(dude[prop]);     // for in still shows age because this is on the prototype
}                              // we can use hasOwnProperty but this is not very elegant

// ES6 + 
console.log(Object.values(dude));
// very concise and we don't show props on prototype

다음은 PHP의 array_values()와 유사한 함수입니다.

function array_values(input) {
  var output = [], key = '';
  for ( key in input ) { output[output.length] = input[key]; }
  return output;
}

ES6 이상을 사용하는 경우 오브젝트 값을 얻는 방법은 다음과 같습니다.

Array.from(values(obj));

ES7과 호환성이 있어 일부 브라우저에서도 아직 지원하지 않음

터, 、Object.values(<object>)ES7에 내장

모든 브라우저가 지원되기를 대기할 때까지 함수 안에 랩할 수 있습니다.

Object.vals=(o)=>(Object.values)?Object.values(o):Object.keys(o).map((k)=>o[k])

그 후, 다음과 같이 합니다.

Object.vals({lastname:'T',firstname:'A'})
 // ['T','A']

브라우저가 ES7과 호환되면 코드 내의 아무것도 변경할 필요가 없습니다.

가장 쉬운 선택은 이런 것 같아요

Object.keys(data).forEach(function (key, index) {
  var value = data[key];  
  console.log(key,index, value);
});

예를 들어 실행 가능한 코드가 여기에 추가됩니다.

const user = {
    name: 'Alex',
    age: 30
};

Object.keys(user).forEach(function (key, index) {
  var value = user[key];  
  console.log(key,index, value);
});

아래의 세 가지 방법을 사용하여 데이터를 가져올 수 있습니다.

지도 기능 사용

data.map( item => { console.log(item) }

루프에 사용

for( let i = 0; i < data.length; i++){
   console.log(item);
}

in loop에 사용

for(key in data) {
    if(data.hasOwnProperty(key)) {
       const value = data[key];
       console.log(value);
    }
}
var objects={...}; this.getAllvalues = function () {
        var vls = [];
        for (var key in objects) {
            vls.push(objects[key]);
        }
        return vls;
    }

ECMAScript5 사용 시

 keys = Object.keys(object);

well-known " " " " " " " " " " " " " " " " " " " " " " " " " " " " 를 합니다.for..in loop

for (key in object) {
    // your code here
}

이전 브라우저는 Dojo Toolkit을 지원하지 않기 때문에 현재 Dojo Toolkit을 사용하고 있습니다.Object.values.

require(['dojox/lang/functional/object'], function(Object) {
    var obj = { key1: '1', key2: '2', key3: '3' };
    var values = Object.values(obj);
    console.log(values);
});

출력:

['1', '2', '3']

사용하다

console.log(variable)

구글 크롬을 사용하는 경우 Ctrl+Shift+j를 사용하여 콘솔을 엽니다.

Goto >> 콘솔

언급URL : https://stackoverflow.com/questions/7306669/how-to-get-all-properties-values-of-a-javascript-object-without-knowing-the-key

반응형