【React】React学习笔记05复习类的基本知识

最新推荐文章于 2024-09-10 22:19:28 发布

零小栩

最新推荐文章于 2024-09-10 22:19:28 发布

阅读量158

点赞数

分类专栏： react 文章标签： react.js 学习 javascript

本文链接：https://blog.csdn.net/qq_37744229/article/details/126233167

版权

react 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

本文概述了JavaScript中类的基础知识，包括构造器的使用时机、子类继承父类时super的必要性，以及方法的原型对象应用。通过实例演示了如何创建Person和Student类，并展示继承和方法重写。

摘要由CSDN通过智能技术生成

总结

1.类中的构造器不是必须写的，要对实例进行一些初始化的操作，如添加指定属性时才写

2.如果B类继承了A类，且B类中写了构造器，那么B类构造器中的super时是必须调用的

3.类中所定义的方法，都是放在了类的原型对象上，供实例去使用

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>类的基本知识</title>
</head>
<body>
  <script type="text/javascript">
/*
    总结：
      1.类中的构造器不是必须写的，要对实例进行一些初始化的操作，如添加指定属性时才写
      2.如果B类继承了A类，且B类中写了构造器，那么B类构造器中的super时是必须调用的
      3.类中所定义的方法，都是放在了类的原型对象上，供实例去使用
*/

    // 创建一个Person类
    class Person{
      //构造器方法
      constructor(name,age){
        // 构造器中的this是类的实例对象
        this.name=name
        this.age=age
      }
      // 一般方法
      speak(){
        // speak方法放在了类的原型对象上，供实例使用
        // 通过Person实例调用speak，speak中的this就是Person实例
        console.log(`${this.name}说:${this.age}`)
      }
    }
    // // 创建一个Person的实例对象
    // const p1 = new Person('tom',18)
    // const p2 = new Person('jerry',19)

    // console.log(p1)
    // console.log(p2)
    // p1.speak()
    // p2.speak()
    // // p1.speak.call({a:1,age:2})
    
    // 创建一个Student类，继承于Person类
    class Student extends Person{
      constructor(name,age,grade){
        // 继承父类的属性,必须最开始调用super
        super(name,age)
        this.grade=grade
      }
      // 重写从父类继承过来的方法
      speak(){
        console.log(`${this.name}说:${this.age},${this.grade}`)
      }
      study(){
        console.log(`study`)
      }
    }
    const s1 = new Student('张三',15,'高一')
    console.log(s1)
    s1.speak()
  </script>
</body>
</html>