forEach

Array.prototype.forEach(fn)

方法從頭至尾遍歷陣列，為每個元素呼叫指定的函式。

ES6 的 => 語法可以讓匿名函式更簡潔，取代 function 關鍵詞。

var numbers = [1, 2, 3];

numbers.forEach(x => console.log(x));
// 同等於
numbers.forEach(function (x) {
    console.log(x);
});

例子

用 forEach 列印每個元素：

var numbers = [1, 2, 3];

numbers.forEach(x => {
    console.log(x)
});
forEach 的效果相當於迴圈遍歷一個數組，如下：

var numbers = [1, 2, 3];

for (let i = 0; i < numbers.length; i++) {
    let x = numbers[i];
    console.log(x);
}
 

例子 2

加總每個元素：

var numbers = [1, 2, 3];

var sum = 0;
numbers.forEach(x => {
    sum += x;
});

用 `forEach` 列印所有美國開國先帝的名字和上任的年份。

應該輸出：

George Washington 1789
John Adams 1797
Thomas Jefferson 1801
James Madison 1809
James Monroe 1817

 let presidents = [
            {id: 1, name: "George Washington", year: 1789},
            {id: 2, name: "John Adams", year: 1797},
            {id: 3, name: "Thomas Jefferson", year: 1801},
            {id: 4, name: "James Madison", year: 1809},
            {id: 5, name: "James Monroe", year: 1817},
        ];

        presidents.forEach(x => {
            console.log(x.name + '' + x.year);
        });
 

 /*
用 `forEach` 把字串拼接在一起。

輸出：

We hold these truths to be self-evident,
 that all men are created equal,
 that they are endowed by their Creator with certain unalienable Rights,
  that among these are Life, Liberty and the pursuit of Happiness.
*/

        let words = [
            'We', 'hold', 'these', 'truths',
            'to', 'be', 'self-evident,', 'that', 'all', 'men', 'are', 'created', 'equal,', 'that', 'they', 'are', 'endowed',
            'by', 'their', 'Creator', 'with', 'certain', 'unalienable', 'Rights,', 'that',
            'among', 'these', 'are', 'Life,', 'Liberty', 'and', 'the', 'pursuit', 'of', 'Happiness.'
        ];

        let paragraph = "";

        words.forEach(x => {
            paragraph += x;
        });

        console.log(paragraph);

        /*
        把所有數組裡面的數字乘以二，新增到 result 這個數組裡面.
        用 Array.prototype.push.
        輸出：[ 1, 4, 6, 8 ]
*/

        let numbers = [1, 2, 3, 4];

        let result = [];

        numbers.forEach(x => {
            x = x * 2;
            result.push(x);
        });


        console.log(result);


        /*把數組裡面的數字按反序新增到 reversedNumbers 這個數組裡面。
        用 Array.prototype.unshift。
        輸出：[ 6, 5, 4, 3, 2, 1 ]
*/

        let numbers = [
            1, 2, 3, 4, 5, 6
        ];

        let reversedNumbers = [];

        numbers.forEach(x => {
            reversedNumbers.unshift(x);
        });


        console.log(reversedNumbers);

        /*把所有巢狀數組裡面的數字新增到 allNumbers 這個數組裡面.
        用 Array.prototype.push.
        輸出：[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]
*/

        let numbers = [
            [1, 2, 3, 4],
            [5, 6, 7],
            [8, 9],
            [],
            [10],
        ];

        let allNumbers = [];

        numbers.forEach(x => {
            x.forEach(y => {
                allNumbers.push(y);

            });
        });


        console.log(allNumbers);


        /*

用 `forEach` 列印巢狀數組裡面的數字

應該輸出：

1
2
3
4
5
6
7
*/

        let arrays = [[1, 2], [3, 4], [5, 6, 7]];

        arrays.forEach(x=>{

            x.forEach(y=>{
                console.log(y);

            });
        })