×
大家都在搜

微信扫码登录

使用验证码登录

QQ登录

只需一步,快速开始

+发表新主题
分享
开启左侧

新观点Es6对象解构赋值例讲解

[复制链接]

新观点Es6对象解构赋值例讲解

岁月如歌 发表于 2024-6-19 11:14:02 浏览:  74 回复:  0 [显示全部楼层] 回帖奖励 |倒序浏览 |阅读模式


E6解构赋值详细例讲解,ES6对象的解构赋值,在赋值声明是非常捷方便的,以下用例来说明如何使用E6对象解构赋值。



1全局作用域
解释:变量是定义在上
=123;

();123

();:123


2函数级作用域


(){
=234;
();234
();没有属性,因为它是函数级作用域,有属性因为在函数不定义直接使用属于全局变量

=555;
();:555,因为在函数不定义直接使用属于全局变量

}

()


3变量提升
变量提升将变量的声明会提升至本作用域的比较高部

();
=123;
上面代码相当于
;
();
=123;


4和
和声明的变量不存在变量提升因为和声明变量后会将当前代码块转化为一个暂
时性的死区

暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有
等到声明变量的那一行代码出现,才可以获取和使用该变量

声明的变量首次可以不赋值声明的变量在相同作用于内不能重复定义,声明的常量必须
有默认值声明的是常量不能重新赋值但是如果值是引用数据类型数据内部的属性是可以修改



=1;
();1
=2报错法直接修改常量

={
:'张'
}

='李四';
();李四


5解构赋值
总结:
1解构赋值就是按照一定的模式将对象或者数组中的数据取出赋值给变量,数组解构按照索引等号两边相对应,对象解构按照解构,

2论是对象的解构赋值还是数组的解构赋值"等号"两边的数据类型都要保持一致,不然是前后数据结构也要保持一致,不然解构的可能与原数组解构嵌套不同


51数组类型''=''如果前后类型不同是
=[1,2,3,4];
,,,=类型不同
(,,);
()(4)[1,2,3,4]


52解构交换变量
=1;
=2;
(,);12
[,]=[,];
(,);21


53数组的解构赋值数组的解构赋值是按照前后数据的索引值一一对应的
=[1,2,3,4];
[,,,]=;
(,,);124,逗号也算一位


54前后数据结构也要保持一致,不然解构的可能与原数组解构嵌套不同
=[1,[2,3,[4]]];
[,[,,[]]]=;
(,,,);1234


55数组解构时的默认值
=[1,2,3,4,];
[,,,,=5]=;直接赋值默认值
(,,,,);12345
=[];个空数组,有时候直接用数组长度作为判断条件
=3;
();(3)[×3]


6对象的解构赋值对象的解构赋值是按照一一解构
={
:"张",
:16,
:110
}
{}=

();张


7解构数组,如果有两个值必须写在后面,参数
=[1,2,3];
[,]=;参数是解构所有剩余参数
()1
()[2,3]

错误写法

=[1,2,3]

[,]=直接报错


8解构对象参数前写谁就不解构谁
={
:'张',
:16,
:110
}

{,2}=;写

解构对象参数前写谁就不解构谁,因为参数是解构所有剩余参数,所以是{:'张',:16}

(2);{:'张',:16}


9解构函数的剩余参数
(,,){
();
(,,);1,2,[3,4]
}

(1,2,3,4)


10函数的形参可以写赋值形式,对象是键值对
({='',}){
();
};

({:'',:{}})


11J默认字符串前面有一个空字符串拼接
=""+"德玛西亚"

2="德玛西亚"

(===2);默认字符串前面有一个空字符串拼接

([1]);玛字符串可以用数组方式

();4


12扩展运算符
=[1,2,3];
2=[4,5,6];
([,2]);


完!






所以,我们应该了解Cork Admin带来的很多好处,吸收归纳总结,并加以利用。https://www.uihtm.com/vue/15728.htmlHTML源码网(www.uihtm.com)提供div+css3响应式模板包括:网页模板、企业模板、商城模板,以及h5网站,jQuery网页特效,wp主题等8000G源码免费模板下载。