day28 继承

2023-11-07 11:27:58

1、原型继承

如何实现元素继承

让子类的原型对象等于父类的任意实例化对象

实现继承的作用：

1.子类可以直接使用父类派生的属性和方法

2.子类可以添加自己新的属性和方法

子类对象h，是如何访问父类的属性，父类原型方法，子类的属性及子类的原型方法

原型链图

向上找：在访问属性或者方法是，首先在子类中查找，如果没有找到，则一层一层向父类查找

如果最上层未找到则报错

<script>
    function Animal(name){
        this.name=name;
    }
    Animal.prototype.eat=function(){
        console.log("Animal eat")
    }
    function Human(id){
        this.id=id;
    }
    Human.prototype=new Animal("name");
    Human.prototype.study=function(){
        console.log("Human study")
    }
    let h=new Human(1)
    h.name="name1";
    console.log(h.name)
    h.eat();
    console.log(h.id);
    h.study();
</script>

2、原型链继承

<script>
    function Animal(name){
        this.name=name;
    }
    Animal.prototype.eat=function(){
        console.log("eat");
    }
    function Human(id){
        this.id=id;
    }
    Human.prototype=new Animal("name");
    Human.prototype.makeTools=function(){
        console.log("制作工具")
    }
    function Studnet(score){
        this.score=score;
    }
    Student.prototype=new Human(1);
    Student.prototype.study=function(){
        console.log("study");
    }
    let s=new Student("100");
    console.log(s.name,s.id,s.score);
    s.eat();
    s.makeTools();
    s.sudy();
</script>

3、原型继承的缺陷

注意事项:

1.为子类对象添加原型方法时，必须先实现继承关系

2.由父类派生给子类的属性，是无法在子类对象构造时，进行初始化的

3.一旦实现了继承关系，则子类的原型对象的值就不能再修改了

4、深拷贝和浅拷贝

<script>  
  function Student(id, name) {
        this.id = id;
        this.name = name;
    }

    //克隆一个调用该函数的对象
    Student.prototype.clone = function() {
        //开辟空间
        let item = new Student(this.id, this.name);

        return item;
    }

    let s1 = new Student(1, "高洋");
    let s2 = s1.clone();

    s2.name = "赵四";

    console.log(s1, s2);
</script>

拷贝：用已有对象初始化一个新的对象

let a=123;

let b=a;

内置类型和引用类型在内存中存储的区别:

内置基本类型只有一块栈空间，存储的就是数据本身

引用类型有凉快空间，一块是栈空间，存储堆空间的地址，

另一块是堆空间，存储真正的数据

深浅拷贝：只针对于引用类型

浅拷贝：只拷贝引用地址，但是并未开辟空间

深拷贝：开辟空间且赋值

5、apply和call继承

apply和call继承的作用：用来解决原型继承时，无法初始化由父类派生给子类的属性
apply和call的继承的缺陷，不能继承父类原型对象上的属性和方法

<script>
    // apply和call继承的作用：用来解决原型继承时，无法初始化由父类派生给子类的属性
    // apply和call的继承的缺陷，不能继承父类原型对象上的属性和方法
    function Human(id,name){
        this.id=id;
        this.name=name;
    }
    function Student(id,name,score){
        // 借用构造方法
        Human.call(this,id,name);
        this.score=score;
    }
    let s=new Student(1,"name1",100);
    console.log(s);
    s.eat();
</script>

6、混合继承

<script>
    // 混合继承：1.父类属性通过apply和call继承
    //          2.原型属性和方法，通过原型对象继承
    function Anmial(id,name){
        this.name=name;
        this.id=id;
    }
    Animal.prototype.eat=function(){
        console.log("animal eat");
    }
    function Student(id,name,score){
        // 属性的继承
        Animal.apply(this,[id,name]);
        this.score=score;
    }
    // 原型对象上的方法和属性继承
    Student.prototype=new Animal();
    Student.prototype.study=function(){
        console.log("Student study");
    }
    let s=new Student(1,"name1",100);
    console.log(s);
    s.eat();
    s.study();
</script>

7、ES6继承方法

<script>
    class Animal{
        //constructor构造方法
        constructor(id,name){
            this.id=id;
            this.name=name;
        }
        eat(){
            console.log("Animal eat");
        }
    }
    // extends继承的关键字
    // super：借用父类的构造方法
    class Student extends Animal{
        constructor(id,name,score){
            super(id,name);//这句话必须放在第一行
            this.score=score;
        }
        study(){
            console.log("Student study");
        }
    }
    let a=new Animal(1,"name1");
</script>

码农公寓