字串的擴充套件 —— ES6基礎總結（四）

圖譜

ES6給字串都引入了哪些新功能呢？

模板字串

1. 可當做普通字串；
2. 可定義多行字串；
3. 可在字串中嵌入變數。

    let year = new Date().getFullYear()
    let language = 'es6'
    let before = '歡迎學習' + language + ' —— ' + year  // 歡迎學習es6 —— 2019
    let after = `歡迎學習${language} —— ${year}`    // 歡迎學習es6 —— 2019 
複製程式碼

新增API

包含

1. includes(str)

   是否找到了引數字串。

2. startsWith(str)

   引數字串是否在原字串的頭部。

3. endsWith(str)

   引數字串是否在原字串的尾部。

   • str: 要查詢的字串。

    let str = 'https://www.baidu.com/'
    str.includes('baidu')   // true
    str.startsWith('https')     // true
    str.endsWith('com/')    // true
複製程式碼

補全

1. padStart(n, str)

   字串不夠指定長度，會在頭部補全。

2. padEnd(n, str)

   字串不夠指定長度，會在尾部補全。

   • n: 字串補全生效的最大長度；
   • str: 用來補全的字串。

    let str = '9999'
    str.padStart(6, 0)      // 009999
    str.padEnd(6, 0)    // 999900
複製程式碼

重複

1. repeat(n)

   將原字串重複n次。

   • n: 要重複的次數。

     (1).小數取整；

     (2).Infinity或負數報錯；

     (3).字串會先轉為數字；

     (4).NaN 相當於0。

     '$'.repeat(9)      // $$$$$$$$$
     '$'.repeat('9')      // $$$$$$$$$
     '$'.repeat(NaN)    // ''
     '$'.repeat(Infinity)       // Uncaught RangeError: Invalid count value
複製程式碼

取消空格

1. trimStart() / trimLeft()

2. trimEnd() / trimRight()

   返回消除空格後的新字串，不會修改原始字串。

    let str = '   hello   '
    
    str.trim()      // "hello"
    
    str.trimStart()     // "hello   "
    str.trimLeft()      // "hello   "
    
    str.trimEnd()       // "   hello"
    str.trimRight()     // "   hello"
複製程式碼

匹配

1. matchAll(reg)

   返回一個正規表示式在當前字串的所有匹配。

   • reg: 正規表示式。

    let regexp = /t(e)(st(\d?))/g
    let str = 'test1test2'
    let arr = [...str.matchAll(regexp)]
    
    arr[0]      // ["test1", "e", "st1", "1", index: 0, input: "test1test2", groups: undefined]
    arr[1]      // ["test2", "e", "st2", "2", index: 5, input: "test1test2", groups: undefined]
複製程式碼

參考

ECMAScript 6 入門

小結

本文主要介紹了ES6中對字串引入的一些常用功能。

感謝閱讀，如有問題，歡迎指正。