ES6-字符串新增特性

怼烎@ 2022-05-15 04:06 484阅读 0赞

**1.模板字符串**

（1）定义比较长，复杂的字符串，如html代码

模板字符串中写 \` 需要转义，例子：

<script>
    let html=`
             <div>\`//若需要在里面加反引号，则需要进行转义，只需  \`
                   <p>你好</p>
                   <a href="#">跳转链接</a>
              </div>
         `;// ``反引号
    console.log(html);
    </script>

（2）模板字符串中插入变量$\{变量名\}：

<script>
    //定义变量
    let username='小丽';
    let html = `
               <div>
                      <p>${username}</p>
               </div>`
    //输出<div>
                       <p>小丽</p>
               </div>
    </script>

（3）模板字符串中插入函数的调用$\{函数名()\}

<script>
    function fn(){
          return "hello world";
    }
    let html =  `
         <div>
               <p>${fn()}</p>
         </div>
    `//输出<div>
               <p>hello world</p>
         </div>
    <script>

**2.字符串重复方法repeat()**

把字符串重复输出，repeat()中加参数，例子：

<script>
    let str = "hello world";
    console.log(str.repeat(3));//第一种
    console.log('hi'.repeat(10));//第二种
    </script>

**3.字符串补全长度方法padStart()/padEnd()**

（1）padStart()给字符串前面添加字符；

例子：

<script>
    let str = "hellow";
    console.log(str.padStart(5));//自动子字符串钱补充5个空格，输出     hellow
    console.log(str.padStart(5,"abc"))；//输出：
    (  abchellow)
    console.log(str.padStart(5,"*"))；//输出：
    (*****hellow)
    </script>

（2）padEnd()给字符串后面添加内容；

例子：

<script>
    let str = "hellow";
    console.log(str.padEnd(5));//自动子字符串钱补充5个空格，输出（hellow     ）
    console.log(str.padEnd(5,"abc"))；//输出：
    (hellowabc  )
    console.log(str.padEnd(5,"*"))；//输出：
    hellow(*****)
    </script>

**4.includes() / startsWith() / endWith()字符串包含验证，返回true和false**

(1) includes()查询字符串里是否包含\*\*，例：

<script>
    let str = "hello World";
    console.log(str.includes('a'));//查询str中是否包含“a”,输出true
    conlose.log(str.includes('ow'));//查询str中是否包含“ow”,输出true
    </script>

(2) startsWith()查询字符串是否是以\*\*\*开头，例：

<script>
    let str = "hello World";
    console.log(str.startWith('hello'));//查询str中是否以'hello'开头,输出true
    conlose.log(str.startWith('h'));//查询str中是否以'h'开头,输出true
    </script>

(3) endWith()查询字符串是否是以\*\*\*结尾，例：

<script>
    let str = "hello World";
    console.log(str.endWith('world'));//查询str中是否以'world'结尾,输出true
    conlose.log(str.endWith('d'));//查询str中是否以'd'结尾,输出true
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，484人围观）

还没有评论，来说两句吧...

相关阅读

相关 ES6/ES7/ES8新特性之新增处理字符串的方法

我主要提常用方法 includes() // let str = 'happy'; 是否包括以下字符，返回true or false // c

快来打我*/ 2023年08月17日 15:42/ 0 赞/ 164 阅读

相关 ES6所有新增特性总结

ES6新增特性 let const 解构赋值模板字符串数组新增的方法字符串新增的方法函数新增的方法对象新增的方法

￡神魔★判官ぃ/ 2023年07月25日 14:05/ 0 赞/ 3 阅读

相关 ES6新增的特性

let 和 const 命令 var 之前，我们写js定义变量的时候，只有一个关键字： var var 有一个问题，就是定义的变量有时会莫名奇妙的成为全局变量。

淡淡的烟草味﹌/ 2023年07月04日 11:09/ 0 赞/ 36 阅读

相关 ES11新增特性

文章目录一、私有属性二、Promise.allSettled 1. Promise.allS

深藏阁楼爱情的钟/ 2022年12月30日 13:38/ 0 赞/ 82 阅读

相关 ES6新增特性小结

ES6新增特性 1. 变量 var :可重复声明；函数级作用域； const ：不可重复声明；块级作用域；常量 le

桃扇骨/ 2022年12月19日 08:56/ 0 赞/ 166 阅读

相关 ES6新增特性

-------------------- let和const命令 let和var的区别 var a = []; for (var i = 0; i

我就是我/ 2022年11月27日 10:15/ 0 赞/ 286 阅读

相关 ES6-对象的新增特性

1.属性的简介表示法例子： <script> let username = "Mark"; let userage = 100;

╰+哭是因爲堅強的太久メ/ 2022年05月15日 04:07/ 0 赞/ 264 阅读

相关 ES6-函数新增特性

1.函数参数的默认值 <script> function fn(a='小丁',b){ console.log(a+"和"+b+""写代码);

雨点打透心脏的1/2处/ 2022年05月15日 04:06/ 0 赞/ 479 阅读

相关 ES6-字符串新增特性

1.模板字符串（1）定义比较长，复杂的字符串，如html代码模板字符串中写 \` 需要转义，例子： <script> let html

怼烎@/ 2022年05月15日 04:06/ 0 赞/ 485 阅读

相关 JS中的模板字符串(ES6新增)

模板字符串(template strings) ES6引入了一种新的字符串字面量语法，特点如下： > 使用反引号\`包围字符串(常规是用单引号`'`或双引号`"`)。

末蓝、/ 2022年03月01日 08:08/ 0 赞/ 683 阅读