• Es6

    一、Set中的迭代函数

    • keys()：获取键

    • values()：获取值

    • entries()：获取键值对

    • for....of....和forEach用来遍历

    代码：

    1. <!DOCTYPE html>
    2. <html lang="en">
    3.  
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    8.     <title>Document</title>
    9. </head>
    10.  
    11. <body>
    12.     <script>
    13.         let scor = [90, 50, 60, 80, 40, 20]
    14.         let s = new Set(scor)
    15.             // console.log(s.keys())
    16.         for (const k of s.keys()) {
    17.             console.log(k)
    18.         }
    19.         console.log("----------------------------------")
    20.         for (const v of s.values()) {
    21.             console.log(v)
    22.         }
    23.         console.log("----------------------------------")
    24.  
    25.         for (const e of s.entries()) {
    26.             console.log(e)
    27.         }
    28.         console.log("----------------------------------")
    29.         s.forEach((value, key) => {
    30.             console.log(key + ":" + value)
    31.         })
    32.     </script>
    33. </body>
    34.  
    35. </html>

    效果：

     二、Map

    创建： let tels = new Map()

    • 使用set(key,value)添加元素

    • 获取Map中的键值对中的值，使用get(key)，根据键获取值

    • clear():清空

    • 删除delete()

    • for....of.... 遍历

    以上代码

      1.   let tels = new Map()
      2.             // 使用set(key,value)添加元素
      3.         tels.set("王入力", "110250150")
      4.         tels.set("张三", "88855505882")
      5.         tels.set("李四", "15168524786")
      6.             // 获取Map中的键值对中的值，使用get(key)，根据键获取值
      7.         console.log(tels.get("王入力"))
      8.         console.log(tels)
      9.  
      10.         // 删除delete()
      11.         console.log(tels.delete("张三"))
      12.         console.log(tels)
      13.         console.log("--------------遍历-----------------")
      14.         for (const t of tels) {
      15.             console.log(t[0], t[1])
      16.         }
      17. //清空
      18.     tels.clear()

      效果：

      Set,Map,Array之间的转换

    使用Array.from(map1)

    1.  const map1 = new Map()
    2.         map1.set("k1", 1)
    3.         map1.set("k2", 2)
    4.         map1.set("k3", 3)
    5.         map1.set("k4", 4)
    6.         console.log(Array.from(map1))

    使用toLocaleString()转换为字符串 

    1.         const map1 = new Map()
    2.         map1.set("k1", 1)
    3.         map1.set("k2", 2)
    4.         map1.set("k3", 3)
    5.         map1.set("k4", 4)
    6.         console.log(Array.from(map1).toLocaleString())

    效果

    keys(),values(),foreach() 

    获取 键、值和遍历

    1.    console.log(tels.keys())
    2.         console.log(tels.values())
    3.         tels.forEach((value, key) => {
    4.             console.log(key + ":" + value)
    5.         });

    三、class类 

    • class：声明类

    • constructor：定义构造函数初始化

    • extends：继承父类

    • super：调用父级构造方法

    • static：定义静态方法和属性

            语法: class 类名(首字母大写){}

            类：它是一个宏观上的概念，而对象就是类的具体实现

    案例创建一个简单的类：

    1.  class Person {
    2.             //构造函数实现初始化
    3.             constructor(name, sex, age) {
    4.                     this.name = name
    5.                     this.sex = sex
    6.                     this.age = age
    7.                 }
    8.                 // 行为:用方法（函数）来实现
    9.             work() {
    10.                 console.log("工作")
    11.             }
    12.             eat() {
    13.                 console.log("吃饭")
    14.             }
    15.             sayHello() {
    16.                     console.log(`我叫${this.name}，我是一名开朗的${this.sex}生，我今年${this.age}岁了`)
    17.                 }
    18.                 // 有返回值的
    19.             getName() {
    20.                     return this.name
    21.                 }
    22.                 // 传参的
    23.             cal(n, m) {
    24.                 return n + m
    25.             }
    26.         }
    27.   let p0 = new Person("张三", "男", 30)
    28.         p0.work()
    29.         p0.eat()
    30.         p0.sayHello()
    31.         console.log(p0.getName())
    32.         console.log(p0.cal(1, 2))

    效果：

    继承：

    • 父类：Person，继承：extends

    • 当子类继承了父类，那么子类就可以访问父类中的属性，函数

    • 实例化对象的时候，构造函数中的参数的个数一定要完整

    • 必须调用一样super()函数

     列：（继承第一个）

    1.    class Student extends Person {
    2.             constructor(name, sex, age, stuid) {
    3.                 super(name, sex, age) //必须调用一样super()函数
    4.                 this.name = name
    5.              
    6.             }
    7.         }
    8.         let stu = new Student("张三", "女", 50, "1001")
    9.         stu.sayHello()
    10.         stu.eat()

    效果：

      当父类和子类中有相同名称函数时，调用的是子类中的函数，这就相当于子类将父类中的同名函数进行了重写

     super.sayHello() //可以调用父类中的函数

    static:静态的

    使用static来修饰的函数只能通过类名进行访问，不能通过对象访问

    整体代码

    1. <!DOCTYPE html>
    2. <html lang="en">
    3.  
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    8.     <title>Document</title>
    9. </head>
    10.  
    11. <body>
    12.     <script>
    13.         // 创建一个人类
    14.         /*
    15.         语法
    16.         class 类名(首字母大写){
    17.  
    18.         }
    19.         类：它是一个宏观上的概念，而对象就是类的具体实现
    20.         */
    21.         class Person {
    22.             //构造函数实现初始化
    23.             constructor(name, sex, age) {
    24.                     this.name = name
    25.                     this.sex = sex
    26.                     this.age = age
    27.                 }
    28.                 // 行为:用方法（函数）来实现
    29.             work() {
    30.                 console.log("工作")
    31.             }
    32.             eat() {
    33.                 console.log("吃饭")
    34.             }
    35.             sayHello() {
    36.                     console.log(`我叫${this.name}，我是一名开朗的${this.sex}生，我今年${this.age}岁了`)
    37.                 }
    38.                 // 有返回值的
    39.             getName() {
    40.                     return this.name
    41.                 }
    42.                 // 传参的
    43.             cal(n, m) {
    44.                 return n + m
    45.             }
    46.  
    47.             // static:静态的
    48.             // 使用static来修饰的函数只能通过类名进行访问，不能通过对象访问
    49.             static fun() {
    50.                 console.log("静态的")
    51.             }
    52.         }
    53.         // let p0 = new Person("张三", "男", 30)
    54.         // p0.work()
    55.         // p0.eat()
    56.         // p0.sayHello()
    57.         // console.log(p0.getName())
    58.         // console.log(p0.cal(1, 2))
    59.  
    60.         // 继承
    61.         // 父类：Person，继承：extends
    62.         // Student被称为子类
    63.         // 当子类继承了父类，那么子类就可以访问父类中的属性，函数
    64.         // 实例化对象的时候，构造函数中的参数的个数一定要完整
    65.         class Student extends Person {
    66.             constructor(name, sex, age, stuid) {
    67.                     super(name, sex, age) //必须调用一样super()函数
    68.                     this.name = name
    69.                 }
    70.                 // 当父类和子类中有相同名称函数时，调用的是子类中的函数，这就相当于子类将父类中的同名函数进行了重写
    71.             sayHello() {
    72.                     // console.log(`我叫${this.name}，我是一名开朗的${this.sex}生`)
    73.                     super.sayHello() //可以调用父类中的函数
    74.                 }
    75.                 // 多态
    76.                 // sayHello(n) {
    77.                 //     console.log(`我叫${this.name}，我是一名开朗的${this.sex}生,${n}`)
    78.                 // }
    79.         }
    80.         let stu = new Student("张三", "女", 50, "1001")
    81.         stu.sayHello()
    82.         stu.eat()
    83.         Student.fun()
    84.     </script>
    85. </body>
    86.  
    87. </html>

    效果：

     

  • 相关阅读:
    Greenplum数据库故障排查及修复
    来喽!!炒鸡详细的“数据在内存中的存储”真的来喽!
    2022春夏系列 KOREANO ESSENTIAL重塑时装生命力
    java多线程之Lock锁原理以及案例实现电影院卖票
    学习笔记|IO中断|中断号大于31|中断优先级|简易中央门禁|STC32G单片机视频开发教程（冲哥）|第十六集：IO中断
    .[nicetomeetyou@onionmail.org].faust勒索病毒数据怎么处理|数据解密恢复
    尚医通 (五) --------- 医院模块
    《围城》笔记
    复习C语言数组的用法
    ArcGIS 10.5安装教程！
  • 原文地址：https://blog.csdn.net/sh2001824/article/details/126677545