объекты - перебор объекта javascript




Как пропустить простой объект JavaScript с объектами в качестве членов? (13)

Этот ответ представляет собой совокупность решений, которые были предоставлены в этом сообщении, с некоторыми отзывами о производительности . Я думаю, что есть 2 варианта использования, и OP не упоминал, нужно ли ему обращаться к клавишам, чтобы использовать их во время цикла.

I. Ключи должны быть доступны,

✔ подход Object.keys и Object.keys

let k;
for (k of Object.keys(obj)) {

    /*        k : key
     *   obj[k] : value
     */
}

✔ подход

let k;
for (k in obj) {

    /*        k : key
     *   obj[k] : value
     */
}

Используйте это с осторожностью, так как он может печатать прототипы свойств obj

✔ подход ES7

for (const [key, value] of Object.entries(obj)) {

}

Однако во время редактирования я бы не рекомендовал метод ES7, потому что JavaScript инициализирует много переменных внутри, чтобы построить эту процедуру (см. Обратную связь для доказательства). Если вы не разрабатываете огромное приложение, которое заслуживает оптимизации, тогда это нормально, но если оптимизация - ваш приоритет, вы должны подумать об этом.

II. нам просто нужно получить доступ к каждому значению,

✔ подход и Object.values

let v;
for (v of Object.values(obj)) {

}

Больше отзывов о тестах:

  • Кэширование Object.keys или Object.values незначительно

Например,

const keys = Object.keys(obj);
let i;
for (i of keys) {
  //
}
// same as
for (i of Object.keys(obj)) {
  //
}
  • Для случая Object.values использование native-цикла с кэшированными переменными в Firefox кажется немного быстрее, чем использование цикла for...of Однако разница не так важна, и Chrome работает for...of быстрее, чем native for цикла, поэтому я бы рекомендовал использовать for...of при работе с Object.values в любом случае (4-й и 6-й тесты).

  • В Firefox цикл for...in очень медленный, поэтому, когда мы хотим кэшировать ключ во время итерации, лучше использовать Object.keys . Кроме того, Chrome работает с одинаковой скоростью (1-й и последний тесты).

Вы можете проверить тесты здесь: https://jsperf.com/es7-and-misc-loops

Как я могу перебирать все элементы в объекте JavaScript, включая значения, являющиеся объектами.

Например, как я мог бы пройти через это (доступ к «your_name» и «your_message» для каждого)?

var validation_messages = {
    "key_1": {
        "your_name": "jimmy",
        "your_msg": "hello world"
    },
    "key_2": {
        "your_name": "billy",
        "your_msg": "foo equals bar"
    }
}

ECMAScript-2017, только что завершившийся месяц назад, представляет Object.values ​​(). Итак, теперь вы можете сделать это:

let v;
for (v of Object.values(validation_messages))
   console.log(v.your_name);   // jimmy billy

В ES6 вы можете пропустить такой объект: (используя функцию стрелки )

Object.keys(myObj).forEach(key => {
    console.log(key);          // the name of the current key.
    console.log(myObj[key]);   // the value of the current key.
});

jsbin

В ES7 вы можете использовать Object.entries вместо Object.keys и Object.keys объект следующим образом:

Object.entries(myObj).forEach(([key, val]) => {
    console.log(key);          // the name of the current key.
    console.log(val);          // the value of the current key.
});

Вышеупомянутое также будет работать как однострочный :

Object.keys(myObj).forEach(key => console.log(key, myObj[key]));

jsbin

Если вы хотите также прокручивать вложенные объекты, вы можете использовать рекурсивную функцию (ES6):

const loopNestedObj = (obj) => {
  Object.keys(obj).forEach(key => {
    if (obj[key] && typeof obj[key] === 'object') loopNestedObj(obj[key]);  // recurse.
    else console.log(key, obj[key]);  // or do something with key and val.
  });
};

jsbin

То же, что и функция выше, но с ES7 Object.entries вместо Object.keys :

const loopNestedObj = (obj) => {
  Object.entries(obj).forEach(([key, val]) => {
    if (val && typeof val === 'object') loopNestedObj(val);  // recurse.
    else console.log(key, val);  // or do something with key and val.
  });
};

Если вы используете функциональное программирование, вы можете использовать Object.keys / Object.entries для перечисления объекта, затем обработать значения, а затем использовать функцию reduce() для преобразования обратно в новый объект.

