<!DOCTYPE html>
<html>
<head>
<title>数组解构 对象解构 函数参数自动解构</title>
</head>
<body>
<script type="text/javascript">
console.log('数组解构');
//一、数组解构 将数组中的值取出来并一一赋值给不同的变量
//可以跳过部分值,但是解构的变量需要使用,占位
var arr = [3,4,5,6,7];
var [a,b,c,,e] = arr;
console.log(a, b, c, e);
//二、对象解构 将对象中的属性值取出,并一一赋值给和属性名相同的变量
console.log('对象解构');
var obj = {
"age":30,
"sex":"男",
"say":function(){
return "hello";
}
};
// ES6
var {age,sex,say} = obj;
//等同于
// var age = obj.age;
// var sex = obj.sex;
// var say = obj.say;
console.log(age, sex, say);
console.log( say() );
//跳过某些值 直接不写解构变量
var {age,say} = obj;
console.log(age, say);
console.log( say() );
//变量名 必须和对象的成员名对应
// var {aa,sex} = obj;//这样是错误的
// console.log(aa, sex);
//三、函数参数自动解构
console.log('函数参数自动解构');
//预期效果:给函数传入一个数组,函数内部接收数组的每一个成员
//常规实现方法
function f2(x){
var [m,n,i] = x;
console.log(m,n,i);
}
var arr = [5,6,7];
f2(arr);
//自动进行解构实现方法。让函数的形参在接收参数时自动进行解构,
function f3([m,n,i]){
console.log(m,n,i);
}
var arr = [5,6,7];
f3(arr);
</script>
</body>
</html>
|