陣列資料處理 - map

特性

• 可以將原始陣列經過處理後，重新組合回傳一個新陣列
• 不會影響原始陣列

範例一：將陣列內的資料做運算處理

const dataList = [5, 10, 15];
const newDataList = dataList.map(function(item){
  return item * 2;  // 將每一個陣列元素的資料值都乘上 2
});
console.log(newDataList);

結果如下圖：

原始的 dataList 陣列內的資料不會改變

範例二：將陣列內的資料回傳 true 及 false

const dataList = [5, 10, 15];
const newDataList = dataList.map(function(item){
  return item > 7;  // 回傳 > 7 的資料
});
console.log(newDataList);
console.log(dataList);

執行結果

範例三：將陣內中的資料回傳為指定的物件格式

const dataList = [5, 10, 15];
const newDataList = dataList.map(function(item){
  let obj = {};
  obj.checkStatus = item > 7;
  return obj;
});
console.log(newDataList);
console.log(dataList);

參考資料及學習資源

• 六角學院 - JavaScript 必修篇 - 前端修練全攻略
• Array.prototype.map()

本日小節

今天一樣是學習陣列的處理，學習如何 運用 map～
這是我的學習紀錄，我們下次見啦！