学习笔记八原型与原型链

原型

1. 函数的prototype属性

• 每个函数都有一个prototype属性, 它默认指向一个Object空对象(即称为: 原型对象)

console.log(Date.prototype, typeof Date.prototype)
function Fun () { }
console.log(Fun.prototype)  // 默认指向一个Object空对象(没有我们的属性)

date函数是定义好的 里面有很多方法 这些方法就在prototype中
而fun函数是我们自己定义的 此时fun的prototype是空对象 可以向里面添加方法

2. 给原型对象添加属性(一般都是方法)

• 作用: 函数的所有实例对象自动拥有原型中的属性(方法

  Fun.prototype.test = function () { console.log('test()') }
  var fun = new Fun()
  fun.test()

3. 原型对象中有一个属性constructor, 它指向函数对象

  console.log(Date.prototype.constructor===Date)
  console.log(Fun.prototype.constructor===Fun)

---

02_显式原型与隐式原型

1. 每个函数function都有一个prototype，即显式原型

2. 每个实例对象都有一个__proto__，可称为隐式原型

3. 对象的隐式原型的值为其对应构造函数的显式原型的值

4. 总结:

• 函数的prototype属性: 在定义函数时自动添加的, 默认值是一个空Object对象
• 对象的__proto__属性: 创建对象时自动添加的, 默认值为构造函数的prototype属性值
• 程序员能直接操作显式原型, 但不能直接操作隐式原型(ES6之前)
• 函数对象的prototype和实例对象的__proto__保存的都是一个地址值 且地址值是相同的 所以共同指向一个原型对象

---

原型链（隐式原型链）

访问一个对象的属性时，
先在自身属性中查找，找到返回
如果没有, 再沿着[__ proto __]这条链向上查找, 找到返回
只能沿着隐式属性找
如果最终没找到, 返回undefined

---

总结

1. 函数对象Fun也有__proto__属性 因为函数对象也是实例对象
   var Fun=new Function(){} 任何函数对象都是Function的实例
   所以所有函数都有隐式原型Fun的__proto__隐式原型和Function.prototype一样
   实例原型的隐式原型属性=它构造函数的显示原型属性

2. 所有函数的[__ proto __]隐式原型都是一样的 都等于Function的显示原型

3. Function的隐式原型是Function的显示原型 所以它的显示原型隐式原型相等 所以Function=new Function 是它自身的实例
   所以所有函数都是Function的实例 包括它本身

4. Object也是一个实例对象 它的隐式原型也是Function的显示原型

5. 函数的显示原型默认是空的Object对象 但是除了Object对象不满足
   Object的prototype是原型对象(空的object)的原型=fun__proto_.proto_
   Object的prototype里面还有__proto__它指向null,所以fun__proto_.proto_.__proto=null

---

4_原型链_属性问题

1. 读取对象的属性值时: 会自动到原型链中查找
2. 设置对象的属性值时: 不会查找原型链, 如果当前对象中没有此属性, 直接添加此属性并设置其值
3. 方法一般定义在原型中, 属性一般通过构造函数定义在对象本身上

  function Fn() { }
  Fn.prototype.a = 'xxx'
  var fn1 = new Fn()
  console.log(fn1.a, fn1) //xxx Fn{}

  var fn2 = new Fn()
  fn2.a = 'yyy'
  console.log(fn1.a, fn2.a, fn2) //xxx yyy  Fn{a: "yyy"}

查找到原型链 而赋属性的时候是赋给它原本而不是它的原型
如果想和她的原型共用修改 就fn2.proto=‘yyy’;

var p1 = new Person('Tom', 12)
  p1.setName('Bob')
  console.log(p1)  //Person {name: "Bob", age: 12}

  var p2 = new Person('Jack', 12)
  p2.setName('Cat')
  console.log(p2) //Person {name: "Cat", age: 12}
  console.log(p1.__proto__===p2.__proto__) // true   -->所以方法一般定义在原型中

p1.proto===p2.__proto__因为对象的隐式原型=构造函数的显示原型 所以相等

---

05_探索instanceof

判断该对象是谁的实例

1. instanceof是如何判断的?

• 表达式: A instanceof B
• 对象 instanceod 函数
• 如果B函数的显式原型对象在A对象的原型链上, 返回true, 否则返回false

2. Function是通过new自己产生的实例

 console.log(Object instanceof Function) // true
 //所以所有函数都是Function的实例 包括它本身,Object也是一个实例对象
 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

Object的prototype是原型的原型=fun.prototype__proto__

结论：任何函数都是Object和Function的实例

---

面试题

 function A () {}
 A.prototype.n = 1
 let b = new A()
 A.prototype = { n: 2, m: 3}
 let c = new A()
 console.log(b.n, b.m, c.n, c.m) // 1 undefined 2 3

A.prototype原本指向1 后又指向了一个对象 原本指向的指针就断了

---

function F (){}
 Object.prototype.a = function(){
   console.log('a()')
 }
 Function.prototype.b = function(){
   console.log('b()')
 }
 
 let f = new F()
 f.a() //a()
 f.b() //f.b is not a function -->找不到
 F.a() //a()
 F.b() //b()

1因为object的prototype是原型的原型 任何函数都可以找到
2当找F的方法时 要找一个东东西的属性或方法说明是拿它当做一个对象所以只能找__proto__属性 所以原型链指的就是隐式原型链
3哪怕F是匿名函数它也是Funciton的实例 所以F__proto__=Function.prototype=object