iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 25
0
自我挑戰組

利用30分鐘~想一個前端問題系列 第 25

利用30分鐘~想一個前端問題 Day25-capitalize

capitalize

Use array destructuring and String.prototype.toUpperCase() to capitalize first letter, ...rest to get array of characters after first letter and then Array.prototype.join('') to make it a string again.
Omit the lowerRest parameter to keep the rest of the string intact, or set it to true to convert to lowercase.

字串首字母 大寫

用解構和 toUpperCase() 將首字母大寫,用...rest 去獲得首字母的字串外,然後用 Array.prototype.join('') 將所得的數組合併為字符串

如果用 lowerRest 參數 為 true 將轉變為剩餘字串符為小寫輸出,否則原樣輸出

const capitalize = ([first, ...rest], lowerRest = false) =>
  first.toUpperCase() + (lowerRest ? rest.join('').toLowerCase() : rest.join(''));
EXAMPLES
capitalize('fooBar'); // 'FooBar'
capitalize('fooBar', true); // 'Foobar'

分析點

1....rest

剩餘參數表示參數個數不確定的參數列表。在函數被調用時,該形參會成為一個數組,數組中的元素都是傳遞給該函數的多出來的實參的值。

剩餘操作符可以用來方便地獲取傳進來的引數。

function sum(a,b,...args){
  console.log(args.length); // 傳進來的引數的個數 3
  let s = a + b;
  if(args && args.length){
      args.forEach(i => {s += i});
  }  
 return s;
}
sum(1, 2, 3, 4, 5 ); // 傳進來的引數的個數 3

其中第一個形參a對應的是1,第二個形參b對應的2,…args表示的就是[3, 4, 5]。

2.剩餘操作符與解構賦值

ES6 允許按照一定模式,從陣列和物件中提取值,對變數進行賦值,這被稱為解構(Destructuring)


let obj = {a:1,b:2,c:3}
let {a,b,c} = obj; // a 1, b 2, c 3


let array = [1,2,3]
let [a,b,c] = array; // a 1, b 2, c 3

上一篇
利用30分鐘~想一個前端問題 Day24-What is the difference between JavaScript's for...in, for...of ?
下一篇
利用30分鐘~想一個前端問題 Day26-randomHexColorCode
系列文
利用30分鐘~想一個前端問題30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言