Итерация по свойствам объекта - PullRequest
1795 голосов
/ 29 ноября 2011

var obj = {
    name: "Simon",
    age: "20",
    clothing: {
        style: "simple",
        hipster: false
    }
}

for(var propt in obj){
    console.log(propt + ': ' + obj[propt]);
}

Как переменная propt представляет свойства объекта?Это не встроенный метод или свойство.Почему он подходит к каждому свойству объекта?

Ответы [ 26 ]

15 голосов
/ 28 июня 2018

Чтобы добавить в ES2015 использование Reflect.ownKeys(obj), а также итерацию по свойствам через итератор.

Например:

let obj = { a: 'Carrot', b: 'Potato', Car: { doors: 4 } };

можно повторить с помощью

// logs each key
Reflect.ownKeys(obj).forEach(key => console.log(key));

Если вы хотите выполнить итерацию непосредственно по значениям ключей объекта, вы можете определить iterator, так же как итераторы JavaScipts по умолчанию для строк, массивов, типизированных массивов, Map и Set.

JS попытается выполнить итерацию через свойство итератора по умолчанию, которое должно быть определено как Symbol.iterator.

Если вы хотите иметь возможность выполнять итерацию по всем объектам, вы можете добавить его в качестве прототипа Object:

Object.prototype[Symbol.iterator] = function*() { 
    for(p of Reflect.ownKeys(this)){ yield this[p]; }
}

Это позволит вам перебирать значения объекта с циклом for ..., например:

for(val of obj) { console.log('Value is:' + val ) }

Внимание : снаписание этого ответа (июнь 2018 г.) для всех других браузеров, кроме IE, с поддержкой генераторов и for...of итераций через Symbol.iterator

11 голосов
/ 05 мая 2017
let obj = {"a": 3, "b": 2, "6": "a"}

Object.keys(obj).map((item) => {console.log("item", obj[item])})

// a
// 3
// 2
11 голосов
/ 24 января 2016

Цикл for ... in представляет каждое свойство объекта, поскольку оно похоже на цикл for.Вы определили propt в цикле for ... in, выполнив:

    for(var propt in obj){
alert(propt + ': ' + obj[propt]);
}

A for ... in цикл перебирает перечисляемые свойства объекта.Независимо от того, какую переменную вы определяете или помещаете в цикл for ... in, она изменяется каждый раз, когда переходит к следующему свойству, которое она выполняет.Переменная в цикле for ... in перебирает ключи, но ее значение является значением ключа.Например:

    for(var propt in obj) {
      console.log(propt);//logs name
      console.log(obj[propt]);//logs "Simon"
    }

Вы можете увидеть, как переменная отличается от значения переменной.Напротив, цикл for ... делает противоположное.

Надеюсь, это поможет.

10 голосов
/ 25 апреля 2018
Object.keys(obj).forEach(key =>
  console.log(`key=${key} value=${obj[key]}`)
);
10 голосов
/ 04 ноября 2016

Вы можете использовать Lodash. Документация

var obj = {a: 1, b: 2, c: 3};
_.keys(obj).forEach(function (key) {
    ...
});
9 голосов
/ 29 ноября 2011

Ваш цикл for выполняет итерации по всем свойствам объекта obj.propt определяется в первой строке вашего цикла for.Это строка, которая является именем свойства объекта obj.На первой итерации цикла propt будет «имя».

9 голосов
/ 29 ноября 2011

Объекты в JavaScript являются коллекциями свойств и поэтому могут быть зациклены для каждого оператора.

Вы должны думать о obj как о коллекции значений ключей.

8 голосов
/ 09 августа 2016

В настоящее время вы можете преобразовать стандартный объект JS в итеративный объект, просто добавив метод Symbol.iterator. Затем вы можете использовать цикл for of и получать его значения напрямую или даже использовать оператор распространения для объекта. Здорово. Давайте посмотрим, как мы можем это сделать:

var o = {a:1,b:2,c:3},
    a = [];
o[Symbol.iterator] = function*(){
                       var ok = Object.keys(this);
                            i = 0;
                       while (i < ok.length) yield this[ok[i++]];
                     };
for (var value of o) console.log(value);
// or you can even do like
a = [...o];
console.log(a);
5 голосов
/ 11 августа 2017

Если работает Узел Я бы порекомендовал:

Object.keys(obj).forEach((key, index) => {
    console.log(key);
});
4 голосов
/ 11 февраля 2016

Также добавляем рекурсивный способ:

function iterate(obj) {
    // watch for objects we've already iterated so we won't end in endless cycle
    // for cases like var foo = {}; foo.bar = foo; iterate(foo);
    var walked = [];
    var stack = [{obj: obj, stack: ''}];
    while(stack.length > 0)
    {
        var item = stack.pop();
        var obj = item.obj;
        for (var property in obj) {
            if (obj.hasOwnProperty(property)) {
                if (typeof obj[property] == "object") {
                  // check if we haven't iterated through the reference yet
                  var alreadyFound = false;
                  for(var i = 0; i < walked.length; i++)
                  {
                    if (walked[i] === obj[property])
                    {
                      alreadyFound = true;
                      break;
                    }
                  }
                  // new object reference
                  if (!alreadyFound)
                  {
                    walked.push(obj[property]);
                    stack.push({obj: obj[property], stack: item.stack + '.' + property});
                  }
                }
                else
                {
                    console.log(item.stack + '.' + property + "=" + obj[property]);
                }
            }
        }
    }
}

Использование:

iterate({ foo: "foo", bar: { foo: "foo"} }); 
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...