const loopNestedObj = (obj) => 
  Object.keys(obj)
    // Use .filter(), .map(), etc. if you need.
    .reduce((newObj, key) => 
      (obj[key] && typeof obj[key] === 'object') ?
        {...newObj, [key]: loopNestedObj(obj[key])} :  // recurse.
        {...newObj, [key]: obj[key]},                  // Define value.
      {});

В ES7 вы можете:

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

В соответствии с ECMAScript 5 вы можете комбинировать Object.keys() и Array.prototype.forEach() :

var obj = {
  first: "John",
  last: "Doe"
};

//
//	Visit non-inherited enumerable keys
//
Object.keys(obj).forEach(function(key) {

  console.log(key, obj[key]);

});


Другой вариант:

var testObj = {test: true, test1: false};
for(let x of Object.keys(testObj)){
    console.log(x);
}

Здесь идет усовершенствованная и рекурсивная версия решения AgileJon ( demo ):

function loopThrough(obj){
  for(var key in obj){
    // skip loop if the property is from prototype
    if(!obj.hasOwnProperty(key)) continue;

    if(typeof obj[key] !== 'object'){
      //your code
      console.log(key+" = "+obj[key]);
    } else {
      loopThrough(obj[key]);
    }
  }
}
loopThrough(validation_messages);

Это решение работает для всех видов разной глубины.


Использование Underscore.js _.each :

_.each(validation_messages, function(value, key){
    _.each(value, function(value, key){
        console.log(value);
    });
});

Решение, которое работает для меня, следующее

_private.convertParams=function(params){
    var params= [];
    Object.keys(values).forEach(function(key) {
        params.push({"id":key,"option":"Igual","value":params[key].id})
    });
    return params;
}

Я думаю, стоит отметить, что jQuery отлично сортирует это с помощью $.each() .

См. https://api.jquery.com/each/

Например:

$('.foo').each(function() {
    console.log($(this));
});

$(this) является единственным элементом внутри объекта. Swap $('.foo') к переменной, если вы не хотите использовать механизм выбора jQuery.


Я не мог заставить вышеупомянутые записи делать то, что я сделал.

Поиграв с другими ответами, я сделал это. Это хаки, но это работает!

Для этого объекта:

var myObj = {
    pageURL    : "BLAH",
    emailBox   : {model:"emailAddress", selector:"#emailAddress"},
    passwordBox: {model:"password"    , selector:"#password"}
};

... этот код:

// Get every value in the object into a separate array item ...
function buildArray(p_MainObj, p_Name) {
    var variableList = [];
    var thisVar = "";
    var thisYes = false;
    for (var key in p_MainObj) {
       thisVar = p_Name + "." + key;
       thisYes = false;
       if (p_MainObj.hasOwnProperty(key)) {
          var obj = p_MainObj[key];
          for (var prop in obj) {
            var myregex = /^[0-9]*$/;
            if (myregex.exec(prop) != prop) {
                thisYes = true;
                variableList.push({item:thisVar + "." + prop,value:obj[prop]});
            }
          }
          if ( ! thisYes )
            variableList.push({item:thisVar,value:obj});
       }
    }
    return variableList;
}

// Get the object items into a simple array ...
var objectItems = buildArray(myObj, "myObj");

// Now use them / test them etc... as you need to!
for (var x=0; x < objectItems.length; ++x) {
    console.log(objectItems[x].item + " = " + objectItems[x].value);
}

... производит это в консоли:

myObj.pageURL = BLAH
myObj.emailBox.model = emailAddress
myObj.emailBox.selector = #emailAddress
myObj.passwordBox.model = password
myObj.passwordBox.selector = #password

for (var key in validation_messages) {
    // skip loop if the property is from prototype
    if (!validation_messages.hasOwnProperty(key)) continue;

    var obj = validation_messages[key];
    for (var prop in obj) {
        // skip loop if the property is from prototype
        if(!obj.hasOwnProperty(prop)) continue;

        // your code
        alert(prop + " = " + obj[prop]);
    }
}

for(var key in validation_messages){
    for(var subkey in validation_messages[key]){
        //code here
        //subkey being value, key being 'yourname' / 'yourmsg'
    }
}




javascript