ES6 Class

alpha_xiao

于 2022-03-08 11:09:58 发布

阅读量134

点赞数

分类专栏： ES6 文章标签： javascript 前端

本文链接：https://blog.youkuaiyun.com/alpha_xiao/article/details/123348708

版权

ES6 专栏收录该内容

1 篇文章

订阅专栏

这篇博客介绍了JavaScript中的类和继承概念。首先展示了ES5的函数式构造函数，然后过渡到ES6的类语法，包括构造函数和方法定义。接着讲解了类的继承，通过`extends`关键字实现子类对父类的继承，并展示了不同写法。最后演示了一个子类`Teacher`继承自`Father`的例子，展示子类如何覆写和新增方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// console.log('hello')

// function Father () {
//   this.name = '父亲'
//   this.age = '66'
//   this.say = function () {
//     console.log(" I'm father")
//   }
// }

// const abb = new Father()
// console.log(abb.name) // 父亲

// ES6 新写法
class Father {
  constructor () {
    this.name = '父亲'
    this.age = '66'
  }

  say () {
    console.log(" I'm father")
  }
}
const add2 = new Father()
console.log(add2.name) // 父亲
add2.say() // I'm father

// 继承
class Teacher extends Father {
  // 复杂的写法
  // constructor () {
  //   // constructor 里面调用 this 之前, 一定要写super()
  //   super()
  //   this.name = '老师'
  // }

  // 简单写法
  name = '老师'
  song () {
    console.log('song')
  }
}
const add3 = new Teacher()
console.log(add3.name) // 老师
add3.song() // song