ES6学习笔记

1.var弊端

1.对于一个变量，var是存在预解析(变量提升)，变量可以先去使用，再去声明

2. var关键词可以重复声明同一个变量

3.var 影响全局变量，造成全局变量污染

4.var 没有块级作用域 {}(ES6新增加的概念)

2.let变量

1.let 没有变量提升，必须先声明，在使用

2.let 不能重复声明同一个变量

3.let 不会造成全局变量污染

4. let 有块级作用域

3.const常量

1. const 必须赋值

2. 赋值之后，值不能更改

3. const 块级作用域

4. const 声明常量尽量都用大写字母

4.对象的解构赋值

       ES6 允许按照一定模式，从数组和对象，字符串中提取值，对变量进行赋值，这被称为解构。

      目的：简化代码。

1.完全解构：

        语法格式 var|let|const { 解构对象的属性 } = 被解构的对象

var obj = {       
    id:10,
    name:"狗蛋",
    age:20,
    sex:"男"
}
var { id,name,age,sex } = obj;
console.log(id,name,age,sex);//10 "狗蛋" 20 "男"

2.部分解构 只获取被解构对象的部分属性

var obj = {
    id:10,
    name:"狗蛋",
    age:20,
    sex:"男"
}
var { name,age } = obj;
console.log(name,age);// "狗蛋" 20 

3.解构之后重命名 使用 : 重命名

var obj = {
    id:10,
    name:"狗蛋",
    age:20,
    sex:"男"
}
var  {  sex:a }  =obj;
console.log(a);

4.解构现成对象的方法，赋给一个变量

var { max } = Math;
console.log( max(12,3) );

5.对象结构赋值的默认值

        使用=

var  obj = {
    id:1,
    name:"狗蛋",
}
// 进行解构
var  {id,name ,sex="男"} = obj;
console.log(id,name,sex);

5.数组的结构赋值/字符串解构赋值

        1.完全解构

                语法格式  var|let|const [自己设定的变量] = 被解构的数组

var arr = ["狗蛋","翠花","旺财"]
var [a,b,c] = arr;
console.log(a,b,c);

        2.部分解构

var arr = ["狗蛋","翠花","旺财"]
var  [a] = arr;
console.log(a);  //狗蛋
var  [,,a] = arr;
console.log(a);  // 旺财

        3.复合解构

var arr = ["狗蛋","翠花","旺财",["1","2","3"]]
var [a,b,c,[e,f,g]] = arr;
console.log(a,b,c,e,f,g);

6.函数参数的解构

        函数的参数可以使用数组解构，或者对象解构

1.数组解构

function  sum([a,b,c,d]){
    return a+b+c+d; 
}
var arr = [1,2,3,4];
console.log(sum(arr)); //获取当前数组元素的累加和

  2.对象解构

function  fn({x,y}){
    return  x+y;
}
var obj = {
    x:1,
    y:2
}
console.log( fn(obj) );  //获取  x+y的值

3.参数设置默认值

 function  sum(a=1,b=2){
    return a+b;
}
console.log(sum(3,4)); //  7
console.log(sum());  // 3

7.rest的基本使用

        rest获取所有的实参

function  sum(...rest){
    // console.log(rest); // 真数组
    var sum  =0;
    rest.forEach(item=>{
        sum += item
    })
    return  sum;
}
console.log( sum(1,2,3,4,5) );

8.拓展运算符

        ...拓展运算符

作用：将对象 数组 字符串铺开

1.对象铺开

var obj = {
    id:1,
    name:"狗蛋",
    age:30
}
console.log( ...obj ); // id:1  name:"狗蛋"  age:30

2.数组铺开

var  arr = ["狗蛋","催化","旺财"]
console.log(...arr); // "狗蛋","催化","旺财"

3.字符串铺开

var  str = "hello";
console.log( ...str );  //h e l l o