JS中Object对象的原型概念基础

对象概念

在 javascript 中, 一切引用类型均为对象。 如 function foo () {} 中，foo本身就是一个对象的引用。

创建对象方式 字面量方式 new 构造函数函数声明 object.create

字面量对象

javascript语言级别快速创建对象的实例

var obj = {foo: 'foo', bar: 'bar'}; // object对象字面量
var obj2 = [obj, 'foo', 'bar']; // array数组字面量
var obj3 = /^[a-za-z0-9]$/; // regexp正则字面量
var obj4 = function(){}; // function函数字面量

new 构造函数

通过内置对象的构造函数，或者自定义的函数。 使用 new 操作符，创建一个对象，并且执行构造函数方法。

var obj = new object();
var obj2 = new array(1000);
var obj3 = new regexp('^[a-za-z0-9]$');
var obj4 = new function('a', 'b', 'return a + b;');

函数声明

函数声明创造的对象. 函数属于特殊的对象.

function foo() {}
foo instanceof object;
foo instanceof function;

object.create

传入一个对象作为返回对象的原型，创建一个新对象, 并将新对象的原型指向传入的对象中。

var foo = {
 'foo': 'foo',
 'bar': 'bar'
};
var o = object.create(foo); // o.__proto__ = foo
console.log(o.foo); // o.__proto__.foo

使用object.create(null) 可以返回一个字典型对象.

var o = object.create(null);
o instanceof object; // return false;
o.tostring(); // uncaught typeerror

对象原型

每一个对象都有一个内置的 __proto__ 属性指向构造它的函数prototype属性. 而构造函数的

prototype.constructor 则指向构造函数本生。一个对象的属性的寻找过程由以下几个部分组成:

寻找对象属性的数据描述符(writable, value)或存取描述符(getter, setter)，如果查询到了，则返回 对应的值。如果查询不到，则进入第2步骤。寻找对象属性的值是否有被显示定义 (可以通过 object.getownpropertynames)检测，如果对象属性定义了，则返回定义的值。 如果没有，则进入第3步骤。寻找对象的隐藏原型__proto__对象的属性，规则同1，2步骤。如果还未找到，则重复第3步骤， 直到__proto__ 为null 为止。

具体案例如下图所示:

检测对象原型

测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性

instanceof object.prototype.isprototypeof

instanceof

运算符，语言级别的检测对象的原型链是否包含构造函数的原型

function foo () {}
foo instanceof function; // return true
foo instanceof object; // return true

模拟instanceof查找对象的原型链的构造函数是否包含传入的构造函数, __proto__ 在一些特定的浏览器有暴露给用户

function bar () {}
function isinstanceof (obj, constructor) {
 if (obj === null) {
 return false;
 }
 // 忽略 string, number, boolean, null, undefined 类型干扰
 if (!~['object', 'function'].indexof(typeof obj)) {
 return false;
 }

 var prototype = obj.__proto__;
 while(prototype) {
 if (prototype.constructor === constructor) {
  return true;
 }
 prototype = prototype.__proto__;
 }
 return false;
}
isinstanceof(bar, function);
isinstanceof(bar, object);

isprototypeof

构造函数的原型对象自带的函数属性, 用于检测目标对象的原型链中是否存在构造函数的原型对象。

function baz () {}
var baz = new baz();
baz.prototype.isprototypeof(baz);
function.prototype.isprototypeof(baz);
object.prototype.isprototypeof(baz);

获取对象原型 object.getprototypeof __proto__

var o = {};
var prototype = object.getprototypeof(o);
console.log(prototype === object.prototype); // return true
// 部分浏览器有效
var o2 = {};
console.log(o2.__proto__ === object.prototype); // return true

设置对象原型 object.create object.setprototypeof

object.create

返回一个对象，并设置它的原型

function foo () {}
 function bar () {}
 foo.prototype.foo = 'foo';
 bar.prototype = object.create(foo.prototype); 
 bar.prototype.constructor = bar; // 修正原型链的constructor
 var o = new bar();
 console.log(o.foo); // return foo;
 console.log(o instanceof bar); // return true

object.setprototypeof

直接设置对象的隐式原型__proto__

function foo () {}
 foo.prototype.name = 'foo';
 var o = object.create(null);
 object.setprototypeof(o, foo.prototype);
 console.log(o.name); // return foo

小结

对象具有许多考验开发者的一些知识点。能够完全理解并整理出来是不容易的。后续我会针对对象的继承做个详细的介绍。感谢你对的支持。