Javascript 中的解构赋值语法

时间:2021-05-02

首先在 ES6中引入的“解构赋值语法”允许把数组和对象中的值插入到不同的变量中。虽然看上去可能很难,但实际上很容易学习和使用。

数组解构

数组解构非常简单。你所要做的就是为数组中的每个值声明一个变量。你可以定义更少的变量,而不是数组中的索引(即,如果你只想解处理前几个值),请跳过某些索引或甚至使用 REST 模式将所有剩余的值放到新数组中。

  • constnums=[3,6,9,12,15];
  • const[
  • k,//k=3
  • l,//l=6
  • ,//Skipavalue(12)
  • ...n//n=[12,15]
  • ]=nums;
  • 对象解构

    对象解构与数组解构非常相似,主要区别是可以按名称引用对象中的每个key,从而创建一个有相同名称的变量。此外还可以将键解构为新的变量名,只解构所需的 key,然后用 rest 模式将剩余的 key 解构为新对象。

  • constobj={a:1,b:2,c:3,d:4};
  • const{
  • a,//a=1
  • c:d,//d=3
  • ...rest//rest={b:2,d:4}
  • }=obj;
  • 嵌套解构

    嵌套对象和数组可以通过相同的规则来进行解构。区别在于可以将嵌套 key 或值直接解构为变量,而不必将父对象存储在变量本身中。

  • constnested={a:{b:1,c:2},d:[1,2]};
  • const{
  • a:{
  • b:f,//f=1
  • ...g//g={c:2}
  • },
  • ...h//h={d:[1,2]}
  • }=nested;
  • 高级解构

    由于数组的行为与对象相似,所以可以通过使用索引作为对象解构分配中的 key,用解构分配语法从数组中获取特定值。用这种方法还可以得到数组的其他属性(例如数组的 length)。最后,如果解构后的值是 undefined,则还可以为解构过程中的变量定义默认值。

  • constarr=[5,'b',4,'d','e','f',2];
  • const{
  • 6:x,//x=2
  • 0:y,//y=5
  • 2:z,//z=4
  • length:count,//count=7
  • name='array',//name='array'(notpresentinarr)
  • ...restData//restData={'1':'b','3':'d','4':'e','5':'f'}
  • }=arr;
  • 原文地址:https://mp.weixin.qq.com/s?__biz=MzI3NzIzMDY0NA==&mid=2247500396&idx=2&sn=aaf489fe14b1c057c97c6100d4222c0d&chksm=eb6be737dc1c6e21022ba17fea0fe751cac2a2917c2b1d50ad6ac80d5a0a3d5086914bc7066b&mpshare=1&s

    声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

    相关文章