ES6 解构赋值-对象模型的解构(Object)
<html>
<head>
<title> ES6 解构赋值-对象模型的解构(Object)</title>
</head>
<body>
<script>
//1,基本
{
let { foo, too } = { foo: "这是foo", too: "这是too" };
console.log(foo);//输出这是foo
console.log(too);//输出这是too
}
console.log("----------------------基本:分割线-------------------------------")
{
let { baz: foo } = { baz: "基本" };
console.log(foo);
}
console.log("----------------------分割线-------------------------------")
//2,可嵌套
{
let obj={p:['hello',{y:'word'}]};
let{p:[x,{y:z}]}=obj;
console.log(x);//输出hello
console.log(z);//输出word
}
console.log("----------------------可忽略:分割线-------------------------------")
//3,可忽略
{
let obj={p:['hello',{y:'word'}]};
let{p:[x,{}]}=obj;
console.log(x);//输出hello
}
console.log("----------------------不完全解构:分割线-------------------------------")
//4,不完全解构
{
let obj={p:[{y:"hello"}]};
let {p: [{ y }, x ] } = obj;
console.log(y);//输出hello
console.log(x);//输出undefined
}
console.log("----------------------剩余的运算符:分割线-------------------------------")
//5,剩余的运算符
{
let {a,b,...rest} ={a:20,b:30,c:40,d:50};
console.log("a=" + a);//输出a=20
console.log("b=" + b);//输出b=30
console.log("rest=" + rest);//输出rest=[c:40,d:50]
}
console.log("----------------------解构默认值:分割线-------------------------------")
//7.解构默认值
{
let{a=5,b=10}={a:3};
console.log("a="+a);//输出a=3
console.log("b="+b);//输出b=10
let{a:aa=10,b:bb=5}={a:3};
console.log(aa);//3
console.log(bb);//5
}
</script>
</body>
</html>
教程来源于:https://www.runoob.com/w3cnote/es6-tutorial.html

浙公网安备 33010602011771号