一些预备知识
- 每个函数都有一个prototype属性(显式原型),在定义函数时自动添加,它默认指向一个Object空对象(原型对象)。
- 每个实例对象都有一个__proto__(隐式原型),创建对象时自动添加。
- 原型对象中有一个属性constructor,它指向函数对象
- 函数的所有实例对象自动拥有原型中的属性(方法)
对象的隐式原型的值为其对应构造函数的显式原型的值
一道简单的例题
function Fn() {
//内部语句:this.prototype = {}
this.test1 = function () {
console.log('test1()');
}
}
Fn.prototype.test2 = function () {
console.log('test2()');
}
var fn = new Fn();
//内部语句:this.__proto__ = Fn.prototype
fn.test1();
fn.test2();
console.log(fn.toString());
fn.test3();
解:
原型链访问一个对象的属性时
- 先在自身属性中查找,找到返回
- 如果没有,再沿__proto__这条链向上查找,找到返回
- 如果最终没找到,返回undefined
图解如下所示,需要注意的是Object的原型对象为原型链的尽头
注意一个点
- 读取对象的属性值时:会自动到原型链中查找
- 设置对象的属性值时:不会查找原型链
方法一般定义在原型中,属性一般通过构造函数定义在对象本身上
instanceof
检查一个对象是不是一个类的实例
A instanceof B:如果B函数的显式原型对象在A对象的原型链上,返回true,否则返回false
function Foo() {}
var f1 = new Foo()
console.log(f1 instanceof Foo); //true
console.log(f1 instanceof Object); //true
console.log(Object instanceof Function); //true
console.log(Object instanceof Object); //true
console.log(Function instanceof Function); //true
console.log(Function instanceof Object); //true
function Foo() {}
console.log(Object instanceof Foo); //false
!!!注意注意注意!!!→(Function是通过new自己产生的实例)
ps:第三个判断那里试试(对象的隐式原型的值为其对应构造函数的显式原型的值),转换后带进去会有惊喜╰(°▽°)╯
面试题
题1
var A = function() {};//function A(){}
A.prototype.n = 1;
var b = new A()//实例对象的隐式原型属性n:1
A.prototype = {
n: 2,
m: 3
}
var c = new A()
console.log(b.n, b.m, c.n, c.m);//1 undefined 2 3
简图如下:
题2
function F() {};
Object.prototype.a = function () {
console.log('a()');
};
Function.prototype.b = function () {
console.log('b()');
};
var f = new F();
f.a(); //a()
// f.b();//undefined
F.a(); //a()
F.b(); //b()