ES6的解构赋值 以及使用场景

本文介绍了JavaScript中数组和对象的解构赋值方法,并通过示例展示了如何使用解构赋值来简化变量交换及函数返回值的处理过程。同时讨论了解构赋值中的默认值设定。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

z'x数组的解构赋值 一下例子应该能够很清楚的展示  简介至上?

{
	let a,b,rest;
	[a,b]=[1,2];
	console.log(a,b);//输出1 2
}

{
	let a,b,rest;
	[a,b,...rest]=[1,2,3,4,5,6,7];
	console.log(a,b,rest);//输出 1 2 Array(5) [ 3, 4, 5, 6, 7 ]
}

对象的解构赋值  在第二段代码中给c设置了默认值为3 解决了变量创建后没有赋值的报错 同时也这里也引入了ES6中的另一个新特性 就是默认参数的特性

{
	let a,b;
	({a,b}={a:1,b:2})
	console.log(a,b);//输出 1 2
}
{
	let a,b,c,rest;
	[a,b,c=3]=[1,2];
	console.log(a,b,c);//输出 1 2 3
}

使用场景:

(1)变量交换 在以下代码中成功实现了变量交换 改变了以往通过创建一个中间变量的方式交换变量的做法

{
	let a=1;
	let b=2;
	[a,b]=[b,a];
	console.log(a,b);//输出2 1
}

(2)装载函数返回参数

{
	function f(){
		return [1,2];
	}
	let a,b;
	[a,b]=f();
	console.log(a,b);//输出 1 2
}
{
	function f(){
		return [1,2,3,4,5];
	}
	let a,b,c;
	[a,,,b]=f();
	console.log(a,b);//输出 1 4
}
{
	function f(){
		return [1,2,3,4,5];
	}
	let a,b,c;
	[a,...b]=f();
	console.log(a,b);//输出 1 Array(4) [ 2, 3, 4, 5 ]
}
{
	/* json对象 */
	let metaData={
		title:'abc',
		test:[{
			title:'test',
			desc:'description'
		}]
	}
	let {title:esTitle,test:[{title:csTitle}]}=metaData;
	console.log(esTitle,csTitle);//输出abc test
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值