前端进阶------实例对象,构造函数,以及原型之间的关系

时间:2022-05-19 14:36:23

一:直接上代码:采用构造函数和原型模式(组合模式)来举例子讲解。

function Person_00(name,age){   // 
this.name=name;
this.age=age;
}
Person_00.prototype={
constructor:Person,
run:function(){
alert(this,name);
}
}
var person_1=new Person_00("张三",20); //new是一个动词(相当于啪啪啪),Person_00就是构造函数(相当于你妈),person_1是实例对象(相当于你)

二:关系
(1)导入:每个对象都有隐式原型(_proto_)。显示原型(prototype)是函数特有的,也就是说函数既有隐式属性,同时又有显示属性。
(2)在本代码中:实例对象是person_1 ; 构造函数是Person_oo ; 原型对象是Person_oo .peototype 。

1 :实例对象和构造函数之间的关系:
构造函数就是你妈 (理解为蓝图也可以);
new就是生产过程,啪啪啪;
实例对象就是你,儿子或女儿;
所以实例对象和构造函数就是一种“生产关系”
2 :实例对象和原型对象的关系:
每个实例对象有一个隐式原型(_proto_);
构造函数的原型对象是(Person_oo .prototype);‘
实例对象的隐式原型(_proto_)指向原型对象的显式原型(Person_oo .prototype),是是一种“委托“关系。怎么理解委托请点击链接查看。
3:构造函数和原型对象的关系:
首先,提提函数的三大作用:
[1].封装可复用逻辑代码段
[2].作为可以new的构造函数
[3].本身是对象
因为构造函数本身也是对象,那么函数就有两个原型,Person.prototype此原型是给Person的实例用的。
Person._proto_是给自己用的。
额外补充:由于Person_oo是对象,也是实例,它也有原型,Person_oo的原型是Function .prototype。所以console.log(Person.00__proto_ == Function.prototype); //ture
三:总结

老姚谈:JavaScript中prototype的本质:https://zhuanlan.zhihu.com/p/23483423?refer=dreawer