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关系介绍

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 理解 javascript 的原型链及继承 以上所有的运行结果都是 true; 三种构造对象的方法: 通过对象字面...
    你期待的花开阅读 1,543评论 0 3
  • title: js面向对象date: 2017年8月17日 18:58:05updated: 2017年8月27日...
    lu900618阅读 581评论 0 2
  • 一、JavaScript基础知识回顾 1.1 JavaScript 1.1.1 javascript是什么? Ja...
    福尔摩鸡阅读 1,343评论 0 7
  • 我要做 我不要做 我想做 两个自我的博弈 冥想是为了(锻炼意志力)锻炼专注力 选择一些难的事情去做吧 要克服的不好...
    heardlover阅读 337评论 0 0
  • 我用一只耳朵聆听山间的蝉鸣 我用一只眼眸望穿尘封的悲情 我用一根无力的心弦弹奏流逝的岁月 我用一幅漠然的凝视 平复...
    天山之鹰阅读 169评论 0 0