javascript number 如何遍歷包含對象的數組並訪問其屬性




node js for loop (9)

我想遍歷數組中包含的對象並更改每個對象的屬性。 如果我這樣做:

for (var j = 0; j < myArray.length; j++){

console.log(myArray[j]);

}

控制台應該調出陣列中的每個對象,對吧? 但實際上它只顯示第一個對象。 如果我在控制台之外登錄數組,那麼所有對像都會顯示出來,所以肯定會有更多內容。

無論如何,這是下一個問題。 如何使用循環訪問數組中的Object1.x?

for (var j = 0; j < myArray.length; j++){

console.log(myArray[j.x]);

}

這返回“未定義”。 再次,循環外的控制台日誌告訴我,對像都具有“x”的值。 我如何在循環中訪問這些屬性?

我被推薦到其他地方為每個屬性使用單獨的數組,但我想確保我已經用盡了這條道路。

謝謝!


for (var j = 0; j < myArray.length; j++){
  console.log(myArray[j].x);
}

在ECMAScript 2015中又名ES6,您可以使用for..of循環遍歷一組對象。

for (let item of items) {
    console.log(item); // Will display contents of the object inside the array
}

在發布此答案時,對於Internet Explorer來說,支持幾乎不存在,但通過使用像Traceur或Babel這樣的轉譯器,您可以使用這種新的Javascript功能,而無需擔心瀏覽器支持哪些內容。


自ES5 +以來,使用forEach方法非常簡單。 您可以直接更改數組中每個對象的每個屬性。

myArray.forEach(function (arrayElem){ 
  arrayElem = newPropertyValue;
});

如果你想訪問每個對象的特定屬性:

myArray.forEach(function (arrayElem){ 
      arrayElem.nameOfYourProperty = newPropertyValue;
    });

一些使用JavaScript中的函數式編程方式遍歷數組的例子:

1.循環訪問數組

const myArray = [{x:100}, {x:200}, {x:300}];

myArray.forEach((element, index, array) => {
    console.log(element.x); // 100, 200, 300
    console.log(index); // 0, 1, 2
    console.log(array); // same myArray object 3 times
});

注意:Array.prototype.forEach()嚴格來說不是一種功能性的方式,因為它作為輸入參數的函數不應該返回一個值,因此不能將其視為純函數。

2.檢查數組中的任何元素是否通過測試

const people = [
    {name: 'John', age: 23}, 
    {name: 'Andrew', age: 3}, 
    {name: 'Peter', age: 8}, 
    {name: 'Hanna', age: 14}, 
    {name: 'Adam', age: 37}];

const anyAdult = people.some(person => person.age >= 18);
console.log(anyAdult); // true

3.轉換為新陣列

const myArray = [{x:100}, {x:200}, {x:300}];

const newArray= myArray.map(element => element.x);
console.log(newArray); // [100, 200, 300]

注意:map()方法創建一個新的數組,其結果是對調用數組中的每個元素調用一個提供的函數。

4.總結一個特定的財產,併計算其平均值

const myArray = [{x:100}, {x:200}, {x:300}];

const sum = myArray.map(element => element.x).reduce((a, b) => a + b, 0);
console.log(sum); // 600 = 0 + 100 + 200 + 300

const average = sum / myArray.length;
console.log(average); // 200

5.根據原始數據創建一個新數組,但不進行修改

const myArray = [{x:100}, {x:200}, {x:300}];

const newArray= myArray.map(element => {
    return {
        ...element,
        x: element.x * 2
    };
});

console.log(myArray); // [100, 200, 300]
console.log(newArray); // [200, 400, 600]

6.計算每個類別的數量

const people = [
    {name: 'John', group: 'A'}, 
    {name: 'Andrew', group: 'C'}, 
    {name: 'Peter', group: 'A'}, 
    {name: 'James', group: 'B'}, 
    {name: 'Hanna', group: 'A'}, 
    {name: 'Adam', group: 'B'}];

const groupInfo = people.reduce((groups, person) => {
    const {A = 0, B = 0, C = 0} = groups;
    if (person.group === 'A') {
        return {...groups, A: A + 1};
    } else if (person.group === 'B') {
        return {...groups, B: B + 1};
    } else {
        return {...groups, C: C + 1};
    }
}, {});

console.log(groupInfo); // {A: 3, C: 1, B: 2}

7.根據特定標準檢索數組的子集

const myArray = [{x:100}, {x:200}, {x:300}];

const newArray = myArray.filter(element => element.x > 250);
console.log(newArray); // [{x:300}] 

注意:filter()方法創建一個新數組,其中包含所有通過由提供的函數實現的測試的元素。

8.排序數組

const people = [
  { name: "John", age: 21 },
  { name: "Peter", age: 31 },
  { name: "Andrew", age: 29 },
  { name: "Thomas", age: 25 }
];

let sortByAge = people.sort(function (p1, p2) {
  return p1.age - p2.age;
});

console.log(sortByAge);

參考


通過一組對象循環是一個非常基本的功能。 這對我來說很有用。

var person = [];
person[0] = {
    firstName : "John",
    lastName : "Doe",
    age : 60
};
var i, item;
for (i = 0; i < person.length; i++) {
    for (item in person[i]) {
        document.write(item + ": " + person[i][item] + "<br>");
    }
}

使用forEach其內置的數組函數。 Array.forEach()

yourArray.forEach(function (arrayItem) {
    var x = arrayItem.prop1 + 2;
    console.log(x);
});

下面是通過對像數組迭代的另一種方法(您需要在文檔中為這些對象包含jQuery庫)。

$.each(array, function(element) {
  // do some operations with each element... 
});

這裡有一個關於如何做到這一點的例子:)

var students = [
  { 
    name : "Mike",
    track: "track-a",
    achievements: 23,
    points : 400,
  },

  { 
    name : "james",
    track: "track-a",
    achievements: 2,
    points : 21,
  },  
]

  students.forEach(myFunction);

function myFunction (item, index) {

  for( var key in item ) {
    console.log(item[key])
  }
}

這會工作。 循環徹底數組(yourArray)。 然後遍歷每個對象(eachObj)的直接屬性。

yourArray.forEach( function (eachObj){
    for (var key in eachObj) {
        if (eachObj.hasOwnProperty(key)){
           console.log(key,eachObj[key]);
        }
    }
});




iteration