粗看ES6之解构赋值

标签: javascript es6


什么是解构赋值?

示例如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>解构赋值</title>
</head>
<body>
  <script>
    let [a,b] = [1,2];
    let {c,d} = {c:11,d:22};
    console.log(a,b,c,d);
  </script>
</body>
</html>

测试地址

注意事项

  • 左右二边结构要相同,指[]=[]/{}={}
  • 声明和赋值必须在一句话里完成
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>解构赋值规则</title>
</head>
<body>
  <script>
    
    //左右二边结构必须相同
    //let [a,b] = {a:1,b:2}; //不成功
    //let {a,b} = [1,2]; //不成功
    //console.log(a,b)
    //声明和赋值必须在同一个语句里完成
    /*
    let [a,b];
    [a,b] = [1,2];//不成功
    console.log(a,b)
    */
    
    let [a,b] = [1,2];//成功
    let [{c,d},[e,f],g,h,i]=[{c:11,d:22},[111,222],333,[1,2],{a:1}]//成功
    console.log(a,b,c,d,e,f,g,h,i);
  </script>
</body>
</html>

测试地址

原文地址:https://www.cnblogs.com/xwwin/p/7865130.html