js中的函数中的原型链
1. 原型链(图解)
<script type="text/javascript">
// console.log(Object)
//console.log(Object.prototype)
console.log(Object.prototype.__proto__)
function Fn() {
this.test1 = function () {
console.log('test1()')
}
}
console.log(Fn.prototype)
Fn.prototype.test2 = function () {
console.log('test2()')
}
var fn = new Fn()
fn.test1()
fn.test2()
console.log(fn.toString())
console.log(fn.test3)//undefined 但是不报错
// fn.test3()//test3()作为函数执行 因此报错
/*
1. 函数的显示原型指向的对象默认是空Object实例对象(但Object不满足)
*/
console.log(Fn.prototype instanceof Object) // true
console.log(Object.prototype instanceof Object) // false
console.log(Function.prototype instanceof Object) // true
/*
2. 所有函数都是Function的实例(包含Function)
*/
console.log(Function.__proto__===Function.prototype)
/*
3. Object的原型对象是原型链尽头
*/
console.log(Object.prototype.__proto__) // null
</script>
- 访问一个对象的属性时,
- 先在自身属性中查找,找到返回 (test1)
- 如果没有, 再沿着__proto__这条链向上查找, 找到返回(test2 toString )
- 如果最终没找到, 返回undefined(test 3)
原型链的尽头是:Object原型对象- 别名: 隐式原型链
- 作用: 查找对象的属性(方法)
2 构造函数/原型/实体对象的关系(图解)
函数fun Type的prototype属性指向Type的原型对象object
Type原型对象的constructor构造器指向函数fun Type
图例解析:
两个实例:o1和o2
实例都有隐式原型属性,指向Object原型对象(指向的意思为:地址的值相等 逻辑意义上的指向)
隐式原型的属性的值由函数对象的显式原型属性赋值
函数对象的显式原型属性prototype和原型对象的构造器constructor相互引用
- 构造函数/原型/实体对象的关系2(图解)
总之,原型链重点把握以下四点规则:
①实例对象的隐式原型等于构造函数的显式原型
②函数对象的prototype和对象的构造器constructor相互引用
③每个函数都有一个显式原型和一个隐式原型(包括Function函数和Object函数)
④任何函数(自定义或内置的)都是由new Function 构造产生的实例对象
原型链中的需要注意的点
- 函数的显式原型指向的对象默认是空Object实例对象(但Object不满足)
- 所有函数都是Function的实例(包含Function)
- Object的原型对象是原型链尽头
/*
1. 函数的显式原型指向的对象默认是空Object实例对象(但Object不满足)
*/
console.log(Fn.prototype instanceof Object) // true
console.log(Object.prototype instanceof Object) // false
console.log(Function.prototype instanceof Object) // true
/*
2. 所有函数都是Function的实例(包含Function)
*/
console.log(Function.__proto__===Function.prototype)
/*
3. Object的原型对象是原型链尽头
*/
console.log(Object.prototype.__proto__) // null