标签:兼容 const 多个 data 处理 world 不可 exp 参数
es6新增加了块作用域,也就是{}包起来的代码。
function test(){ let a = 0; const b = 0; }
const常量不能修改,并且声明常量必须赋值!
const和let的唯一区别就是,const不可以被更改,所以当声明变量的时候,尤其是在声明容易被更改的全局变量的时候,尽量使用const。
解构赋值的分类:数组结构赋值(左右都是数组)、对象结构赋值(左右都是对象)、字符串结构赋值(左数组、右字符串)、布尔值结构赋值、函数参数解构赋值(数组解构赋值在函数上的引用)、数值解构赋值。
{ let a,b,rest; [a, b]=[1,2]; console.log(a);//1 console.log(b);//2 } { let a,b,rest; [a, b, ...rest]=[1,2,3,4,5,6]; console.log(a, b, rest);//1 2 [3,4,5,6] } { let a,b; ({a, b}={a:1,b:2}); console.log(a, b);//1,2 } { let a,b,c,rest; [a, b,c = 3]=[1,2]; console.log(a, b, c);//1 2 3 }
如果c没有赋值,找不到可以配对的值,c就是undifined。
适用场景:变量交换,选择性获取返回值。
{ let a=1; let b=2; [a, b]=[b,a]; console.log(a, b);//2 1 } { function f() { return [1,2]; } let a,b; [a, b]=f();//1 2 } { function f1() { return [1,2,3,4,5]; } let a,b,c; [a, , ,b]=f1(); console.log(a, b);//1 4 } { function f1() { return [1,2,3,4,5]; } let a,b,c; [a,...b]=f1(); console.log(a, b);//1 [2,3,4,5] }
上面这两种也可以混合使用。
在用到数组成员对变量赋值时,尽量使用解构赋值。
对象的解构赋值::
{ let o={p:42,q:true}; let {p,q}=o; console.log(p, q);//42 true } { let {a=10,b=5}={a:3}; console.log(a, b);//3 5 a=10是默认值,找不到匹配项时才=10 }
使用场景:
{ let metaData={ title: ‘abc‘, test: [{ title: ‘test‘, desc: ‘description‘ }] }; let {title:esTitle,test:[{title:cnTitle}]} = metaData; console.log(esTitle,cnTitle);//abc test }
函数的参数如果是对象的成员,优先使用解构赋值。
如果函数返回多个值,优先使用对象的解构赋值,而不是数组的解构赋值。这样便于以后添加返回值,以及更改返回值的顺序。
正则新增特性:u修饰符、y修饰符、s修饰符。
{ //es5 let regex=new RegExp(‘xyz‘,‘i‘); let regex2=new RegExp(/xyz/i);//或者直接/xyz/i console.log(regex.test(‘xyz123‘));//true console.log(regex2.test(‘xyz123‘));//true //es6,参数可以下面这样 let regex3=new RegExp(/xyz/ig,‘i‘); console.log(regex3.flags);//i 即第二个参数的修饰符会覆盖前面正则表达式的修饰符 } { //y修饰符 vs g修饰符 let s=‘bbb_bb_b‘; let a1=/b+/g; let a2=/b+/y; console.log(‘one‘,a1.exec(s),a2.exec(s));//bbb bbb console.log(‘two‘,a1.exec(s),a2.exec(s));//bb null //相同点:都是全局匹配 //不同点:g是上一次匹配的下一个字符开始,即_,不强调在第一个字符就能匹配上 //不同点:y是上一次匹配的下一个字符开始,即_,但是必须得在第一个字符就能匹配上 console.log(a1.sticky,a2.sticky);//false true 是否开启y } { //u修饰符:unicode console.log(‘u-1‘,/^\uDB3D/.test(‘\uDB3D\uDC2A‘));//u-1 true //\uDB3D\uDC2A当成两个字符 console.log(‘u-2‘,/^\uDB3D/u.test(‘\uDB3D\uDC2A‘));//u-2 false //\uDB3D\uDC2A当成一个字符 console.log(/\u{61}/.test(‘a‘));//false console.log(/\u{61}/u.test(‘a‘));//true console.log(`\u{20BB7}`);//unicode编码大于FFFF,即大于两个字节 let s=‘??‘; console.log(/^.$/.test(s));//false console.log(/^.$/u.test(s));//true console.log(‘test‘,/??{2}/.test(‘????‘));//test false console.log(‘test2‘,/??{2}/u.test(‘????‘));//test2 true //总结,大于两个字节长度的字符,要加u //但是仍然不能匹配换行符,回车符,行分隔符,段分隔符 //如果要能匹配,使用s修饰符,但是s修饰符es6尚未实现 }
安装补丁库,处理兼容:npm install babel-polyfill --save-dev
需要引入兼容库
import ‘babel-polyfill‘;
{ console.log(‘a‘,‘\u0061‘);//a a console.log(‘a‘,‘\u20BB7‘);//a ?7 超过了0xFFF,即两个字节,会被当成两个字符 console.log(‘s‘,`\u{20BB7}`);//s ?? } { let s=‘??‘; //es5 console.log(‘length‘,s.length);//2 (码字大于两个字节,当四个字节处理,计算长度的时候每两个字节算一个长度) console.log(‘0‘,s.charAt(0));//0 乱码 console.log(‘0‘,s.charAt(2));//0 乱码 console.log(‘at0‘,s.charCodeAt(0));//at0 55362 console.log(‘at1‘,s.charCodeAt(1));//at0 57271 //es6 let s1=‘??a‘; console.log(‘length‘,s1.length);//3 console.log(‘code0‘,s1.codePointAt(0));//134071 取出4个字节 console.log(‘code0‘,s1.codePointAt(0).toString(16));//20bb7 console.log(‘code1‘,s1.codePointAt(1));//57271 取出后两个字节 console.log(‘code1‘,s1.codePointAt(2));//97 就是a //.toString(16)转成16进制 } { //es5 console.log(String.fromCharCode(‘0x20BB7‘));//乱码 //es6 console.log(String.fromCodePoint(‘0x20BB7‘));//?? } { let str=‘\u{20BB7}abc‘; for (let i=0;i<str.length;i++){ console.log(‘es5‘,str[i]);//前两个乱码 a b c } for (let code of str){ console.log(‘es6‘,code);//?? a b c } } { let str=‘string‘; console.log(‘includes‘,str.includes(‘r‘));//true console.log(‘start‘,str.startsWith(‘str‘));//true console.log(‘end‘,str.endsWith(‘ng‘));//true } { let str=‘abc‘; //es5是用+ console.log(str.repeat(2));//abcabc } //模板字符串 { let name=‘list‘; let info=‘hello world‘; let m=`i am ${name},${info}`; console.log(m);//i am list,hello world console.log(‘1‘.padStart(2,‘0‘));//01 console.log(‘1‘.padEnd(2,‘0‘));//10 } //标签模板:防止XSS攻击,处理多语言 { let user={ name: ‘list‘, info: ‘hello world‘ }; console.log(abc`i am ${user.name},${user.info}`); function abc(s,v1,v2) { console.log(s, v1, v2);//["i am ", ",", "",] "list" "hello world" return s+v1+v2;//i am ,,,listhello world } } { console.log(String.raw`Hi\n${1-2}`);//Hi \n-1 console.log(‘Hi\n${1+2}‘);//Hi 换行 ${1+2} }
{ console.log(0b11110111);//247 0b二进制(大小写均可) console.log(0o11111);//4681 0o八进制(大小写均可) } { console.log(‘15‘,Number.isFinite(15));//true console.log(‘NaN‘,Number.isFinite(NaN));//false console.log(‘1/0‘,Number.isFinite(1/0));//false console.log(‘NaN‘,Number.isNaN(NaN));//true console.log(‘0‘,Number.isNaN(0));//false console.log(‘25‘,Number.isInteger(25));//true console.log(‘25.0‘,Number.isInteger(25.0));//true 25.0=25 console.log(‘25.1‘,Number.isInteger(25.1));//false console.log(‘25.0‘,Number.isInteger(‘25.0‘));//false console.log(Number.MAX_SAFE_INTEGER); console.log(Number.MIN_SAFE_INTEGER); console.log(Number.isSafeInteger(10));//true 是否位于上面两个数的范围内 console.log(Number.isSafeInteger(‘a‘));//false //es5:Math.floor,Math.ceil console.log(4.1,Math.trunc(4.1));//4 console.log(4.9,Math.trunc(4.9));//4 console.log(‘-5‘,Math.sign(-5));//-1 console.log(‘5‘,Math.sign(5));//1 console.log(‘0‘,Math.sign(0));//0 console.log(‘a‘,Math.sign(‘a‘));//NaN //开立方根 console.log(Math.cbrt(-1));//-1 console.log(Math.cbrt(8));//2 }
标签:兼容 const 多个 data 处理 world 不可 exp 参数
原文地址:https://www.cnblogs.com/Addie/p/11880203.html