JavaScript解构赋值的用途

2018-3-8 10:55| 作者: admin| 查看: 551| 评论: 0|来自: 蚂蚁部落

JavaScript解构赋值是ES2015新增,具体可以参阅以下五篇文章:

(1).JavaScript数组解构赋值一章节。

(2).JavaScript对象解构赋值一章节。

(3).JavaScript函数参数解构赋值一章节。

(4).JavaScript字符串解构赋值一章节。

(5).JavaScript解构赋值小括号的应用一章节。

下面分享几个常见的解构赋值的使用:

(1).交换变量的值:

[JavaScript] 纯文本查看 复制代码运行代码
let address = "青岛市南区";
let webName = "蚂蚁部落";
[address, webName] = [webName, address];
console.log(address);
console.log(webName);

上面代码可以将两个变量的值交换。

(2).函数一次返回多个值:

[JavaScript] 纯文本查看 复制代码运行代码
let func =()=> [1, 2, 3];
let [a, b, c] = func();
console.log(a);
console.log(b);
console.log(c);

函数返回一个数组,然后通过数组解构赋值分别给三个变量赋值。

箭头函数可以参阅箭头函数介绍一章节。

上面是数组的解构赋值,下面再来看一个对象解构赋值代码:

[JavaScript] 纯文本查看 复制代码运行代码
let funcObj =()=>{ 
  return {age: 5,url:"www.softwhy.com"}
}
let {age, url} = funcObj();
console.log(age);
console.log(url);

函数返回一个对象直接量,然后进行对象解构赋值操作。

(3).方便提取json格式数据值:

[JavaScript] 纯文本查看 复制代码运行代码
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 函数新增特性一章节。


鲜花

握手

雷人

路过

鸡蛋

最新评论

返回顶部