ES6的数组方法

reduce()

1.reduce()方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始合并,最终为一个值.
array.reduce(callback, initialValue)
2.callback:执行数组中每个值的函数(也可以叫做reducer),包含4个参数.

1.previousValue:上一次调用回调返回的值,或者是提供的初始值(initialValue)
2.currentValue:数组中当前被处理的元素
3.index:当前元素在数组中的索引
4.array:调用reduce的数组

initialValue:作为第一次调用callback的第一个参数,这个参数不是必需的.

var s = a.reduce((prev, current) => {
    return prev + current;  // 1 + 2, 3+ 3
}, 10);
console.log(s);

var todos = [{
    id: 1,
    completed: true
}, {
    id: 2,
    completed: false
}, {
    id: 3,
    completed: true
}, {
    id: 4,
    completed: true
}, {
    id: 5,
    compelted: false
}];

const completedCount = todos.reduce((count, current) => {
    return current.completed ? count + 1 : count
}, 0);
console.log(completedCount);    // 3

const unCompleted = todos.reduce((count, current) => {
    return !current.completed ? count + 1 : count;
}, 0);
console.log(unCompleted);   // 2

var count = 0;
todos.map((item) => {
    if (item.completed) {
        count++;
    }
});
console.log(count); // 3

filter()

1.filter()方法使用指定的函数测试所有元素,并创建一个包含所有通过测试的元素的新数组.
array.filter(callback, thisArg)
2.callback:用来测试数组的每个元素的函数,包含三个参数.
返回true表示保留该元素(通过测试),返回false则不保留.
currentValue:数组中当前被传递的元素.

var a = [1, 2, 3, 4, 5];

var b = a.filter((item) => {
    return item > 3;
});

console.log(b);

var todos = [{
    id: 1,
    completed: true
}, {
    id: 2,
    completed: false
}, {
    id: 3,
    completed: true
}, {
    id: 4,
    completed: true
}, {
    id: 5,
    compelted: false
}];

var completedTodos = todos.filter((item) => {
    return item.completed;
});

console.log(completedTodos);

map()

1.map()方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组.
array.map(callback, thisArg)
callback:原数组中的元素调用该方法后返回一个新的元素.
currentValue:数组中当前被传递的元素.

var a = [1, 2, 3, 4, 5];

var b = a.filter((item) => {
    return item > 3;
});
console.log(b); // [4 ,5]

var bb = [];
a.map((item) => {
    if (item > 3) {
        bb.push(item);
    }
});
console.log(bb);    // [4, 5]

var bbb = a.map((item) => {
    return item + 1;
});
console.log(bbb);   // [2, 3, 4, 5, 6]

every()

1.every()方法用于测试数组中所有元素是否都通过了指定函数的测试.
array.every(callback, thisArg);

var a = [1, 2, 3, 4, 5];
var b = a.every((item) => {
    return item > 0;
});
var c = a.every((item) => {
    return item > 1;
});
console.log(b); // true
console.log(c); // false

some()

1.some()方法用于测试数组中是否至少有一项元素通过了指定函数的测试.
array.some(callback, thisArg);

var bb = a.some((item) => {
    return item > 4;
});

var cc = a.some((item) => {
    return item > 5;
});
console.log(bb);    // true
console.log(cc);    // false

forEach()

1.forEach()为每个元素执行对应的方法.

var a = [1, 2, 3, 4, 5];

var b = [];
a.forEach((item) => {
    b.push(item + 1);
});
console.log(b); // [2,3,4,5,6]

indexOf()

1.indexOf()方法返回在该数组中第一个找到的元素位置,如果它不存在则返回-1.

 var a = [1, 2, 3, 4, 5];

var b = a.indexOf(2);
var c = a.indexOf(6);
console.log(b); // 1
console.log(c); // -1

展开运算符

1.展开运算符允许一个表达式在某处展开.常用的场景包括:函数参数,数组元素,解构赋值.
另外,jsx的组件props也可以使用展开运算符来赋值.
2.解构赋值(destructuring assignment)语法是一个js表达式,
它使得从数组或对象中提取数据赋值给不同的变量变为可能.

var a = [1, 2, 3, 4, 5];

var [b, c] = a;
console.log(b); // 1
console.log(c); // 2

function fun(...a) {
    console.log(a); // [1, 2, 3]
}
fun(1, 2, 3);   // 传入1,2,3参数,...a为数组[1,2,3]

function gun({a, b}) {
    return a + b;
}
console.log(gun({ a: 1, b: 2 }));   // 3