说起es6大家都很熟悉,有些es6新特性chrome等高级浏览器已经实现,不用我们去编译了。今天我简单说下es6的一些特性,算是简单回顾,梳理下自己的知识体系。

1、声明变量有变化,不再傻傻分不清

声明变量有两种方法,let和const。 let用来声明变量,const用来声明常量。

什么是变量?变化的量。比如你的名字,公司地址。

什么是常量?永远不会变的东西。比如你的生日。

平时我们声明var的变量可以重复声明,但let声明的变量不能重复声明,但是它们都可以重复赋值。

const声明的常量即不能重复赋值也不能重复声明。

2、作用域定义有变化,让你随手画个圈

之前js的作用域是用function来定义的,一个function内是一个作用域。现在是通过{}来定义的,
一个花括号内是一个作用域。

//var声明的i
var arr=[];
for (var i=0; i<10; i++){
    arr[i]=function(){
        console.log(i);
    }
}
arr[6]();//var声明的i指向i的地址,所以是10

//var声明的i如果要得到6,需要用一个立即执行和闭包。把i给num,

//然后在function里面console.log(num)即可,每一个num都是一个新变量。
    var arr=[];
    for (var i=0; i<10; i++){
        arr[i]=(function(num){
             return function () {
            console.log(num);
        }
        })(i);
    }
arr[6]();

//let声明的i
var arr=[];
for (let i=0; i<10; i++){
//let声明的i在这个花括号内是一直存在的,到下次循环的时候i=i+1
    arr[i]=function(){
        console.log(i);
    }
}
arr[6]();//6

3、解构赋值二合一,省时省力好简洁

用人话来说就是左边和右边结构一样。

第一可以省一部分赋值代码,让代码看起来简洁。

let [a,b]=[1,2];
console.log(a); //1
console.log(b); //2

第二json简洁,提取方便。如果key和value是同样的命名,可以缩写。

let jsonData = {
  id: 42,
  status: "OK",
  data: [867, 5309]
};

let { id, status, data: number } = jsonData;

4、有了字符串模板,远离+++拼接

let str="真好啊";
console.log("今天天气"+str+",心情也好!");
//现在可以写成
console.log(`今天天气${str},心情也好! `);

5、函数增加新特性,箭头函数省省省,rest参数略略略

函数里面加了一个箭头函数和rest参数

箭头函数可以极大的缩写我们的函数

如果参数只有一个,可以省略function();
如果有return 返回,可以省略{return };

//一个参数和返回

//以前
let show=function(r){
    return r;
}

//现在
let show=r=>r;

//两个参数和返回
let show=(a,b)=>{return a+b};

rest参数(...rest)顾名思义就是拿剩下的参数呗

function show(a,b,...arg){
    console.log(arg);
}
show(1,2,3,4,5);//[3,4,5]

rest参数还可以帮我们展开数组

let arr=[1,2,3];
console.log(...arr);

明天我们说数组,对象的继承,和promise

扫码关注“魏三公子”


魏三公子
15 声望2 粉丝