变量的解构赋值

  变量的解构赋值(模式匹配)数组

  ...  拓展运算符  能够将数据类型变为数组app

  解构赋值:数组的解构赋值  对象的解构赋值函数

  1. 先后模式必须匹配this

    后面的值是什么格式,前面变量声明的也是什么格式,好比后面的值是二维数组,前面声明的也是二维模式prototype

    案例:对象

      let [a,[b,c]]=[1,[2,3]]; // a   b   c   是变量作用域

      console.log(b);   //2字符串

  2. 前多后少原型

    前面声明的变量多,后面赋值的少,解构不成功,就至关于只声明了变量,但没赋值,解构不成功,值都是 undefined回调函数

    案例:

      let [a,b]=[1];   // a    b   是变量

      console.log(b)  // undefined

  3. 前少后多

    1. 省略赋值  let[,,c]=[45,12,33]     //  c 是变量

    2. 不定参数的解构赋值,使用 ... 叫拓展运算符 ,注意事项 :拓展运算符必须写后面

      拓展运算符:...as 将后面的值以数组的形式,赋值给 as ,拓展运算符必须写在最后

    案例:

      1. let [,,c]=[45,26,13] // c 是变量

          console.log(c)  // 13

      2. let [...a]=[45,26,13];    // a 是变量

          console.log(a)  // 数组的形式 [45,26,13]

  4. 带有默认值问题

    问题:先给默认值,在解构赋值,仍是先解构赋值,若是没有在考虑默认值?

    案例分析

      let [x,y=(function(){console.log("haha");return 10;})()]=[45,23];

      console.log(y)  //23

      最终没有输出 haha ,说明不是先给默认值,二十先解构赋值,若是没有,在考虑默认值

  因此:解构不成功的时候,才会有默认值,没有赋值,没有定义

  判断一个变量有没有定义:

    var a=null;  a=[];  a={};  a=""   都是定义了

    var a=undefined   未定义

    因此只有解构的时候,后面是 undefined 的时候,才会走默认值,不然后面给什么值就是赋值什么;

  解构不成功:undefined

  对象的解构赋值;

    1. 变量和属性必须同名,才能够解构赋值

    2. 若是解构失败,值是 undefined

      let {name,a}={name:"zhang",age:20};  // name a 是变量

      console.log(name,a) // zhang   undefined

      其中 name a 是变量  对象的 name age 是属性,name变量 找到了对象的属性 name 因此,获得值为 zhang; 

      a 变量,找不到对象的属性,因此得不到值,为 undefined;  

      由于解构赋值,因此咱们有了这样一个新的写法

      let {ceil}=Math;  

      console.log(ceil(1.2))  // 2    解析这个代码  let {ceil} = {ceil:function(){}}   //这里面放的 math 对象的方法, ceil 的方法等于 ceil 的变量,因此 ceil 的变量 也拥有了相同的方法

    3. 特殊状况,变量名和属性名不一致怎么办?

      let {foo:b}={foo:"zhang"}  //  = 左边: foo 是属性 b 是变量  = 右边:foo 是属性

        前面 foo 是属性,后面 b 变量,解构的机制,是对应的属性值 赋值给后面的变量

    4. 对象解构的默认值问题

      默认值跟数组解构的默认值是同样的,解构成功就直接赋值,不走默认值,解构不成功,就是没有值,或者值是 undefined 走默认值;

      let {name,age=45}={name:zhang}  console.log(age) // 45 

      let {name,age=45}={name:"zhang",age:undefined}   console.log(age)   //45      

    5. 对象解构的赋值注意点

      {} 前面不能没东西    {a}={a:12}  x  这种写法是错的

      解决:咱们必须声明 一个变量才能够:let {a}={a:12}

    6. = 右边在什么状况下,才能够解构

      = 右边的值,只要带有 length 属性,才能够解构,若是非要把不能解构的东西解构,转成字符串便可

  函数参数解构

    函数传对象,要在形参附一个空对象

  带 = 

  function fn([a,b]=[12,23]){

    console.log(a+b)

  }  

  函数参数默认值

  function fn(b,v=12){

    console.log(b)

  }

  fn(12)  前面是形参,后面是默认值,带默认值的参数尽可能要写后面

 

  两句法则:

    有没有办法解构

    解构成不成功

  函数参数等号左边是形参,右边是默认值,函数调用不传参,走函数形参的默认值;函数调用传参,默认值就不走了,走实参

 

  备注:

    函数做用域

    函数在调用会造成私有做用域,在这个做用域下,声明的变量和参数变量都是私有的变量,外界访问不到同时,他在操做相同的变量是,不会操做外部的

  

  形参的没有变量提高,若是传值直接赋值,因此形参有暂时性死区这一说

  暂时性死区,没有赋值,直接操做变量

 

  函数一个类数组参数 arguments 是实参构成的集合,是一个类数组

  ... 拓展运算符,可将实参变成一个数组;

 

  5. 箭头函数

    1. 箭头函数 是适用于匿名函数

    用 function 声明的函数,是有名函数

    作回调函数的时候,也是一个匿名函数

    var fn=function(){}    匿名函数    作了回调函数

  匿名函数的定义:只要不是关键字 function 声明的函数叫匿名函数

  var fn=(形参) => { 函数体 }

  每一个函数结束的时候必定要 return

  let fn=x=>x   这种语法 : 第一个 x  表明 形参  第二个 x 表明 return 的语句

  当只有一个参数,能够省略小括号;

  当函数体只有一行代码且 return xxx 的时候,能够省略 {} 和 return

  箭头函数的优点:

    1. 箭头函数没有 this 指向

      改变 this 指向的方法

        1. 在函数前 提早对 this 赋值

        2. 在函数结尾处 {}.bind(this)

        3. 在函数结尾处 {}.apply(this) 或 {}.call(this)

        4. 使用箭头函数

    2. 箭头函数获取实参,不能使用arguments 用 ...arg

    3. 箭头函数不能充当类,由于 this 指向 window,而 类 的 this 指向当前实例对象

     箭头函数的 this 指向 window

    函数角色

      函数能够扮演 类,普通函数,function 实例对象

      类:每一个类身上有一个 prototype 的属性,这个属性是一个对象,里面有个 constructor 的属性,属性值是类自己

      new 实例的时候,其实就是调用这个 constructor 的函数

      对象,每一个对象天生有个 __proto__ 的属性

    __proto__ 也是一个对象,里面有个构造函数指向他的类这个对象,也有一个 constructor 这个属性值是他的类

  对象的属性

    首先看对象中私有的属性中,有没有这个属性,有就直接使用,没有就使用 __proto__  向他的父类的原型上查找;

  注意:

    1. object 是因此对象的基类,包括 window event 等

    2. 普通函数的父类是 Function 

    3. 经过 function 定义的类 是 Function 

    4. 因此实例对象的 __proto__ 都指向父类的原型;

  实例对象的原型 __proto__ 若是私有没有就找父类原型的 若是父类没有直接查找 Object 的原型 不找 Function

  anonymous  匿名的

相关文章
相关标签/搜索