博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
变量的结构赋值
阅读量:7250 次
发布时间:2019-06-29

本文共 2190 字,大约阅读时间需要 7 分钟。

参考:阮一峰es6 http://es6.ruanyifeng.com/#docs/destructuring

时间:2018-07-04

es6按照一定的模式,从数组和对象中提取值,对变量进行赋值。

1.数组的解构赋值:按照顺序

let a=1;let b=2;let c=3;//和let [a,b,c]=[1,2,3]//等价//只要左右两侧模式匹配,就会赋值let[,,a]=[1,2,3];//a:3let [a,...b]=[1,2,3,4]//b:[2,3,4]let [a,b,...c]=[1];//a:1;b:undefined;c:[]let [foo]=[]//foo:undefined;let [bar,foo]=[1]//foo:undefined;let [bar]=[1,2,3]//bar :1

如果等号右边不具备iterator接口(可遍历?以后会总结),则报错

let [a,b]=1;let [a]=1;let a={};.......

对于set结构(不知道?下一章写)

let [x,y,z]=new Set([1,2,3])

默认值

let [foo=1]=[]//foo:1let [a,b=2]=[3]//a:3;b:2;let [a=1]=[null]//a:nulllet [a=1]=[undefined]//a=1//undefined和null表示:我们不一样;仅当undefined时默认值起作用;//默认值是惰性求值,使用到才会计算
//默认值可以引用解构赋值的其他变量,但该变量在此之前必须已经声明let [x=1,y=x]=[];//1,1let [x=y,y=1]=[];//引用错误

对象的解构赋值:按照属性

let {a,b}={a:1,b:2}//a:1;b:2let {aa}={a:1,b:2}//aa:undefined//如果下标不一样let {a:aa} = {a:1,b:2}//aa:1//先赋值给同名属性,在赋值给对应的变量let {a,b}等价于let {a:a,b:b}
let obj = {    p:['hello',{y:'word'}]};1)let {p} = obj ;//对p进行赋值2)  let {p:[a,{y}]} = obj ;//对a和y赋值,p作为模式3)let {p,p:[a,{y}]} = obj ;//对p和a,y赋值//题外话let {a,a}={a:1}//这里会报错,因为let声明的变量会锁死当前区域,不允许重复声明。//为什么第三个不是重复声明变量?//第三个可以解析为let {p:p,p:[a,{y}]}={p:['hello',{y:'word'}]};//在这里是声明了两个不同的变量;//而4则解析为://let {a:a,a:a}//声明了两个相同的变量,let锁死区,所以会报错

默认值:

let {x=3}={};//x:3;let {x:y=5}={x:4};//y:4//默认值生效的条件是对象的属性值为undefined;let {x=2}={x:null}//x:null//结构失败对应的值也为undefined,再取下一层则报错

对于一个已经已声明的变量用于解构赋值

let x;{x}={x:1};//错误的写法({x} = {x:1});//正确的写法

对数组进行对象属性的解构

let arr = [1,2,3];let {
0:first}=arr;//first:1

字符串解构赋值

const [a,b,c,d] = 'hello';//h e l llet {length : len}='hello'//5

数值布尔值解构赋值:

只要等号右边的值不是数组或者对象,就会将其转为对象,由于undefined和null无法转为对象,所以对其解构赋值会报错、

let {prop:x} = undefined;//TypeErrorlet {prop:y}=null;//TypeError

函数参数解构赋值

function add([x,y]){    console.log(x+y)  }add([1,2])[[1,2],[3,4]].map(([a,b])=>{a+b});//[3,7]

函数参数解构使用默认值

function move({x=0,y=0}={}){ return [x,y];}move({x:3,y:8})//[3,8]move({x:3})//[3,0]move({})//[0,0]move();//[0,0]//对比一下以下写法function move({x,y}={x:0,y:0}){    return [x,y]}//3,8//[3,undefined]//[undefined,undefined]//[0,0]/////undefined会触发函数参数默认值[1,undefined,3].map((x='yes')=>x)//[1,'yes',3]

圆括号问题

不要在圆括号内使用解构赋值

赋值语句的非模式部分,可以使用圆括号。

 

转载于:https://www.cnblogs.com/shui1993/p/9261592.html

你可能感兴趣的文章
独家揭秘腾讯千亿级参数分布式机器学习系统无量
查看>>
Dubbo Mesh在闲鱼生产环境的落地实践
查看>>
微软Build 2017第二天:跨平台跨硬件开发体验
查看>>
精益项目管理的可行性分析
查看>>
Bitbucket Pipelines在Atlassian的Bitbucket云上提供持续交付功能
查看>>
举重若轻的人人车移动端数据平台
查看>>
建立自组织敏捷团队
查看>>
PayPal API风格指南和设计模式
查看>>
02-Docker新手入门网络篇
查看>>
大神 Linus Torvalds 语录
查看>>
[LintCode/LeetCode] Find Median From / Data Stream Median
查看>>
Android开发套路收集整理与讨论
查看>>
代码规范的重要性,我已经放弃治疗
查看>>
笨办法学C 练习30:自动化测试
查看>>
mui初级入门教程(五)— 聊聊即时通讯(IM),基于环信 web im SDK
查看>>
[vs2008]Visual Studio 2008 SP1添加或删除功能提示查找SQLSysClrTypes.msi文件
查看>>
JS 设计模式二(封装)
查看>>
JavaScript “跑马灯”抽奖活动代码解析与优化(一)
查看>>
为什么我们选择 segmentfault 写作?
查看>>
多模型融合推荐算法在达观数据的运用
查看>>