两大“神兽”之一,原型"/>
javascript的两大“神兽”之一,原型
函数的prototype属性
- 每一个函数都有一个prototype属性,默认指向一个Object空对象(原型对象)
function fun() {}
console.log(fun.prototype) // 默认指向一个Object空对象(没有我们的属性)
原型对象中有一个属性constructor,它会指向函数对象
console.log(fun.prototype.constructor === fun)
// true
总结起来函数的prototype属性:
- 给原型对象添加属性(一般是方法)
作用:函数的所有实例对象自动拥有原型中的属性(方法)
给原型对象添加属性(一般是方法)===> 实例对象可以访问
function Fun() {}
Fun.prototype.test = function () {console.log('test')}
var fun = new Fun()
fun.test()
// test
显式原型与隐式原型
1.每个函数function都有一个显式原型 ( prototype )
function Fun() {} // 内部语句:this.prototype = {}
console.log(Fun.prototype)
2. 每一个实例对象都有一个__proto__ , 即隐式原型
var fn = new Fun() // 内部语句:this.__proto__ = Fun.prototype
console.log(fn.__proto__)
3.对象的隐式原型的值为其构造函数的显式原型的值
console.log(Fun.prototype === fn.__proto__)
// true
总结:
- 函数里面有个prototype属性指向原型对象,实例化对象里面有个__proto__属性他也指向原型对象,且与构造函数的原型对象是同一个,原型对象里面有个constructor属性他指向的是构造函数
- 函数的prototype属性:在定义函数时自动添加的,默认值是一个空object对象
- 对象的__proto__属性:创建对象时自动添加的,默认值为构造函数的prototype属性值
- 程序员能直接操作显式原型,但不能直接操作隐式原型(ES6之前)
- 实例对象的隐式原型等于构造函数的显示原型
内部原理:
原型链
1.访问一个对象的属性时:
先在自身属性中查找,找到返回
如果没有,再沿着_proto_这条链向上查找,找到返回
如果最终没找到,返回undefined
从始至终于显式原型没有关系所以原型链别名:隐式原型链
原型链的作用:查找对象的属性(方法)
2.构造函数/原型/实体对象的关素(图解)
var o1 = new Object()
var o2 = {}
3.构造函数/原型/实体对象的关系2(图解)
function Foo() {}
4.补充:
函数的显式原型指向的对象默认是空Object实力对象(但Object不满足)
所有函数都是Function的实例(包含Function)
5.作用:
查找对象的属性(方法)
1.读取对象的属性值时:会自动到原型链中查找
2.设置对象的属性值时:不会查找原型链,如果当前对象中没有此属性,直接添加此属性并设置其值
function Fn() {}Fn.prototype.a = 'xxx'var fn = new Fn()console.log(fn.a,fn)
3.方法一般定义在原型中,属性一般通过构造函数定义在对象本身上
function Person(naem, age) {this.name = namethis.age = age}Person.prototype.setName = function (name) {this.name = name}var p1 = new Person('Tome', 12)p1.setName('Jery')console.log(p1)
原型继承
构造函数的实例对象自动拥有构造函数原型对象的方法(属性),利用的就是原型链
instanceof是如何判断的
- 表达式:A instanceof B
如果B函数的显式原型对象在A对象的原型链上,返回true,否则返回false - Function是通过new自己产生的实例
更多推荐
javascript的两大“神兽”之一,原型
发布评论