本篇文章给大家分享的是有关如何理解JavaScript中的原型与原型链，小编觉得挺实用的，因此分享给大家学习，希望大家阅读完这篇文章后可以有所收获，话不多说，跟着小编一起来看看吧。
原型和原型链关系贯穿JavaScript中的对象，而JavaScript中万物皆对象，所以原型和原型链是比较重要的概念，今天就带大家一起来看一看JavaScript中的原型与原型链。
一、了解概念(知道有这两个名词即可)
原型（
prototype）原型链（
__proto__）
二、了解从属关系
prototype => 函数的一个属性 ： 同时也是一个 对象{} (称之为原型对象亦可)
__proto__ => 对象Object的一个属性 ： 同时也是一个 对象{} (__proto__也就是[[Prototype]])注：对象的__proto__保存着该对象的构造函数的prototype
a.声明一个构造函数
function Test() { }
//prototype 是函数的一个属性
console.dir(Test);
console.log(Test.prototype);
// Test.prototype也是一个对象
console.log(typeof Test.prototype);b.声明一个对象
const test = new Test();
console.log(test);
//验证test为一个对象
console.log(typeof test);
//__proto__是对象的一个属性
console.log(test.__proto__);
console.log(Test.prototype);
//对象的__proto__属性存储着Test.prototype
console.log(test.__proto__ === Test.prototype);
// test.__proto__也是一个对象
console.log(typeof test.__proto__);function Test() {}
console.log(Test.prototype); //验证函数是否有prototype属性
let test = new Test();
console.dir(test.__proto__); //验证对象是否有__proto__属性
console.log(test.__proto__ === Test.prototype);//验证对象的__ptoto__是否保存着该对象的构造函数的prototype
console.log(Test.prototype.__proto__ === Object.prototype);//Test.prototype（是一个对象）的__proto__属性是否是对象的原型属性
console.log(Object.prototype.__proto__);//原型链的顶层没有__proto__属性 null三、深入认识原型链、原型和原型继承
function Test(){}
let test =new Test();
test.a= 10;
//test.__proto__ === test.constructor.prototype
test.__proto__.b1=11;//对象的__proto__属性存储着对象构造函数的prototype属性
Test.prototype.b2=11;
test.__proto__.__proto__.c1=12;
Object.prototype.c2=12;
console.log(test);
console.log(Test.prototype);
console.log(Object.prototype.__proto__);
四、总结
不建议直接用
__proto__访问。可以简单概括为以
prototype为原型节点,__proto__为原型链条。每个实例对象（
object）都有一个私有属性（称之为__proto__）指向它的构造函数的原型对象（prototype）。该原型对象也有一个自己的原型对象（__proto__），层层向上直到一个对象的原型对象为null。根据定义，null没有原型，并作为这个原型链中的最后一个环节。someObject.[[Prototype]]符号是用于指向someObject的原型,someObject.[[Prototype]]===__proto__(JavaScript的非标准但许多浏览器实现的属性)。Object.prototype属性表示Object的原型对象。被构造函数创建的实例对象的
[[Prototype]]指向func的prototype属性。
以上就是如何理解JavaScript中的原型与原型链，小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注编程网行业资讯频道。
