js对象数组计算总计_如何计算数组中的对象
js对象数组计算总计
Knowing how to quickly iterate through an array and count objects is deceptively simple. The length() method will tell you the total number of values in the array, but what if you only want to count those values based on certain conditions?
知道如何快速遍历数组并对对象计数很简单。 length()⽅法将告诉您数组中值的总数，但是如果您只想根据某些条件对这些值进⾏计数怎么办？
For example, imagine you have an array like this:
例如，假设您有⼀个像这样的数组：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
And you only want to count the number of objects with status set to '0'.
⽽且，您只想计算status设置为'0'的对象的数量。
Like with just about everything in programming, there are a number of ways to do this. We'll go through a few of the common methods below.
就像编程中的⼏乎所有内容⼀样，有很多⽅法可以做到这⼀点。 我们将介绍以下⼏种常见⽅法。
使⽤for循环 (Use a for loop)
Probably the easiest way would be to declare a counter variable, loop through the array, and iterate counter only if status is equal to '0':
可能最简单的⽅法是声明⼀个counter变量，循环遍历数组，仅在status等于'0'时才迭代counter ：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
let counter = 0;
for (let i = 0; i < storage.length; i++) {
if (storage[i].status === '0') counter++;
}
console.log(counter); // 6
You could simplify this a bit by using f loop:
您可以使⽤f循环将其简化⼀些：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
let counter = 0;
for (const obj of storage) {
if (obj.status === '0') counter++;
}
console.log(counter); // 6
Also, you could create a function to do the same thing if you have other arrays of objects to count conditionally:
另外，如果您有其他对象数组有条件地计数，则可以创建⼀个函数来执⾏相同的操作：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
function statusCounter(inputs) {
let counter = 0;
for (const input of inputs) {
if (input.status === '0') counter += 1;
}
return counter;
}
statusCounter(storage); // 6
使⽤数组⽅法 (Use array methods)
JavaScript includes a bunch of when working with arrays. Each one can be chained to an array and passed different parameters to work with while iterating through the elements in the array.
在使⽤数组时，JavaScript包括许多 。 每个对象都可以链接到⼀个数组，并传递不同的参数以在迭代数组中的元素时使⽤。
The two we'll look at are filter() and reduce().
我们要看的两个是filter()和reduce() 。
filter() (filter())
The filter method does just that – it iterates through each element in the array and filters out all elements that don't meet the condition(s) you provide. It then returns a new array with all the elements that returned true based on your condition(s).
filter⽅法就是这样做的–遍历数组中的每个元素，并过滤掉所有不符合您提供的条件的元素。 然后，它将返回⼀个新数组，其中包含根据您的条件返回true的所有元素。
For example:
例如：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
const count = storage.filter(function(item){
if (item.status === 0) {
return true;
} else {
return false;
}
});
/*
[
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' }
]
*/
Now that you've filtered out the object with status: '1', just call the length() method on the new array to get the total count of objects with status: '1':
现在，您已经过滤掉了status: '1'的对象，只需在新数组上调⽤length()⽅法即可获取status: '1'的对象的总数：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
const count = storage.filter(function(item){
if (item.status === 0) {
return true;
} else {
return false;
}
}).length; // 6
But this can be shortened a lot with ES6 syntax:
但这可以通过ES6语法⼤⼤缩短：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
const count = storage.filter(item => item.status === '0').length; // 6
reduce() (reduce())
Think of the reduce() method like a Swiss army knife – it's extremely flexible, and lets you take an array as input and transform it into just about anything. Even better, like filter(), this method returns a new array, leaving the original unchanged.
filter过滤对象数组
将reduce()⽅法想像成瑞⼠军⼑⼀样，它⾮常灵活，可以让您将数组作为输⼊并将其转换为⼏乎任何东西。 更好的是，像filter() ，此⽅法返回⼀个新数组，⽽原始数组保持不变。
You can read more about reduce() in .
您可以在阅读有关reduce()更多信息。
For our purposes, we want to take an array, examine its contents, and produce a number. Here's a simple way to do that:
为了我们的⽬的，我们想要⼀个数组，检查它的内容，并产⽣⼀个数字。 这是⼀种简单的⽅法：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
const count = duce((counter, obj) => {
if (obj.status === '0') counter += 1
return counter;
}, 0); // 6
You could simplify further by using ES6 syntax and a ternary operator:
您可以使⽤ES6语法和三元运算符进⼀步简化操作：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
const count = duce((counter, obj) => obj.status === '0' ? counter += 1 : counter, 0); // 6
And even a bit more by using :
通过使⽤ ，甚⾄更多：
const storage = [
{ data: '1', status: '0' },
{ data: '2', status: '0' },
{ data: '3', status: '0' },
{ data: '4', status: '0' },
{ data: '5', status: '0' },
{ data: '6', status: '0' },
{ data: '7', status: '1' },
];
const count = duce((counter, { status }) => status === '0' ? counter += 1 : counter, 0); // 6
So those are a few ways to go through the elements of an array and count them conditionally. Now get out there and count with confidence!
因此，这些是通过数组的元素并有条件地对其进⾏计数的⼏种⽅法。 现在⾛到那⾥，充满信⼼地计数！
翻译⾃:
js对象数组计算总计