Blogger Information
Blog 37
fans 0
comment 0
visits 14264
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
class创建一个类,数组与对象解构方法
秋闲独醉
Original
353 people have browsed it
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7. <title>Document</title>
  8. </head>
  9. <body>
  10. <script>
  11. //1. 用class创建一个类, 并实现自有,共享,静态成员的声明与输出
  12. class Class1 {
  13. //公共成员
  14. age = 1;
  15. constructor(name, email) {
  16. //自有成员
  17. this.name = name;
  18. this.email = email;
  19. }
  20. //共享成员
  21. getInfo() {
  22. return `${this.name},${this.email}`;
  23. }
  24. //静态成员
  25. static status = "enabled";
  26. }
  27. const obj1 = new Class1("ddkk", "eek@ww");
  28. console.log(obj1);
  29. console.log(obj1.getInfo());
  30. console.log(Class1.status);
  31. //类的继承
  32. class Class2 extends Class1 {
  33. constructor(name, email, age) {
  34. super(name, email);
  35. this.age = age;
  36. }
  37. getInfo() {
  38. return `${super.getInfo()},${this.age}`;
  39. }
  40. }
  41. const obj2 = new Class2("ieiei", "ek@33", 33);
  42. console.log(obj2);
  43. console.log(obj2.getInfo());
  44. </script>
  45. <script>
  46. //2. 实例演示数组与对象解构方法
  47. //声名定义
  48. let [name, age, address] = ["jks", 12, "kdjdo"];
  49. console.log(name, age, address);
  50. //更新
  51. [name, age, address] = ["jdnjd", 19, "122"];
  52. console.log(name, age, address);
  53. //参数不足,默认值
  54. [name, age, address = "中国"] = ["dkdk", 13];
  55. console.log(name, age, address);
  56. //参数过多,...rest
  57. [name, ...rest] = ["dd", "33", "333"];
  58. console.log(name, rest);
  59. //多用于多数据互换
  60. let x = 1;
  61. let y = 2;
  62. let z = 3;
  63. [z, y, x] = [x, y, z];
  64. console.log(x, y, z);
  65. //对象解构,可用于json数据处理
  66. //目标是把对象中的属性值保存到对应的,与属性同名的变量中
  67. let { id, name: productName, num } = { id: 1, name: "dkdk", num: 33 };
  68. console.log(id, productName, num);
  69. //更新,用一对大括号,把整个表达式封装起来
  70. ({ id, name: productName, num } = { id: 2, name: "dkdk", num: 33 });
  71. console.log(id, productName, num);
  72. //如果左边模板中的变量存在命名冲突怎么办?起一个别名name:productName
  73. let { id: itemId, ...arr } = { id: 1, name: "dkdk", num: 33 };
  74. console.log(`${itemId}`);
  75. console.log(arr);
  76. </script>
  77. </body>
  78. </html>
Correcting teacher:PHPzPHPz

Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post