原型与原型链
1.js的无中生有。
js本源是null,js说要有神,通过万能术__proto__创造了No.1 神
2.以No.1创造对象
js说 你要有自己的想法,于是,No.1以自己为原型创造了Object
可以理解为 Object.prototype == No.1
我们把 prototype 叫做原型,好比 Object 的原型是神,男人的原型是人类一样
3.利用__proto__ 造No.2神
js说:你要有更多想法,把__proto__借用给No.1,
No.1利用__proto__ 创造了 机器No.2,
No.2创造了 Array,Number,Boolean,String等内置对象(就是构造函数)
No.2规定:所有的对象都可以通过__proto__找到No.2,然后找到No.1
这样: Object.prototype = No.1
Object.__proto__ = No.2
4.No.2造Function
js说:神造的机器No.2好厉害,能不能让使用js的人也可以造机器
神说:你通过万能术创造了我,我以自己为原型创造了Object,
那我造一个Function,并且:
Function.prototype == No2, Function.__ proto __ == No2
5.No.2成为造机器的机器
负责管理:Object、Function、String、Number、Boolean、Array
6.总结
自此,
1.所有的构造函数均有原型 prototype
2.所有的对象均有万能术 __proto__ 指向他的构造函数的原型(prototype)
也可理解为:(关于这一点在几种继承总结会详细解释)
prototype服务于实例化对象
__proto__服务于函数对象
解决的疑惑
-
“万物皆对象”,其实都是根据Object衍生出来,但是由于对象也是一个函数对象,或者说构造函数,所以以数据类型区分,他们同级
Object String Nubmer Boolean Undefined Null
-
Function 声明出来的对象是什么
函数是由Function声明出来的对象被叫做函数对象 可以用作方法直接调用, 也可以用做构造函数,进行实例化
-
什么是原型链
访问一个对象的属性或者方法时,如果该对象身上没有, 就通过__proto__去找到,实例化对象的构造函数的prototype身上寻找 这样一直通过__proto__一直找到最顶层。 这一条相互指引的过程就是原型链
显式原型与隐式原型
看一段代码
function Cat (name,age){
this.name = name;
this.age = age;
this.getAge = function(){
console.log(this.age)
}
}
Cat.prototype={
getName:function(){
console.log(this.name)
}
}
var cat = new Cat('kk',18)
console.log(cat.getName)
console.log(cat.__proto__)
console.log(Cat.prototype)
console.log(cat.__proto__ === Cat.prototype)
小白:__proto__,prototype 是什么?
划重点:
每个函数都有一个prototype原型属性,称之为显式原型属性或显式原型
每个实例对象都有一个__proto__原型属性,称之为隐式原型属性或隐式原型
实例对象隐式原型指向构造函数对象显式原型
小技巧:
函数定义的时候函数本身就会默认有一个prototype的属性,
而我们如果用new 运算符来生成一个对象的时候就没有prototype属性
所以 Cat 有,cat没有
关系图
自己画了一张关系图
参考资料
链接: 原型链图.
链接: 原型与原型链.
总结
也说一说为什么需要理解好原型链,
比如我想要去写一篇关于类型检测的方法,却不晓得他的检测原理。
比如我想写bind,call,apply 他们的区别 他们操作的是this,this在不同情况指向是不一样的
比如我想写继承那更不可能不晓得原型链了
所以我试着整理一份,其实本篇 没有过多个人理解。
大多数是学习来的。
说一说心得,本篇算是耗时比较久的了。自己在快速了解学习一个东西的能力有待提高。
再有一个就是,学习前端某一个点,像是走一条小路,往后你会发现还有很多路,但是走着走着你发现他们指向了同一座大山。上山的方式有千百种,希望你有一天登上山顶,俯瞰来时的风景。
最后,如果你一直学习,真的会累。xixi
全力以赴奔向你le。