JavaScript解构赋值的用途
分类:实例代码
JavaScript解构赋值的用途属于前端实例代码,有关更多实例代码大家可以查看。
JavaScript解构赋值是ES2015新增,具体可以参阅以下五篇文章:
(1).JavaScript数组解构赋值一章节。
(2).JavaScript对象解构赋值一章节。
(3).JavaScript函数参数解构赋值一章节。
(4).JavaScript字符串解构赋值一章节。
(5).JavaScript解构赋值小括号的应用一章节。
下面分享几个常见的解构赋值的使用:
(1).交换变量的值:
let address = "青岛市南区"; let webName = "前端教程网"; [address, webName] = [webName, address]; console.log(address); console.log(webName);
上面代码可以将两个变量的值交换。
(2).函数一次返回多个值:
let func =()=> [1, 2, 3]; let [a, b, c] = func(); console.log(a); console.log(b); console.log(c);
函数返回一个数组,然后通过数组解构赋值分别给三个变量赋值。
箭头函数可以参阅箭头函数介绍一章节。
上面是数组的解构赋值,下面再来看一个对象解构赋值代码:
let funcObj =()=>{ return {age: 5,url:"www.pipipi.net"} } let {age, url} = funcObj(); console.log(age); console.log(url);
函数返回一个对象直接量,然后进行对象解构赋值操作。
(3).方便提取json格式数据值:
let jsonData = { id: 8, status: "ok", data: [55, 88] }; let { id, status, data} = jsonData; console.log(id) console.log(status) console.log(data)
很方便的从json结构对象中提取数据,其实这个就是对象解构赋值。
(4).给函数设定默认值:
这里不举例子了,具体参阅ES2015 函数新增特性一章节。
JavaScript解构赋值的用途,这样的场景在实际项目中还是用的比较多的,关于JavaScript解构赋值的用途就介绍到这了。