什么是解构赋值?

时间: 2019-07-10阅读: 36标签: 变量

解构赋值给我们一种新的变量赋值方式,主要可以利用数组解构赋值和对象解构赋值。它的用途包括:交换变量值,提取函数返回值,函数参数定义,默认值设定等等,给我们编程带来便利。


解构赋值的用途

1.交换变量的值
var x = 1;
var y = 2;
[x,y] = [y,x];//成功交换x,y的值。

2.提取函数返回的多个值(实现快速的提取对应的值)
function demo(){
    return {"name":"张三","age":21}
}
var {name,age} = demo();
console.log(name);//结果:张三
console.log(age);//结果:21

3.定义函数参数(方便提取JSON对象中想要的参数)
function demo({a,b,c}){
    console.log("姓名:"+ a);
    console.log("身高:"+ b);
    console.log("体重:"+ c);
}
demo({a:"张三",b:"1.72m",c:"50kg",d:"8000"});

4.函数参数的默认值
function demo({name="张三"}){
    console.log("姓名:"+name);//结果:姓名:张三
}
demo({});
1.数组的解构赋值
var [a,b,c] = [1,2,3]; //把数组的值分别赋给下面的变量;
console.log(a);//a的值为1
console.log(b);//b的值为2
console.log(c);//c的值为3

1).结构赋值可以嵌套的
var [ a,b,[ c1,c2 ] ] = [ 1,2,[ 3.1,3.2 ] ];
console.log(c1);//结果:c1的值为3.1
console.log(c2);//结果:c2的值为3.2

2).不完全解构
var [a,b,c] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2

3).赋值不成功,变量的值为undefined
var [a,b,c] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为undefined

4).允许设定默认值
var [a,b,c=3] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为3

5).覆盖默认值3
var [a,b,c=3] =[1,2,4];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为4

注意:当新的值为undefined的时候,是不会覆盖默认值的。


2.对象的解构赋值 
 var { a,b,c } = {"a":1,"c":3,"b":2};
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为3

var { a } = {"b":2};
console.log(a);//结果:a的值为undefined

var { b:a,} = {"b":2};
console.log(a);//结果:a的值为2


1)对象解构赋值也可以嵌套
var {a:{b}} = {"a":{"b":1}};
console.log(b);//结果:b的值为1

2)可以指定默认值
var {a,b=2} = {"a":1};
console.log(b);//结果:b的值为默认值2

3.字符串的解构赋值
var [a,b,c,d,e,f] = "123456";
console.log(a);//1
console.log(b);//2
console.log(c);//3
console.log(d);//4
console.log(e);//5
console.log(f);//6


ES5中的私有变量

严格来讲,JavaScript中没有私有成员的概念;所有对象属性都是公有的。不过,倒是有一个私有变量的概念。任何在函数中定义的变量,都可以认为是私有变量,因为不能在函数的外部访问这些变量

vue定义全局变量

VUE.js 中涉及到JS全局变量:全局变量专用模块得引入、全局变量模块挂载到Vue.prototype、使用VUEX存储状态值、使用window存储变量

ES5中的静态私有变量

通过在私有作用域中定义私有变量或函数,同样也可以创建特权方法,基本模式如下:这个模式创建了一个私有作用域,并在其中封装了一个构造函数及相应的方法。在私有作用域中,首先定义了私有变量和私有函数

揭秘Js变量提升

变量提升是一个陈旧且令人困惑的术语。甚至在 ES6之前:变量提升的意思究竟是“提升至当前作用域顶部”还是“从嵌套的代码块中提升到最近的函数或脚本作用域中”?还是两者都有?

php中的$_REQUEST超全局变量

PHP $_REQUEST是用于收集HTML表单提交的数据,PHP $_REQUEST属于PHP的超级全局变量。以下实例显示了一个输入字段(input)及提交按钮(submit)的表单(form)

JS中this作用域的问题:常见报错:XXX function 或者变量 未定义

定义了全局的函数,但是使用的时候,报错XXX 函数或者变量未定义,但实际上js中明明已经定义了且正确;大多数是因为调用过程中this.functionname 或者this.varname中this指向的作用域问题

JS关于全局变量的问题

全局变量就是在任何函数外面声明的或是未声明直接简单使用的,全局对象有个附加属性叫做window,此window(通常)指向该全局对象本身,使用过多的全局变量会造成代码可读性降低,全局变量所占内存较大

CSS:var变量的局部作用域(继承)特性

CSS变量非全局:最近做项目,发现CSS变量一个有意思的特性,那就是变量作用域非全局。举个例子,如下HTML和CSS:CSS也越来越具有动态特性了

Node常用的全局变量与 Inspect 调试

在 Node 中常用的全局方法有 CommonJS、Buffer、process、console、timer 等,这些方法不需要 require引入 API 就可以直接使用。如果希望有属性或方法可以“全局使用”,那就将它挂载在 Node 的global对象上:

JavaScript 的共享传递和按值传递

我们可以说原始数据类型和引用数据类型的副本作为参数传递给函数。不同之处在于,在原始数据类型,它们只被它们的实际值引用。JS不允许我们获取他们的内存地址,不像在C与C++程序设计学习与实验系统

fly63.com版权所有,内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权,请与小编联系!情况属实本人将予以删除!

广告赞助文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全