原型链、instanceof检测类型的实现原理

访问某对象的属性时，会先在自身查找有没有这个属性，如果没有，就会沿着proto这条链向上查找，直至找到Object.prototype身上，找到就返回；没有找到，就返回undefined。

function Fun1(age){
      this.age = age
}

function Fun2(num){
      this.num = num
}
Object.prototype.name = 'yy'
let fun1 = new Fun1('18')
let fun2 = new Fun2(20)
console.log(fun1.age)
console.log(fun2.name)

所有函数的proto都相等?
相等。因为每个函数都可以由Function创建得到，比如

let fun1 = new Function()
let fun2 = new Function()
let fun3 = new Function()
console.log(fun1.__proto__ === fun2.__proto__)//true
console.log(fun2.__proto__ === fun3.__proto__)//true
console.log(fun1.__proto__ === Function.prototype)//true

每个函数都是Function的实例对象，他们的proto属性都共同指向的是同一个Function.prototype属性。

原型链属性问题
读取对象属性时，会自动在原型链中查找。
设置对象属性时，不会查找原型链，当前对象没有此属性，会直接添加此属性。
方法一般添加到函数的原型上，属性直接通过实例对象添加。

原型链练习题

function F (){}
Object.prototype.a = function(){
    console.log('a()')
}
Function.prototype.b = function(){
    console.log('b()')
}
  
var f = new F()
f.a()
// f.b()
F.a()
F.b()
console.log(f)

instanceof的原理
a instanceof b：判断a是不是它的父类型b或者祖先类型b的实例对象。
原理：如果b函数的prototype属性在a对象的原型链上，那么返回的结果就为true，否则返回false。

function Foo() {  }
let 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

手写instanceOf：
思路：遍历左边变量的原型链，如果和右边变量的原型相等，则查找成功，返回true。如果查找到原型链的尽头还没找到，则返回false。
参考：https://juejin.im/post/6844904191031246861#heading-17

function instanceOf(left,right){
  let leftVal = left.__proto__
  let rightVal = right.prototype
  while(leftVal!== null){
    if(leftVal === rightVal){
      return true
    }
    leftVal = leftVal.__proto__
  }
  return false
}

function Fun(name){
  this.name = name
}

let fun = new Fun()
console.log(instanceOf(fun,Fun))//true
console.log(instanceOf(10,Fun))//false

最后编辑于：2020.10.05 12:22:12