JavaScript原型和原型链以及原型继承_js原型原型链继承-优快云博客

     function Person(username,age,phone){ //构造函数
            this.username = username;
            this.age = age;
            this.phone = phone;
    }

    console.log("Person---",Person.prototype); //原型对象

（2）实例化对象访问原型对象 proto -----存放公共方法；

let p = new Person("aaa",12,"1231313");
    console.log("p----",p.__proto__);

（3）constructor属性：指向原构造函数

    console.log(Person.prototype.constructor);

从中可以看出，构造函数和实例化对象的原型对象是相同的

二、原型链

1、基本概念

当访问一个对象的某个属性时，会先在这个对象本身属性上查找，如果没有找到，则会去它的__proto__隐式原型上查找，即它的构造函数的prototype，如果还没有找到就会再在构造函数的prototype的__proto__中查找，这样一层一层向上查找就会形成一个链式结构，我们称为原型链。

2、基本原理

（1）一直往上层查找，直到找到null还没有找到，则返回undefined；

（2）Object.prototype.__proto__ === null；

（3）所有从原型或更高级原型中的得到、执行的方法，其中的this在执行时，指向当前这个触发事件执行的对象。

3、图解

如图所示为构造函数、实例化对象和原型对象之间的关系，红线部分表示原型链

三、原型继承

1、基本概念

原型继承是利用函数、实例化对象和原型对象之间的关系实现的继承；

2、子类在函数内部调用父类方法

 // 父  构造函数
    function Father(name,age,phone){
        //指向创建他的实例化对象
        this.name = name;
        this.age = age;
        this.phone = phone;
    }
 // 子 构造函数
    function Son(name,age,phone,email){
        //指向创建他的实例化对象
        //使用call() 立即调用执行父类方法  并且传递参数   【实现继承】
        Father.call(this,name,age,phone);
        //子类  自身属性
        this.email = email;
    }

1、通过构造函数调用来实现继承；

2、父类不能使用子类的方法和属性。

3、在子构造函数中调用父构造函数；

4、this表示指向创建他的实例化对象。

3、继承原型对象上的公共方法

（1）在父构造函数的原型对象上创建方法；

//在父构造函数的原型对象上创建方法
Father.prototype.fn = function(){
	
}

（2）通过new关键字将父构造函数创建的实例化对象赋值给子构造函数的原型对象；

//通过new将父构造函数的实例化对象 赋值给 Son的原型对象
    Son.prototype = new Father();

（3）利用 constructor 手动改变 son 的原型对象的指向的构造函数。

 //利用 constructor 手动改变 son 的原型对象的指向的构造函数
    Son.prototype.constructor = Son;

父类不能调用子类的属性和方法！