8_解构赋值.html 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <script>
  10. // 数组的解构赋值
  11. // 按照数组的顺序进行赋值
  12. // let arr = [1,2,3,4,5];
  13. // let a = arr[0];
  14. // let b = arr[1];
  15. // let c = arr[2];
  16. // let [a,b,c,d,e] = arr;
  17. // console.log(a,b,c,d,e);
  18. // let [a,b] = arr;
  19. // console.log(a,b);
  20. // 对象的解构赋值
  21. // 按照对象的属性名进行赋值
  22. // let person = {
  23. // name:"张三",
  24. // age:18,
  25. // sex:"男"
  26. // }
  27. // let {age,name,sex} = person;
  28. // console.log(name,age,sex);
  29. // 可以给属性名起别名
  30. // let {name:userName,age,sex} = person;
  31. // console.log(userName,age,sex);
  32. // 字符串结构
  33. // 字符串也可以解构赋值
  34. // 类似于数组结构 按照顺序赋值
  35. // let str = "hello";
  36. // let [a,b,c,d,e] = str;
  37. // console.log(a,b,c,d,e);
  38. // 参数结构
  39. // let person = {
  40. // userName:"张三",
  41. // age:18,
  42. // sex:"男"
  43. // }
  44. // function fn(val){
  45. // // let thisName = val.userName;
  46. // // let thisAge = val.age;
  47. // // let thisSex = val.sex;
  48. // let {userName:thisName,age:thisAge,sex:thisSex} = val;
  49. // let str = `我叫${thisName},我今年${thisAge}岁,我是${thisSex}`;
  50. // console.log(str);
  51. // }
  52. // fn(person);
  53. function fn(){
  54. let obj = {
  55. a:1,
  56. b:"hello",
  57. c:[1,2,3]
  58. }
  59. // ........
  60. return obj;
  61. }
  62. // let val = fn();
  63. // console.log(val.a,val.b,val.c);
  64. let {a,c} = fn();
  65. console.log(a,c);
  66. let a1 = 1;
  67. let a2 = 2;
  68. </script>
  69. </body>
  70. </html>