ES6 String和Number擴展

一、String 擴展

①傳統上，JavaScript 只有indexOf方法，可以用來確定一個字符串是否包含在另一個字符串中。ES6 又提供了三種新方法。

• includes()：返回布爾值，表示是否找到了參數字符串。第二個參數表示搜索起始位置
• startsWith()：返回布爾值，表示參數字符串是否在原字符串的頭部。第二個參數表示搜索起始位置
• endsWith()：返回布爾值，表示參數字符串是否在原字符串的尾部。第二個參數針對前n個字符，而其他兩個方法針對從第n個位置直到字符串結束

let s = 'Hello world!';

s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

let s = 'Hello world!';

s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

②repeat方法返回一個新字符串，表示將原字符串重復n次。參數如果是小數，會被取整。如果repeat的參數是負數或者Infinity，會報錯。

'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""

'na'.repeat(2.9) // "nana"

'na'.repeat(Infinity)
// RangeError
'na'.repeat(-1)
// RangeError

'na'.repeat(-0.9) // ""

na'.repeat(NaN) // ""

'na'.repeat('na') // ""
'na'.repeat('3') // "nanana"

③模板字符串

傳統的 JavaScript 語言，輸出模板通常是這樣寫的。

$('#result').append(
  'There are <b>' + basket.count + '</b> ' +
  'items in your basket, ' +
  '<em>' + basket.onSale +
  '</em> are on sale!'
);

上面這種寫法相當繁瑣不方便，ES6 引入了模板字符串解決這個問題。

$('#result').append(`
  There are <b>${basket.count}</b> items
   in your basket, <em>${basket.onSale}</em>
  are on sale!
`);

模板字符串（template string）是增強版的字符串，用反引號（`）標識。它可以當作普通字符串使用，也可以用來定義多行字符串，或者在字符串中嵌入變量。模板字符串中嵌入變量，需要將變量名寫在${}之中。

function authorize(user, action) {
  if (!user.hasPrivilege(action)) {
    throw new Error(
      // 傳統寫法為
      // 'User '
      // + user.name
      // + ' is not authorized to do '
      // + action
      // + '.'
      `User ${user.name} is not authorized to do ${action}.`);
  }
}

二、Number 擴展

①ES6 將全局方法parseInt()和parseFloat()，移植到Number對象上面，行為完全保持不變。樣做的目的，是逐步減少全局性方法，使得語言逐步模塊化。

// ES5的寫法
parseInt('12.34') // 12
parseFloat('123.45#') // 123.45

// ES6的寫法
Number.parseInt('12.34') // 12
Number.parseFloat('123.45#') // 123.45

②Number.isInteger()用來判斷一個數值是否為整數，JavaScript 內部，整數和浮點數采用的是同樣的儲存方法，比如 25 和 25.0 被視為同一個值。如果參數不是數值，Number.isInteger返回false。

Number.isInteger(25) // true
Number.isInteger(25.1) // false
Number.isInteger(25.0) // true
Number.isInteger() // false
Number.isInteger(null) // false
Number.isInteger('15') // false
Number.isInteger(true) // false

③ES6 在 Math 對象上新增了 17 個與數學相關的方法。所有這些方法都是靜態方法，只能在 Math 對象上調用。

• Math.trunc方法用於去除一個數的小數部分，返回整數部分。
• Math.sign方法用來判斷一個數到底是正數、負數、還是零。對於非數值，會先將其轉換為數值。
• Math.cbrt方法用於計算一個數的立方根。

更多詳細知識點，請參考ECMAScript 6 入門。