本文章有自己的見解以及參考MDN 上的資料，詳細連結有：
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map

forEach map

1.1 forEach 和 map 的語法

1.1.1 forEach 有兩種形式

array.forEach = function(callback(ele, index, array){}, this);
或者
array.forEach = function(callback(ele, index, array){});  
上述兩個的區別就是有沒有繫結this 到物件
 

callback: 為陣列中每個元素執行的函式,該函式接收三個引數，
引數一：當前陣列中元素；引數二：索引； 引數三：當前陣列。

1.1.2 map的寫法

var new_array = arr.map(callback[, thisArg])

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
       //   Return element for new_array  }[, 
thisArg]);

2 異同點

2.1 相同之處

• forEach map
  操作的只能陣列
• 都接收一個回撥函式作為引數，回撥函式裡面有三個引數，第一個引數是陣列的元素，第二個是索引，第三個是 當前陣列
• 都是迴圈遍歷陣列每一項
• 匿名函式中的this指向的都是window
• 執行的速度都沒有 for 迴圈快，因為接受一個回撥函式，所以在效能方面比不上 for迴圈

2.2 不同點

• forEach(）返回值是undefined ，不可以鏈式呼叫,理論上這個方法是沒有返回值的，僅僅是遍歷陣列中的每一項，不對原來陣列進行修改；但是可以自己通過陣列的索引來修改原來的陣列；
• map返回的是一個新陣列，不會改變原有的陣列
• map方法有返回值，支援鏈式呼叫；
• 沒有辦法終止或者跳出forEach()迴圈，除非丟擲異常，所以想執行一個數組是否滿足什麼條件，返回布林值，可以用一般的for迴圈實現，或者用Array.every()或者Array.some();

3.舉個栗子

// 下面的語句返回什麼呢:
["1", "2", "3"].map(parseInt);
// 你可能覺的會是[1, 2, 3]
// 但實際的結果是 [1, NaN, NaN]

// 通常使用parseInt時,只需要傳遞一個引數.
// 但實際上,parseInt可以有兩個引數.第二個引數是進位制數.
// 可以通過語句"alert(parseInt.length)===2"來驗證.
// map方法在呼叫callback函式時,會給它傳遞三個引數:當前正在遍歷的元素, 
// 元素索引, 原陣列本身.
// 第三個引數parseInt會忽視, 但第二個引數不會,也就是說,
// parseInt把傳過來的索引值當成進位制數來使用.從而返回了NaN.

function returnInt(element) {
  return parseInt(element, 10);
}

['1', '2', '3'].map(returnInt); // [1, 2, 3]
// 意料之中的結果

// 也可以使用簡單的箭頭函式，結果同上
['1', '2', '3'].map( str => parseInt(str) );

// 一個更簡單的方式:
['1', '2', '3'].map(Number); // [1, 2, 3]
// 與`parseInt` 不同，下面的結果會返回浮點數或指數:
['1.1', '2.2e2', '3e300'].map(Number); // [1.1, 220, 3e+300]