解构数组
var [a,b]=[1,2];
a //1
b //2
-------------
var [a,b]=[1,2,3,4];
a //1
b //2
----------------
var [a,,b]=[1,2,3,4];
a //1
b //3
-----------------
var a,b;
[a=3,b=2]=[1]; //默认值
a //1
b //2
-----------------
var [a, ...b] = [1,2,3,4]
a //1
b // [2,3,4]
----------------
应用
function parseProtocol(url) { var parsedURL = /^(\w+)\:\/\/([^\/]+)\/(.*)$/.exec(url); if (!parsedURL) { return false; } console.log(parsedURL); // ["https://test/page", "https", "test", "page"] var [, protocol, fullhost, fullpath] = parsedURL; return protocol;}console.log(parseProtocol('https://test/page')); // "https"
解构对象
var o = {p: 42, q: true};var {p: foo, q: bar} = o;// 将o的p值赋给变量foo,将o的q值赋值给变量bar。var {p: foo, q: bar} = o;等价于({p: foo, q: bar} = o);let {t=4, m=true} = {t:5};//这样就定义了两个变量t和m，并各自带有默认值。let {t：val1=4, m: val2=true} = {t:5};
给函数的参数赋默认值:
function render({position ={x:0,y:0},color="red",display=true}){console.log(position,color,display);}render({position:{x:20,y:30}, color:"green"}); 解构数组内的对象:
const props = [ { id: 1, name: 'Fizz'}, { id: 2, name: 'Buzz'}, { id: 3, name: 'FizzBuzz'}];const [,, { name }] = props;console.log(name); // "FizzBuzz"
解构结构复杂的对象:
const metadata = { title: 'Scratchpad', translations: [ { locale: 'de', localization_tags: [], last_edit: '2014-04-14T08:43:37', url: '/de/docs/Tools/Scratchpad', title: 'JavaScript-Umgebung' } ], url: '/en-US/docs/Tools/Scratchpad'};let { title: englishTitle, // rename translations: [ { title: localeTitle, // rename }, ],} = metadata;console.log(englishTitle); // "Scratchpad"console.log(localeTitle); // "JavaScript-Umgebung"
refer: