Как получить все значения свойств объекта Javascript (не зная ключей)?


Если есть объект Javascript:

var objects={...};

предположим, он имеет более 50 свойств, не зная имен свойств (то есть не зная "ключей") как получить каждое значение свойства в цикле?

20 406

20 ответов:

С помощью простой for..in петли:

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

в зависимости от того, какие браузеры нужно поддерживать, это может быть сделано в ряде направлений. Подавляющее большинство браузеров в wild поддерживают ECMAScript 5( ES5), но имейте в виду, что многие из приведенных ниже примеров используют Object.keys, который не доступен в IE таблица совместимости.

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

потому что 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.keys безопасная в отношении null (как for-in есть), то вы можете сделать Object.keys(obj || {})....

Object.keys возвращает перечисли свойства. Для перебора простых объектов, этого обычно достаточно. Если у вас есть что-то с не перечисляемыми свойствами, с которыми вам нужно работать, вы можете использовать Object.getOwnPropertyNames на месте Object.keys.

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

массивы легче для итерации с ECMAScript 2015. Вы можете использовать это в своих интересах при работе со значениями один за другим в цикле:

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

ECMAScript 2015 вводит Symbol, экземпляры которых могут использоваться в качестве имен свойств. Чтобы получить символы объекта для перечисления, используйте Object.getOwnPropertySymbols (эта функция почему Symbolне могу используется для частные свойства). Новый Reflect API от ECMAScript 2015 предоставляет 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) в a for-of петли:

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

Object.values сим

наконец, как отмечено в комментариях и teh_senaus в другом ответе, возможно, стоит использовать один из них в качестве прокладки. Не волнуйтесь, следующее не изменяет прототип, он просто добавляет метод в Object (что гораздо менее опасно). Используя функции fat-arrow, это можно сделать и в одной строке:

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 была отключена по умолчанию в V8 до недавнего времени, который питал браузеры, такие как Chrome. Функции из ECMAScript 2015 следует избегать до тех пор, пока браузеры, которые вы собираетесь поддерживать, не реализуют эти функции это тебе нужно. Если вы используете Бабель для компиляции кода в ECMAScript 5, то у вас есть доступ ко всем функциям в этом ответе.

вот многоразовая функция для получения значений в массив. Он также учитывает прототипы.

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

Если у вас есть доступ к подчеркивания.JS, вы можете использовать _.values

Если вы действительно хотите массив значений, я нахожу это чище, чем создание массива с помощью for ... в циклах.

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.

ES5 Object.keys

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

вы можете перебирать клавиши:

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

для тех ранних адаптационных людей в эпоху CofeeScript, вот еще один эквивалент для него.

val for key,val of objects

что может быть лучше, чем это, потому что objects может быть уменьшена для повторного ввода и уменьшена читаемость.

objects[key] for key of objects

используйте полифилл, например:

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

затем использовать

Object.values(my_object)

3) профит!

видимо - как я недавно узнал - это самый быстрый способ сделать это:

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]];
}

вот функция, похожая на 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, вам не придется ничего менять в своем коде.

Я понимаю, что немного опоздал, но вот сим для нового firefox 47 Object.values метод

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

ECMA2017 вперед:

Object.values(obj) принесет вам все значения свойств в виде массива.

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

использование: 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
var objects={...}; this.getAllvalues = function () {
        var vls = [];
        for (var key in objects) {
            vls.push(objects[key]);
        }
        return vls;
    }

на ECMAScript5 использовать

 keys = Object.keys(object);

В противном случае, если Ваш браузер не поддерживает его, используйте известный for..in loop

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

Теперь я использую 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)

и если вы используете google chrome откройте консоль с помощью Ctrl + Shift+j

Goto > > Консоль