什么是解构赋值?

什么是解构赋值?

es6允许按照一定的模式,从数组或对象中提取值,给变量进行赋值,称为解构赋值。
特点:

1、给变量赋值

2、值的来源是对象或数组

3、规则:按一定的模式

一般用在数据交互,ajax请求数据。

数组解构
//1.这种比较散
let a = 10;
let b = 12;
let c = 13;
console.log(a,b,c); //10,12,13

//2.定义到数组内
let arr = [1,2,3];
console.log(arr[0],arr[1],arr[2]) //1,2,3

//3.解构赋值
let [a,b,c] = [1,2,3];
console.log(a,b,c) //1,2,3

//4.解构赋值必须两边格式一致
let [a,b,c] = [1,[2,3]];
console.log(a,b,c) //1,[2,3],undefined
let [a,[b,c]] = [1,[2,3]];
console.log(a,b,c) //1,2,3

//5.交互数据
let a = 10;
let b = 20;
[a,b] = [b,a];
console.log(a,b); //20,10
json解构
var json = { ‘name’:‘lixd’, ‘age’:‘20’, ‘job’:‘teacher’ } ;
let {name,age,job} = json;
console.log(name,age,job); //lixd,20,teacher

//起别名:
let {name,age.job:b} = job;
console.log(name,age,job) //lixd,20,undefined
console.log(name,age,b) //lixd,20,teacher
//给默认值
let {name:n,age:a,job:b=‘teacher’} = {‘name’:‘lixd’,‘age’:‘20’}; console.log(n,a,b)//lixd,20,teacher
函数解构的应用       参数–返回值–功能–在何处调用

//1.函数返回数据,在外侧解构
function getPos(){
   //… return { x:10, y:20 }
}
let {x,y} = getPos(); //10,20

//2.函数传参
function sum({x,y=20}){
   console.log(x,y); //1,20
};
sum({x:1});
导入模块解构
import {a,b,c} from ‘./model’;

  • 0
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
解构赋值是一种从数组或对象中提取数据并赋值给变量的方式。它可以让我们更方便地提取和使用数组或对象中的数据,而不需要通过索引或属性名一个一个地访问和赋值。 在 JavaScript 中,解构赋值有两种常见的形式:数组解构赋值和对象解构赋值。数组解构赋值将数组中的元素按照顺序赋值给变量,而对象解构赋值则是通过对象的属性名来进行匹配和赋值。 对象解构赋值的语法如下: ``` const {prop1, prop2, ...rest} = object; ``` 其中,`object` 是要解构的对象,`prop1` 和 `prop2` 是要提取的属性名,`rest` 则是一个包含剩余属性的对象。如果要给属性设置默认值,可以使用如下语法: ``` const {prop1 = defaultValue1, prop2 = defaultValue2, ...rest} = object; ``` 我们可以通过对象解构赋值来提取对象中的某些属性,并将它们赋值给变量,例如: ``` const person = { name: "张三", age: 20, gender: "男" }; const { name, age, gender } = person; console.log(name, age, gender); // 输出:张三 20 男 ``` 上面的代码中,我们从 `person` 对象中提取了 `name`、`age` 和 `gender` 三个属性,并将它们分别赋值给了 `name`、`age` 和 `gender` 变量。 如果我们只需要提取对象中的某个属性,可以使用如下语法: ``` const person = { name: "张三", age: 20, gender: "男" }; const { name } = person; console.log(name); // 输出:张三 ``` 这样就可以只提取 `name` 属性并赋值给 `name` 变量了。 另外,我们还可以使用对象解构赋值来给属性设置默认值,例如: ``` const person = { name: "张三", age: 20 }; const { name, age, gender = "男" } = person; console.log(name, age, gender); // 输出:张三 20 男 ``` 这样,如果 `person` 对象中没有 `gender` 属性,就会使用默认值 `"男"`。 对象解构赋值在实际开发中非常常用,可以让我们更方便地处理对象中的数据。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值