Java程序员从笨鸟到菜鸟(三十五)javascript的原型对象与原型链

一、prototype和_proto_的区别
这里写图片描述

大多数情况下,_proto_可以理解为构造器的原型_proto_ == constructor.prototype

var a = {};
console.log(a.prototype); // undefined
console.log(a._proto_); // object {}

var b = function() {}
console.log(b.prototype); // b {}
console.log(b._proto_); // function() {}

_proto_属性指向
取决于对象创建的实现方式,下图有三种常见方式创建对象

  1. 字面量方式

    var a = {};
    这里写图片描述

  2. 构造器方式
    var A = function() {};
    var a = new A{};
    这里写图片描述

3.Object.create方式

var a1 = {};
var a2 = Object.create(a1);
这里写图片描述

代码调试

// 1.字面量方式
var a = {};
console.log(a._proto_); // Object {}
console.log(a._proto_ === a.constructor.prototype); // true

// 2.构造器方法
var A = function() {};
var a = new A();
console.log(a._proto_); // A {}
console.log(a._proto_ ===a.constructor.prototype); // true

// Object.create()
var a1 = {a:1};
var a2 = Object.create(a1);
console.log(a2._proto_); // Object {a:1}
console.log(a.__proto__ === a.constructor.prototype); // false

原型链

由于_proto_是任何对象都有的属性,所以会形成_proto_连起来的链条,递归访问_proto_必须最终到头,并且值是null,当js引擎查找对象的属性时,先查找对象本身是否存在该属性,如果不存在,会在原型链上查找,但不会查找自身的prototype

var A = function() {};
var a = new A {};
这里写图片描述
代码图解

var A = function() {};
var a = new A();
console.log(a._proto_); // A {} (即构造器function A的原型对象)
console.log(a._proto_._proto_); // Object {} (即构造器function Object的原型对象)
console.log(a._proto_._proto_._proto_); // null

原文传送门:https://www.cnblogs.com/shuiyi/p/5305435.html

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值