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:數組中當前被傳遞的元素.this

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);code

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.jsx

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表達式,
它使得從數組或對象中提取數據賦值給不一樣的變量變爲可能.it

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
相關文章
相關標籤/搜索