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