JS原型和原型链



一、prototype和__proto__的概念

1.显示原型(prototype )

  • 所有的函数都有一个属性,prototype 称之为函数原型
  • 默认情况下,prototype是一个普通的对象
  • 默认情况下,prototype中有一个属性,constructor ,它也是一个对象,它指向构造函数本身

2.隐式原型(__proto __)

  • 所有的对象都有一个属性:__proto __,称之为隐式原型
  • 在默认的情况下,隐式原型指向创建该对象构造函数的原型
function Test(name,age){
    this.name = name;
    this.age = age;
    this.init = function(){
        console.log(123)
    }
}
var a = new Test('csdn',666);
console.log(a.__proto__ === Test.prototype)//true
console.log(a.__proto__.constructor === Test.prototype.constructor)//true
//在默认的情况下,隐式原型指向创建该对象构造函数的原型

3.例题

代码如下(示例1):

function Create(name,age){
    this.name = name;
    this.age = age;
    this.say = function(){
    console.log('hello world');
    }
}
var u1 = new Create('lihua',21);
var u2 = new Create('xiaoming',18);

console.log(u1.say === u2.say);	//false
u1.__proto__.abc = 456;
console.log(u2.abc);// undefined
console.log(u1.abc);456
Create.prototype.say = function(){
      console.log('js');
}
u1.say = null;
u2.say(); // js
// u1.say();// 报错

代码如下(示例2):

function Create(name,age){
            this.name = name;
            this.age = age;
}
Create.prototype.init = function(){
     console.log('oys');
}
var u1 = new Create();
var u2 = new Create();
console.log(u1.init === u2.init);// true    

总结:由例1和例2可以看出来,this和prototype是有区别的,一个会产生两个不同的存储空间,而通过prototype都是在操作同一个东西,所以u1.init全等于u2.init

二、原型链图

1.构造函数

在这里插入图片描述

2._proto_与prototype

在这里插入图片描述

3.person → Person → Object

在这里插入图片描述

4.完整原型链

在这里插入图片描述

相关推荐
©️2020 CSDN 皮肤主题: 游动-白 设计师:白松林 返回首页