iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 15
0
Modern Web

從零開始進入 JavaScript & TypeScript 的世界系列 第 15

第15天-使用更高階的語法-map

  • 分享至 

  • xImage
  •  

map 的世界裡就是把一個集合透過你想要做的事情之後變成另一個集合,完全不用去 loop collection。

假設我們有一個薪資列表 salaryTwdArray, 為 [155, 22000, 40000, 59999, 90000], 我們現在想要把 salaryTwdArray 轉換成 salaryUsdArray, 如果我們用傳統的做法,會需要這樣做:

let salaryTwdArray = [155, 22000, 40000, 59999, 90000];
let salaryUsdArray = [];
const TWD_TO_USD_RATE = 0.032208;

for (let i = 0; i < salaryTwdArray.length; i++) {
    salaryUsdArray.push(salaryTwdArray[i] * TWD_TO_USD_RATE);
}

console.log("salaryUsdArray => " + salaryUsdArray);

如果是用高階的函式 map,我們就只要告訴他我們要將 TWD 轉成 USD,不用去管 for 迴圈了。他的語法是這樣的:array.map(callback[, thisObject]);

const TWD_TO_USD_RATE = 0.032208;
let salaryTwdArray = [155, 22000, 40000, 59999, 90000];
let convertTwdToUsd = (x: number) => x * TWD_TO_USD_RATE;
let salaryUsdArray = salaryTwdArray.map(convertTwdToUsd); // 這裡是指 salaryTwdArray 裡的元素都要轉乘 TWD
console.log("salaryUsdArray (map version) => " + salaryUsdArray);

想一想

假設今天我們有一個 array 的內容是 [1, 2, 3, 4, 5], 我們想要取得這個 array 內容的全部平方值,我們可以怎麼做呢?

reduce 的想一想解答

function concateWithComma(data:string[]):string {
    return data.reduce((result, str)=> result + ", " + str);
}

上一篇
第14天-使用更高階的語法-reduce
下一篇
第16天-使用更高階的語法-filter
系列文
從零開始進入 JavaScript & TypeScript 的世界30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言