Skip to content

Latest commit

 

History

History
128 lines (97 loc) · 3.71 KB

3、字符串的扩展.md

File metadata and controls

128 lines (97 loc) · 3.71 KB

字符串的扩展

1、字符串的遍历接口 for...of循环遍历

实例1：

    for (let codePoint of 'foo') {
        console.log(codePoint)
    }
    // "f"
    // "o"
    // "o"

2、includes(), startsWith(), endsWith()

includes() ：返回布尔值，表示是否找到了参数字符串。
startsWith() ：返回布尔值，表示参数字符串是否在源字符串的头部。
endsWith() ：返回布尔值，表示参数字符串是否在源字符串的尾部。
这三个方法都支持第二个参数，表示开始搜索的位置。
实例：

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

3、repeat()

实例：repeat方法返回一个新字符串，表示将原字符串重复n次。

    let str1='x'.repeat(3) // "xxx"
    let str2='hello'.repeat(2) // "hellohello"
    let str3='na'.repeat(0) // ""

4、padStart() ， padEnd()

ES7 推出了字符串补全长度的功能。如果某个字符串不够指定长度，会在头部或尾部补全。padStart用于头部补全，padEnd用于尾部补全。
实例1：第一个参数用来指定字符串的最小长度，第二个参数是用来补全的字符串。

    'x'.padStart(5, 'ab') // 'ababx'
    'x'.padStart(4, 'ab') // 'abax'
    'x'.padEnd(5, 'ab') // 'xabab'
    'x'.padEnd(4, 'ab') // 'xaba'

实例2：如果原字符串的长度，等于或大于指定的最小长度，则返回原字符串。

    'xxx'.padStart(2, 'ab') // 'xxx'
    'xxx'.padEnd(2, 'ab') // 'xxx'

实例3：如果用来补全的字符串与原字符串，两者的长度之和超过了指定的最小长度，则会截去超出位数的补全字符串。

    'abc'.padStart(10, '0123456789')
    // '0123456abc'

用途1：padStart的常见用途是为数值补全指定位数。下面代码生成 10 位的数值字符串。

    '1'.padStart(10, '0') // "0000000001"
    '12'.padStart(10, '0') // "0000000012"
    '123456'.padStart(10, '0') // "0000123456"

用途2：另一个用途是提示字符串格式。

    '12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
    '09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"

5、 模板字符串

实例1：基本使用

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

实例2：所有模板字符串的空格和换行，都是被保留的，比如

    标签前面会有一个换行。如果你不想要这个换行，可以使用trim方法消除它。

        $('#list').html(`
        <ul>
            <li>first</li>
            <li>second</li>
        </ul>
    `.trim());

    实例3：模板字符串中嵌入变量，需要将变量名写在${}之中。大括号内部可以放入任意的 JavaScript 表达式，可以进行运算，以及引用对象属性。

        var x = 1;
    var y = 2;
    `${x} + ${y} = ${x + y}`
    // "1 + 2 = 3"
        
    `${x} + ${y * 2} = ${x + y * 2}`
    // "1 + 4 = 5"
    
    var obj = {x: 1, y: 2};
    `${obj.x + obj.y}`
    // 3