原型和原型链关系贯穿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__是否保存着该对象的构造函数的prototypeconsole.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__); /*逐层解析 * test{ * a = 10 * __proto__:test.prototype{ * b = 11 * __proto__:object.prototype{ * c = 12 * x__prototype__:null * } * } * } * * */
四、总结
不建议直接用 __proto__ 访问。
可以简单概括为以prototype为原型节点, __proto__为原型链条。
每个实例对象（object）都有一个私有属性（称之为 __proto__ ）指向它的构造函数的原型对象（prototype）。该原型对象也有一个自己的原型对象（__proto__），层层向上直到一个对象的原型对象为 null。根据定义，null 没有原型，并作为这个原型链中的最后一个环节。
 someobject.[[prototype]] 符号是用于指向 someobject 的原型,someobject.[[prototype]] === __proto__(javascript的非标准但许多浏览器实现的属性)。
object.prototype 属性表示 object 的原型对象。
 被构造函数创建的实例对象的 [[prototype]] 指向 func的 prototype 属性。
推荐视频：《javascript极速入门_玉女心经系列》、《独孤九贱(6)_jquery视频教程》
以上就是藕断丝连，javascript中的原型与原型链的详细内容。