zoukankan      html  css  js  c++  java
  • 解构赋值

    数组的解构赋值

    • ES 6 中支持的数组解构赋值 var [a,b,c] = [4,5,6];let [foo,[xxx,yyy]]=[45,[12,46]];,只需要等号两边的模式相同,变量就会被赋予对应的值。
    • 若是解构不成功,变量的值就等于undefined
    • 不完全解构的情况,也可以进行赋值let [x,y] = [1,2,6]; 或者 let [x,y,z] = [4,[4,9,3],8,9];
    • 若等号的右边,不是可遍历的结构,使用解构赋值时候将会发生报错。
    • 只要某种数据具有Iterator接口都可以以数组的形式进行解构赋值。例如let [x,y,z] = new Set ([4,5,6]);,以及ES 6 中的generator函数,也可以作为解构表达式的赋值内容。

    解构赋值中的默认值

    • let [foo = true,ofo = false ,mobike = "fake"] = [456,undefined,null];只有当一个数组成员被赋予的值全等于undefined,默认值才会生效。(注:这里的null并不全等于undefined,所以mobike的值为null)。
    • 解构赋值中的默认值赋值表达式,只有在“有必要(即所赋值为undefined)”的时候才会执行。例如let [foo = fun()] = ["Crazy-Web-2"];这里的fun()方法将不被触发。
    • 使用默认值时,所赋值的内容,必须是已被声明的变量 例如let [x=y,y=1]=[];,给x赋默认值的时候,仍未被声明。

    对象的解构赋值

    • 变量名称的次序不要求与赋值名称的次序相同,只要键名相对应即可。
    • 对于var {foo: baz } = { foo:"aaa",bar :"bbb"};,被赋值的是变量baz而不是键名foo
    • 使用let关键字进行对象解构赋值的时候,同样需要注意不能重复声明。
    • 和数组的类似,对象的解构赋值,也可以进行复杂的嵌套结构
    • 若解构失败,变量的值被赋予undefined
    • 若使用解构的方式,将一个已经声明的某个变量赋值,例如:({x} = { x : x:1});,需要十分注意,要使用圆括号括起来。
    • 可以利用已知的JS内置对象的键名,去获取JS内置对象的方法,例如let { log, sin, cos } = Math;,能够,直接使用log()sin()cos()即可。

    字符串的解构赋值

    • 字符串一般可以当做一个类似数组一样的对象,可将数组中的元素内容按序赋值。
    • 也可以将字符串对象的属性用于赋值,例如,类数组对象都有一个length属性,字符串对象也不列外。

    其他基本对象的解构赋值

    结构的规则一般是,若等号右边不是数组或者JS对象,就将其转化为对象,然后将其当做一个完整的对象,进行对象属性的对照,再进行结构赋值。

    • Number对象、Boolean对象都会解构成一般的对象,拥有对象的基本属性。
    • undefined和null都无法转换为JS对象,所以对他们进行结构赋值的时候,都会报错。

    函数参数的解构赋值

    • 函数调用进行传参的时候,也是一个解构赋值的过程
    • 在给解构赋值设定默认值的时候,要与函数设定默认值的情况区分开来:
      例如
      function move({x = 0, y = 0} = {}) {
      return [x, y];
      }


      function move({x, y} = { x: 0, y: 0 }) {
      return [x, y];
      }


      区别就是在于,调用时传入的值为undefined时,解构默认值会被触发,而函数参数默认值不会。

    使用解构赋值的注意点

    • 在声明语句中,不能够使用圆括号
    • 函数设定参数的时候,也不能够使用圆括号
    • 赋值语句中,不能将整个模式,或嵌套模式中的一层,放在圆括号之中。
      // 报错
      ({ p: a }) = { p: 42 };
      ([a]) = [5];
      [({ p: a }), { x: c }] = [{}, {}];

    解构赋值的用途

    • 不借助中间值,实现两个变量值互换。
      let x = 1;
      let y = 2;
      [x, y] = [y, x];
    • 从函数中返回多个值,可以使用返回数组/对象的形式,例如return [1, 2, 3];return { foo: 1, bar: 2 };,return得到的函数值,可以直接赋值给解构相类似的对象。
    • 使用JS对象传参的时候,可以实现变量无序传参。 function f({x, y, z}) { ... }; f({z: 3, y: 2, x: 1});
    • JSON数据实现“键名”快速提取,因为JSON对象和JS对象的结构完全一致,可以使用键名直接提取,不需要像以前一样进行循环操作。
    • 可以实现模拟函数参数值
      let x = 1;
      jQuery.ajax = function (url, {
      async = true,
      beforeSend = function () {},
      cache = true,
      complete = function () {},
      crossDomain = false,
      global = true,
      // ... more config
      }) {
      // ... do stuff
      };
    • 遍历Map结构(有待补充)
  • 相关阅读:
    【BZOJ2006】[NOI2010] 超级钢琴(堆+RMQ)
    【洛谷1120】小木棍(一道有技巧的dfs)
    【BZOJ1857】传送带(分治经典:三分套三分)
    【BZOJ1045】糖果传递(基于贪心的数学题)
    【CF1000C】Covered Points Count(离散化+差分)
    【洛谷1486】[NOI2004] 郁闷的出纳员(Splay的小运用)
    【洛谷1156】垃圾陷阱(动态规划)
    严格次小生成树学习笔记
    高斯消元入门
    【洛谷4011】孤岛营救问题(状压SPFA)
  • 原文地址:https://www.cnblogs.com/HXW-from-DJTU/p/6645367.html
Copyright © 2011-2022 走看看