我想說的是
map() 方法會建立一個新的陣列,其內容為原陣列的每一個元素經由回呼函式運算後所回傳的結果之集合。
上一篇講了箭頭函數,這一篇來講講 map
根據 MDN 上的說明
map 會將所有陣列中的元素依序分別傳入直執行設定的程式碼,然後使用回傳的值建立一個新的陣列
所以 map 並不會修改呼叫它的原始陣列
如果有其他程式語言經驗,或是原本寫過 javascript 對以下程式碼應該不會感到陌生
var myArray = [ 1, 2, 3 ];
for (var index in myArray) {
console.log(myArr[index]);
}
var myArray = [ 1, 2, 3 ];
myArray.forEach(function(element) {
console.log(element);
});
那為什麼要用 map 呢?簡單來說就是底下幾點
舉例來說,如果我們要把學生成績資料全部乘 3,因為大家真的考太爛了
用迴圈的寫法
var grade = [20, 30, 10];
for (var key in grade) {
grade[key] = grade[key] * 10;
}
// [ 60, 90, 30]
console.log(grade);
這時候萬一,有學生還是被當要來申訴
想知道他原始的成績
因為原始的 grade 陣列已經被修改,我們拿不出原始的成績
就起爭議了,學生找家長來就會很大聲,把我們辦公室坐墊都拆掉
而如果使用 map 來處理的話
則是使用 map 遍歷 grade 所有元素做運算
最後完成後把結果賦值給一個新的陣列 newGrade
var grade = [20, 30, 10];
var newGrade = grade.map(function(element) {
return element * 10;
});
// [ 60, 90, 30]
console.log(newGrade);
這時候萬一學生又想來拆座墊
我們就可以拿出原始的成績陣列 grade 來證明我們奉公守法坦蕩蕩
下一篇來講講解構