react
/
类.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>类</title>
</head>

<body>


    <script type="text/javascript">

        class Person {
            // 构造器方法
            constructor(name, age) {
                // 构造器中的this是谁   ----  类的实例对象
                this.name = name;
                this.age = age
            }

            // 一般方法   放在类的原型上面去了  提供给实例使用
            speak() {
                // 通过person实例调用speak时，speak中的this就是Person实例

                console.log(`我叫${this.name},我今年${this.age}岁`)
            }

        }

        // 定义两个类，一个类继承另一个类
        /**
        *   类中的构造器不是必须要写的，要对实例进行一些初始化的操作，如添加指定属性才写
        *   如果A类继承B类，且A类中写了构造器，那么A类构造器中super时必须要调用的。
        *   类中所定义的方法，都是放在了类的原型对象上的，供实例使用
        *
        */

        class Student extends Person {
            constructor(name,age,grade){
                super(name,age)
                this.grade=grade;
            }
            speak(name,age,grade){

                console.log(`我叫${this.name},我今年${this.age}岁,我在读${this.grade}年级`)
            }
            study(){
                console.log(`我爱学习`)
            }
        }

        let p1 = new Person('tom', 18);
        let p2 = new Person('java', 16);
        let s1 = new Student('C', 17,"高一");

        console.log(p1)
        console.log(p2)
        p1.speak();
        p2.speak();
        s1.speak();
        s1.study();
        console.log(s1)
    </script>


</body>

</html>