iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 16
0
自我挑戰組

菜鳥工程師的奇幻漂流:跟著kata活化手指和意識系列 第 16

Create Phone Number

今日kata

原始題目如下:(6kyu)
Write a function that accepts an array of 10 integers (between 0 and 9), that returns a string of those numbers in the form of a phone number.

翻譯:
將陣列中的10個數字依照指定電話號碼格式回傳。Ex:"(123) 456-7890"

範例:

createPhoneNumber([1, 2, 3, 4, 5, 6, 7, 8, 9, 0]) // => returns "(123) 456-7890"

構想&解法

function createPhoneNumber(numbers) {
  let prefix = numbers.slice(0, 3).join('')
  let body = numbers.slice(3)
  body.splice(3, 0, '-')
  body = body.join('')
  return `(${prefix}) ${body}`
}

分成prefix和body兩部分來組合字串。有點費工和繁瑣....


其他解法觀摩

function createPhoneNumber(numbers){
  var format = "(xxx) xxx-xxxx";
  for(var i = 0; i < numbers.length; i++)
  {
    format = format.replace('x', numbers[i]);
  }
  return format;
}

第一眼看到這個解法,眼睛亮晶晶! 

  • 先把字串格式以format存入,數字以x取代
  • For loop迴圈遍歷numbers陣列,一一替代x

如果臨時要改變電話號碼格式,直接異動format就好,很優!


function createPhoneNumber(numbers){
  return numbers.join('').replace(/(...)(...)(.*)/, '($1) $2-$3');
}

使用capture group表示匹配的群組,組合成需要的格式!

一行解決也是驚人...


整理用法

字串.replace()

在先前Vowel CountWho likes it?有提到replace()基本用法。這次的replace()用到是匹配群組的替換。

以下範例摘自MDN web docs:String.prototype.replace()

function replacer(match, p1, p2, p3, offset, string) {
  // p1 is nondigits, p2 digits, and p3 non-alphanumerics
  return [p1, p2, p3].join(' - ');
}
var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer);
console.log(newString);  // abc - 12345 - #$*%

// p1代表匹配([^\d]*)的字串  ----> 非任意數字(亦不包含符號)
// p2代表匹配((\d*)的字串    ----> 任意數字
// p3代表匹配([^\w]*)的字串  ----> 非文字

匹配到的群組也可以依序由$1、$2、$3...$n表示,像這題使用到的:

function createPhoneNumber(numbers){
  return numbers.join('').replace(/(...)(...)(.*)/, '($1) $2-$3');
}

.代表單一字元
*代表匹配前一個字元0~多次

  • $1=前3個字元
  • $2=第4~6的字元
  • $3=第7個字元以後的所有字元

要組成的字串形式為($1) $2-$3

以上為今日分享的內容,若有錯誤或是建議,請再隨時和我聯繫。


上一篇
Tribonacci Sequence
下一篇
Isograms
系列文
菜鳥工程師的奇幻漂流:跟著kata活化手指和意識30

尚未有邦友留言

立即登入留言