js __proto__

  1. 构造函数的__proto__
 function Animal(){
        
 }
 var  anim = new Animal();
Object.__proto__===Function.prototype //true
Array.__proto__===Function.prototype //true
Animal.__proto__===Function.prototype //true

Function.prototype===Function //false
Function.prototype.constructor===Function //true

Object Array Animal都是由Function new出来的,所以他们的__proto__都指向Function.prototype

Function.prototype上面挂载的有bind call apply toString等方法。

  1. 普通对象
anim.__proto__===Animal.prototype //true

Animal.prototype.__proto__===Object.prototype //true
Object.prototype.__proto__===null; //true
--> anim.__proto__.__proto__.__proto__===null

var dog={};
dog.__proto__===Object.prototype //true
Object.prototype.__proto__===null //true
-->dog.__proto__.__proto__===null //true

每个普通对象的__proto__都指向其构造函数的prototype

每个对象的__proto__都指向其构造函数的prototype(除了Object.prototype.__proto__===null //true

dog与anim相比,少了一层__proto__

由于__proto__不是IE对象内置属性,只是chrome和firefox对象内置属性,所以在编码的时候不能直接用__proto__关联普通对象之间的关系,可以这么理解prototype是普通对象和函数对象的桥梁(构造函数),prototype所有浏览器都支持,直接可以使用,而__proto__则不可以,ES5有了Object.create()去关联普通对象的关系,主要用在继承:

var obj1 = {name:'one'};
var obj2 = Object.create(obj1);

创建一个对象并且将obj2的__proto__指向obj1,即是做了一下两步操作:

var obj2={};
obj2.__proto__=obj1;

查看redux( "version": "4.0.0-beta.1",)代码的时候发现了这么句话:

  function dispatch(action) {
    if (!isPlainObject(action)) {
      throw new Error(
        'Actions must be plain objects. ' +
          'Use custom middleware for async actions.'
      )
    }
  }

utils/isPlainObject.js的实现

export default function isPlainObject(obj) {
  if (typeof obj !== 'object' || obj === null) return false

  let proto = obj
  while (Object.getPrototypeOf(proto) !== null) {
    proto = Object.getPrototypeOf(proto)
  }

  return Object.getPrototypeOf(obj) === proto
}

lodash同样有isPlainObject

function isPlainObject(value) {
  // 判断是不是纯对象,数组也不是纯对象
  if (!isObjectLike(value) || baseGetTag(value) != '[object Object]') {
    return false
  }
  // 判断是不是由Object.create(null)创建
  if (Object.getPrototypeOf(value) === null) {
    return true
  }
  // 循环判断value的__proto__是不是等于Object.prototype,如果是new Foo()创建的就不相等
  let proto = value
  while (Object.getPrototypeOf(proto) !== null) {
    proto = Object.getPrototypeOf(proto)
  }
  return Object.getPrototypeOf(value) === proto
}

export default isPlainObject

lodash和redux的代码可以看出,redux并不认为Object.create(null)创建的对象是纯对象

我们都知道很多浏览器是不支持__proto__写法的,所以可以使用Object.getPrototypeOf(obj)拿到obj__proto__

var obj={name:'oo'}
obj.__proto__===Object.prototype //true
Object.getPrototypeOf(obj)===Object.prototype //true

所以Object.getPrototypeOf(obj)obj.__proto__是等价的

Js中Prototype、__proto__、Constructor、Object、Function关系介绍

你可能感兴趣的:(js __proto__)