ES6

114 阅读3分钟

let const

let

    function test(){
        for(let i=1;i<3:i++){
            console.log(i)
        }
        
        console.log(i)
    }

以上代码显示1,2后将报未定义错误。

    function test(){
       let a=1;
       let a=2;
    }

以上代码将报错,因为a重复定义。

const

常量,不能够修改,且声明必须赋值。

    function test(){
     const PI = 3.1415926;
     PI=8;
    }

以上代码将报错,因为PI为const不能修改。

    function test(){
     const PI = 3.1415926;
     const k={
         a:1
     }
     k.b=3;
     console.log(PI,k)
    }

以上代码能正常执行,因为k为对象,对象为引用类型,k指向的指针不变,对象本身可以更改。

{
    ...
}

称为代码的块作用域,作用域外无法作用于作用域内的变量。

解构赋值

什么是解构赋值

语法上就是赋值,解构就是左边一个结构,右边一个结构,结构一一对应。

解构赋值的分类

数组解构赋值对象解构赋值,字符串解构赋值,布尔值解构赋值,函数参数解构赋值,数值解构赋值。

数组解构赋值

{
     let a,b,rest;
    [a,b] = [1,2];
    console.log(a,b)
}

以上代码将输出1,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,rest;
    [a,b,c] = [1,2];
    console.log(a,b,c)
}

以上将输出1 2 undefined,称为只声明,未赋值。

{
     let a,b,rest;
    [a,b,c=3] = [1,2];
    console.log(a,b,c)
}

以上输出 1 2 3,给c设置默认值。

{
     let a,b,rest;
    [a,b,c=3] = [1,2];
    console.log(a,b,c)
}

数组解构赋值的示例

{
    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();
   console.log(a,b)
}

以上结果输出1 2

{
   function f(){
       return [1,2,3,4,5]
   }
   let a,b,c;
   [a,,,b]=f();
   console.log(a,b)
}

以上结果输出1 4,数组解构赋值的匹配模式,可以选择性的接收某些变量。

{
   function f(){
       return [1,2,3,4,5]
   }
   let a,b,c;
   [a,...b]=f();
   console.log(a,b)
}

以上结果输出 1 [2,3,4,5],用拓展运算符,赋值成一个数组。

{
   function f(){
       return [1,2,3,4,5]
   }
   let a,b,c;
   [a,,...b]=f();
   console.log(a,b)
}

以上结果输出 1 [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

对象解构赋值的示例

{
   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);
 console.log(regex.test('xyz123',regex2.test('xyz123')
 
 let regex3 = new RegExp(/xyz/ig,'i');
 console.log(regex3.flags);
}

以上输出 true true i

ES6中,用regex3进行修饰,第二个参数将覆盖/xyz/ig的ig。

字符串拓展

{
//在ES5中
 let regex = new RegExp('xyz','i');
 let regex2 = new RegExp(/xyz/i);
 console.log(regex.test('xyz123',regex2.test('xyz123')
 
 let regex3 = new RegExp(/xyz/ig,'i');
 console.log(regex3.flags);
}