js class定义类,私有属性,类继承,子类访问父类的方法,重写父类的方法

1.使用#定义私有属性

2.使用extends实现类继承

3.使用子类使用super访问父类的方法

4.子类可以重新父类的方法

javascript 复制代码
      class People {
        #hisroy = []
        getHistroy() {
          return [...this.#hisroy]
        }
        addHisroy(message) {
          this.#hisroy.push({
            role: 'user',
            message,
          })
          this.addHisroy2(message)
        }
        addHisroy2(message) {
          this.#hisroy.push({
            role: 'robot',
            message: 'Robot:' + message,
          })
        }
        addHisroy3(message) {
          this.#hisroy.push({
            role: 'user',
            message,
          })
        }
        clearHistory() {
          this.#hisroy = []
        }
      }
      class Student extends People {
        addHisroy(message) {
          if (message.includes('weather')) {
            super.addHisroy3(message)
            super.addHisroy2('天气晴朗')
          } else {
            super.addHisroy(message)
          }
        }
      }
      let p1 = new People()
      p1.addHisroy('hello')
      console.log(p1.getHistroy())
      p1.clearHistory()
      console.log(p1.getHistroy())

      let t1 = new Student()
      t1.addHisroy('hello')
      console.log(t1.getHistroy())
      t1.addHisroy('what is the weather?')
      console.log(t1.getHistroy())
      t1.clearHistory()
      console.log(t1.getHistroy())

https://www.kancloud.cn/fundebug/fundebug-blog/1039647

https://jamie.build/javascripts-new-private-class-fields.html

相关推荐
天人合一peng15 分钟前
Unity中button 和toggle监听事件函数有无参数
前端·unity·游戏引擎
会飞的战斗鸡32 分钟前
JS中的链表(含leetcode例题)
javascript·leetcode·链表
方也_arkling1 小时前
别名路径联想提示。@/统一文件路径的配置
前端·javascript
毕设源码-朱学姐1 小时前
【开题答辩全过程】以 基于web教师继续教育系统的设计与实现为例,包含答辩的问题和答案
前端
qq_177767371 小时前
React Native鸿蒙跨平台剧集管理应用实现,包含主应用组件、剧集列表、分类筛选、搜索排序等功能模块
javascript·react native·react.js·交互·harmonyos
qq_177767371 小时前
React Native鸿蒙跨平台自定义复选框组件,通过样式数组实现选中/未选中状态的样式切换,使用链式调用替代样式数组,实现状态驱动的样式变化
javascript·react native·react.js·架构·ecmascript·harmonyos·媒体
web打印社区1 小时前
web-print-pdf:突破浏览器限制,实现专业级Web静默打印
前端·javascript·vue.js·electron·html
RFCEO2 小时前
前端编程 课程十三、:CSS核心基础1:CSS选择器
前端·css·css基础选择器详细教程·css类选择器使用方法·css类选择器命名规范·css后代选择器·精准选中嵌套元素
烬头88212 小时前
React Native鸿蒙跨平台采用了函数式组件的形式,通过 props 接收分类数据,使用 TouchableOpacity实现了点击交互效果
javascript·react native·react.js·ecmascript·交互·harmonyos
Amumu121382 小时前
Vuex介绍
前端·javascript·vue.js