解构赋值

  1. 数组的解构
let [a,b,c] = [1,2,3]
console.log(a, b, c) 

let [a, [b], c] = [2, [3], 4]
a //2
b //3
c //4

let [a] = 1 //报错
  1. 默认值
let [a, b = 2] = [3]
a // 3
b // 2

let [a, b = 2] = [3, 4]
a //3
b //4

数组对应对值有没有?如果没有(数组对没有指undefined)就使用默认值,如果有就使用对应值

let [a=2, b=3] = [undefined, null]
a //2
b //null
let [a=1, b=a] = [2]
a //2
b //2
  1. 对象的解构赋值

前置知识

let [name, age] = [‘hunger’, 3]
let p1 = {name, age}
//等同于
let p2 = {name: name, age: age}

解构范例

let {name, age} = {name: ‘jirengu’, age: 4}
name //‘jirengu’
age //4
以上代码等同于

let name
let age
({name: name, age: age} = {name: ‘jirengu’, age: 4})

  1. 默认值
let {x, y=5} = {x: 1}
x //1
y //5
  1. 函数解构
function add([x=1, y=2]){
  return x+y
}
add() //3
add([2]) //4
add([3,4]) //7

function sum({x, y}={x:0, y:0}, {a=1, b=1}){
    return [x+a, y+b]
}
sum({x:1, y:2}, {a:2}) //[3, 3]
  1. 作用
let [x, y] = [1, 2]
[x, y] = [y, x]
x //2
y // 1
function ajax({url, type=‘GET’}){
}
ajax({url: ‘http://localhost:3000/getData’})
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 前面的话 我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段。在ES6中添加了可以简化这种任务的新特性...
    sunnyghx阅读 826评论 0 0
  • 前面的话   我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段。在ES6中添加了可以简化这种任务的新...
    CodeMT阅读 540评论 0 0
  • 引入 在ES5中,开发者们为了从对象和数组中获取特定数据并赋值给变量,编写了许多看起来同质化的代码 这段代码从op...
    nengzhuan_zhang阅读 646评论 0 0
  • 作者:米书林参考文章:《菜鸟教程》、《 ECMAScript 6 入门》(阮一峰) 解构的定义 ES6 允许按照一...
    林之小记阅读 529评论 0 1
  • 用一个经常遇到的问题来说明这一赋值的好处之一,对两个变量的值进行替换,通常我们得另外声明一个变量来作为两个变量交换...
    托尼陈阅读 645评论 0 0

友情链接更多精彩内容