欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

JS学习之 解构赋值

程序员文章站 2022-03-15 23:49:39
...

解构赋值

解构赋值包含数组解构、对象解构、函数解构赋值

    

  1. <!DOCTYPE html>
    2. 

  2. <html lang="en">
    3. 

  3.   <head>
    4. 

  4.     <meta charset="UTF-8" />
    5. 

  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    6. 

  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    7. 

  7.     <title>数组解构</title>
    8. 

  8.   </head>
    9. 

  9.   <body></body>
    10. 

  10.   <script>
    11. 

  11.     // 数组解构
    12. 

  12.     let [name, age] = ["张峰", "33岁"];
    13. 

  13.     console.log(name, age);
    14. 

  14.     //迭代更新
    15. 

  15.     [name, age] = ["老王", "44岁"];
    16. 

  16.     console.log(name, age);
    17. 

  17.     //参数不足添加默认值,参数过多,归并参数,用...
    18. 

  18.     [a, b, c, d, e, ...f] = [1, 2, 4, 5, 6, 7, 8, 9];
    19. 

  19.     console.log(a, b, c, d, e, f);
    20. 

  20.     // 对象解构不用let时,等号左边禁止出现大括号,必须使用大括号时
    21. 

  21.     // 用括号包住转为表达式
    22. 

  22.     ({ name, age } = { name: "张峰", age: "33岁" });
    23. 

  23.     console.log(name, age);
    24. 

  24.     // 函数解构传参
    25. 

  25.     function getUser({ name, age }) {
    26. 

  26.       console.log(name, age);
    27. 

  27.     }
    28. 

  28.     getUser({ name: "老吴", age: "66岁" });
    29. 

  29.   </script>
    30. 

  30. </html>
    31.

下一篇写DOM

上一篇： # PHP学习之常用函数联系

下一篇： jQuery源码之回调函数的解析

推荐阅读