9.18 ES6学习之路

常量  const  

变量  let

let不能重新声明 例如 let a=1； let a=2；错误    但是可以重新赋值 let a=1；a=2；

es6中不存在变量提升

暂时性死区  使用let会形成块级作用域

 for(let i =0;i<3;i++)
        {
            setTimeout(function(){
                console.log(i)
            },60)
        }
这样会打印 0 1 2
如果换成var 会打印3
如果非得用var 就要用闭包 
for(var i =0;i<3;i++)
        {
          (function(i){
              setTimeout(function(){
                  console.log(i)
              },60)
          })(i)
        }

形参也是变量 不能重新声明

 

const 1 。 不能只声明不定义   2. 定义后不能修改    （如 const PI=3.14；  PI=3.1415  错误）

        3. 和let用法一样   4 。 可以启动块级作用域  5  不存在变量提升  6  不可以重复声明

7 引用数据类型 只要地址不变 该怎么玩怎么玩 （const arr=【1,2,3】；arr【1】=5  这不会报错  因为赋给arr的是一个地址）

 

 

解构：从一个对象中把所有的属性和方法解构出来单独使用

var obj = {name：‘pq’,sex:'male'};
var {name,sex} = obj;
console.log(name);

 如果原来的对象中没有解构的属性（解构不成功）  返回undefined

可以指定默认值

var obj={};
var {name = 'pq'} =obj;
console.log(name);结果是pq 这就是默认值

不完全解构

let obj={
name:'pq',
sex:'male',
age:20
};
let {name,...params} = obj;
console.log(name,params);//这个...params把剩下的放在params里 也是能打印出来

 

数组解构

1 数组解构标准   let arr =[1,2,3]; let [a,b,c] = arr; console.log(a);//数组解构强调对应，解构用中括号

2 不完全解构    let arr=[1,[4,5],2,3] ; let [e,[f],g]=arr; console.log(f);//打印的是4，也是强调对应，解构中的【f】要用【】对应【4,5】的第一位；

3解构时表达的懒惰性

4变量必须提前声明定义 

let arr=[3,2];
let [a=b,b=1]=arr;
console.log(a);//打印3  如果前面没有第一行的话报错，因为a=b时候b还不知道是啥

 

 

对象解构

1类似于数组解构 但是解构的名字和对象属性名字一致  

2解构现有内置对象

 let { random } = Math;
        console.log(random())

3 变量名和属性不一致  按照下面打冒号起别名 原来的名字作废了

let obj ={name:"hello"};
let { name:username }  = obj;
console.log(name);//这个报错 name没了作废了
console.log(username);//用新名字才对嘛

4 设置默认值

 

函数参数解构

function fn([x,y]){
console.log(x,y);
}
fn([1,2]) 

function fn([x=0,y=0]){
console.log(x,y);
}
fn([1,2]) //1,2
fn([1])//1,0
fn([])//0,0
fn()//报错

function fn({x=0,y=0})
{
console.log(x,y)
}
fn({1,2})//1,2
fn({x:1,y:3})//1,3
fn({})//0,0
fn()//报错

函数的扩展

es6设置默认参数

function fn（num=0）

{

console.log(num)

}

fn(1)

使用默认值之后不能重新声明定义相同的函数 

function fn(num=1){}
function fn(num){}//错误

不能重新声明形参  

function fn（num）

{

let num=1//错误

}

函数参数默认值的懒惰性

function fn(){return 1};
function fn2(x=fn())
{
console.log(fn2)
}
fn2(10)//dayin10

 

 

 

 es6中数组合并

 扩展运算符直接就是数组 很好使 ...

总结扩展运算符 ：扩展运算符...     主要应用于函数   如果是一个空数组相当于没有   let arr1=【】;let arr2 = [...arr1,5]  //打印arr2就是【5】

还有克隆数组用这种会把原来的模板也改变

 let arr=[1,2];
        let arr2=arr;
            arr2[0]=4;
        console.log(arr)//[4,2] 

用扩展运算符就不会

let arr=[1,2];
        let arr2=[...arr];
            arr2[0]=4;
        console.log(arr)//[1,2] 

合并数组

arguments(所有的类数组)转化为数组   【...arguments】

 

数组的扩展

 Array.of    解决了通过构造函数生成数组时一个参数是数字的痛点

本来 打印 new Array（3）   结果是【empty*3】

现在  打印Array.of(3)结果是【3】

fill 填充  

arr=[,,,]
arr.length是3
arr.fill(3)//打印这条结果是[3,3,3]

keys

上面打印是索引值   要打印值应该遍历arr2.values()   要想两者都打印则是   arr2.entries()    

 

 对象的扩展

1 简写方法    【如果对象的属性和值一样，只需要写一个】【属性对应一个函数  直接写 如getName（）{}  而不用写getName：function fn（）{return  xx}】

2 对象中key只能做字符串 不能做变量  

如果要当变量   加上中括号  var obj2={[key]:123};   

也可以变量拼接

 Object.keys()

如

 也有Object.values()   Object.entries()  

 

Object.is()

相当于=== 号  返回true或false   注意    Object.is(NaN,NaN)是true

Object.assign()  对象合并  

 上面的方法看着不太好  用下面的

 箭头函数