同系列文章请查看：Github：pre-interview

原型链

1
2
3
4
5
6
7
8

// 要有顺着原型链找东西的技巧 
// 甭管是 常规的 找方法、找属性
// 还是面试中可能问的找构造函数 找Function Object的显式原型
/*（比如写一个 Function.prototype.func = function(){...} 
  要知道这个func方法 哪些实例对象可以调用（顺着原型链的隐式原型那条路线要能抵达Function的显式原型 那就能用那上面的方法！） */
var Foo = function(){...};
var foo = new Foo();                       
console.log(foo.__proto__.__proto__ === Object.prototype;)//true 

经典图：

可以看到实例对象 顺着原型链可以找到Object的原型对象

Object的原型对象上有很多定义好的方法

另外Object的原型对象与Function的原型对象也有联系 即——Function.prototype.__proto__ = Object.prototype

Fn.proto = Function.prototype;
Function.prototype.proto = Object.prototype;

这样Fn（构造函数）就可以访问Object上定义的方法fn（Object.prototype.fn = function(){...}）了！

面试题

1
2
3
4
5
6
7
8
9
10
11
12
13
14

function F(){}
Object.prototype.a = function(){
    // Object的原型对象上增添了一个a方法
    console.log('a()')
}
Function.prototype.b = function(){
    console.log('b()')
}
var f = new F()
f.a() //【1】
f.b() //【2】
F.a() //【3】
F.b() //【4】
// 答案在文末

分析下这四部分：

【1】实例对象f 顺着原型链（的__proto__属性）

-> 实例对象F() -> 空Object对象 -> Object对象的显式原型

可以在Object的显示原型上找到a方法

【2】同理 顺着原型链找

-> 实例对象F()-> 空Object对象 -> Object对象的显式原型 -> null

Object对象的显式原型就是原型链的尽头了！没法再找到Function的原型对象了.

【3】从函数对象 通过隐式原型属性 顺着原型链找

这里需要注意 直接打印F 是没有办法获得它的 __proto__ 属性的

可以通过其原型对象的constructor来获取（见下图）

-> Function对象的显式原型 -> Object对象的显式原型

• ← 上一篇
• 下一篇 →