「ES6新特性 |
您所在的位置:网站首页 › es6新特性有哪些 › 「ES6新特性 |
ES6新特性 _1
一、什么是ES 6 1、ES6全称为EMAScript 6,是由ECMA国际标准组织制定的一项针对JavaScirpt脚本语言的标准化规范,同时也新增了许多特性。是 JavaScript 语言的下一代标准。参考文档:https://es6.ruanyifeng.com/ 二、let 和 const 命令1、let 命令let 命令 用于声明局部变量 { let a = 10; var b =20; } a //调用失败 let 声明的变量的为局部变量,只在{....}的块作用域生效。 b //20 var 声明的变量为全局变量,在全局作用域生效2、const 命令const 命令 用于声明一个只读常量,一旦声明了就不能改变。const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。 const a = 10; a = 20; //再次赋值失败 const创建的变量为常量,一旦声明了就不能改变3、变量提升与非变量提升变量提升指的是变量的作用域提升。常表现为:var 声明变量可以先使用后声明,值为undefined。 consolo.log(value) //undefinedvar value = 10;12而非变量提升指的是变量需要 先声明后使用,区别于var 声明的变量。常变现为:let声明的变量。 consolo.log(value) //报错ReferenceErrorlet value = 10;let value2 = 10;consolo.log(value) //10 123456三、变量的解构赋值1、什么是解构赋值?变量的解构赋值为ES新推出的特性,指的是ES6允许按照一定的模式,从数组或对象中取出值,对变量进行赋值。 如果解构不成功,变量的值就等于undefined。 语法如下: # 数组解构let [a,b,c] = [1,2,3] 这种写法称为模式匹配,只要 “两边” 结构一致即可赋值。 a //1b //2c //3# 数组嵌套解构let [a,[[b],c]] = [1,[[2],3]] a //1 b //2c //3# 部分解构不成功let [a,b] = [1] a //1b //undefined 部分解构不成功# 对象解构let node = { sex:'fmale', age:10}let [sex,age] = node;sex //fmale 对象解构,对于内置对象同样可以。age //10# 拓展运算符解构let [a,...b] = [1,[2,3,4]] a //1 b //[2,3,4] 拓展运算符... 解构,下一篇文章会解释# 字符串的解构赋值let [a,b,c] = '123';a //1 b //2c //3 # 函数参数的解构赋值function add([x,y]){ return x + y;}let value = add([1,2]) value //3 函数的参数解构赋值 形容 let [x,y] = [1,2]# 数值的解构赋值let [a,b,c] = 123a //1 数值解构b //2c //3 //原则上 只要两边的结构一致都可以进行解构赋值。1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950512、解构赋值能指定默认值?解构赋值可以指定默认值,使用 = 运算符语法如下: let [a,b=3] = [1]a //1b //3let [a,b=3] = [1,2]a //1b //312345673、解构赋值能起别名?解构赋值可以起别名,使用 :运算符 let [a : one,b = 2] = [1]one //1b //2123四、字符串的拓展1、字符的Unicode表示法let value = "\u0061"value // 'a'122、模板字符串模板字符串指是增强版的字符串,用反引号(`)标识。 它可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量,逻辑运算,以及解析javasciprt脚本语言。 语法如下: # 普通多行字符串定义let text = 'Hello '+'3、模板字符串默认会将字符串转义详见官方文档 https://es6.ruanyifeng.com/ 4、新增字符串的方法① 对象方法:String.fromCodePoint( )ES5 提供String.fromCharCode()方法,用于从 Unicode 码点返回对应字符,但是这个方法不能识别码点大于0xFFFF的字符。 ES6 提供了String.fromCodePoint()方法,可以识别大于0xFFFF的字符。语法如下: String.fromCodePonit('\u{D834}'); // "ஷ"1② 对象方法:字符串转义String.raw( )ES6提供一个为字符串转义的方法。该方法返回一个斜杠前面再加一个斜杠的字符串。但实际显示的是被转义后的字符串。 常用于模板字符串,语法如下: String.raw`Hello \n world` //返回结果为 Hello \\n world //实际返回的结果为 Helo \n world③ 实例方法:includes(), startsWith(), endsWith()传统上,JavaScript 只有indexOf方法,可以用来确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。 includes():返回布尔值,表示是否找到了参数字符串。startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。 let text = 'Hello ! ES 6'; text.includes('Hello'); //true text.startsWith('H'); //true text.endsWith('6'); //true④ 实例方法:repeat( )repeat( args)方法表示,将一个字符串重复几次,并返回该新字符串。 args代表重复的次数,如果是小数则会向上取整。 ‘q’.reoate(3); //qqq 'mm'.repeat(3); //mmmmmm⑤ 实例方法:padStart(),padEnd()ES6 2017版本,提供了一个字符串两个补全方法。 padStart( num,parm) 方法:基于首位补全字符,num为补全后的字符串长度,parm为补全的字符。 'c'.padStart(3,'ab'); //abcpadEnd(num,parm)方法:基于末尾补全字符,num为补全后的字符串长度,parm为补全的字符。 'c'.padEnd(3,'ab'); //cab⑥ 实例方法:trimStart( )、trimEnd( )ES6 2019版本提供了两个去除空格的方法,trimStart( )、trimEnd( ),其行为是trim( )是一致的。 const text = ' abc '; a.trim(); //'abc' a.trimStart(); //'abc' a.trimEnd(); //'abc'⑦ 实例方法:matchAll( )matchAll( ) 一个字符串中正则匹配的所有字符子串。详见正则表达的拓展。 ⑧ 实例方法:replaceAll( )replaceAll (‘被替换的字符’,‘要替换的字符’ ) 是ES 6新推出的实例方法,用于替换所有的指定字符。 对比以往的replace( )方法,以往的方法只能替换第一个的匹配的结果。而replaceAlll( )则替换所有。 const text = 'abca'; text.replace('a','1'); //1bc text.replaceAll('a','1'); //1bc1 婷婷 js es6 534 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |