小笔记:JS原型和原型链

JS原型?

有句简约直观的形貌:”原型是Javascript中的继续的基本,JavaScript的继续就是基于原型的继续”。

在JavaScript中,原型也是一个对象,经由过程原型能够完成对象的属性继续,JavaScript的对象中都包括了一个”[[Prototype]]”内部属性,这个属性所对应的就是该对象的原型。

“[[Prototype]]”作为对象的内部属性,是不能被直接接见的。所以为了轻易检察一个对象的原型,Firefox和Chrome中供应了__proto__这个非规范(不是一切浏览器都支撑)的接见器(ECMA引入了规范对象原型接见器”Object.getPrototype(object)”)。在JavaScript的原型对象中,还包括一个”constructor”属性,这个属性对应建立一切指向该原型的实例的组织函数。

提到原型,我们必需要了解下Object和Function:

Object和Function都是JS的自带函数,Object继续自身,Funtion继续自身,Object和Function互相是继续对方,也就是说Object和Function都既是函数也是对象。
//instanceof 就是推断一个实例是不是属于某种范例
console.log(Function instanceof Object); // true
console.log(Object instanceof Function); // true

前面提到为了轻易检察一个对象的原型,引入”__proto__”,那末Function和Object对应的原型是什么?

console.log(Function.__proto__); // ƒ () { [native code] }
console.log(Object.__proto__);  // ƒ () { [native code] }
console.log(Function.__proto__==Function.prototype); //true
console.log(Object.__proto__==Function.prototype); //true

所以,Object 是 Function的实例,而Function是它自身的实例。

说到Function和Object的互相继续和对应原型,能够以为有点头大,那我们先放一下,让我们先了解下js对象的一些小学问

一般对象和函数对象

万物皆对象,js中对象实在分为函数对象和一般对象。
函数对象能够建立一般对象,一般对象没法建立函数对象,所以一般对象权益最低。

//一般对象
let str=new String();
let num=new Number();
let obj=new Object();
//....

一般经由过程new Function建立的对象都是函数对象,其他都是一般对象(一般经由过程Object建立),能够经由过程typeof来推断。

function f1(){}; // ==  var f1 = new Function();

function f2(a,b){
  alert(a+b);
}
//等价于
var f2 = new Function(a,b,"alert(a+b)");

说那末多,实在记着下面的内容就好了:

1.每一个函数对象都有一个prototype属性,然则一般对象是没有的;prototype下面又有个construetor,指向这个函数。

2.每一个对象都有一个名为_proto_的内部属性,指向它所对应的组织函数的原型对象,原型链基于_proto_;

让我们建一个一般函数,能够看到:

var obj = {};
  console.log(obj.prototype); //undefined
  console.log(obj instanceof Object); //true
  console.log(obj.__proto__ === Object.prototype) //true
  console.log(Object === Object.prototype.constructor) //true
  console.log(Object.prototype.constructor) //function Object()
 console.log(Object.prototype.__proto__); //null

《小笔记:JS原型和原型链》

  • obj确实没有prototype属性
  • obj是Object的实例
  • obj的__proto__指向Object的prototype
  • Object.prototype.constructor指向Object自身

再建一个函数对象:

function Fun(){};
var f1 = new Fun();
console.log(f1.prototype); //undefined
console.log(f1 instanceof Fun); //true
console.log(f1.__proto__ === Fun.prototype); //true
console.log(Fun=== Fun.prototype.constructor) ;//true
console.log(Fun.prototype.__proto__ === Object.prototype) ;//true
console.log(Object.prototype.__proto__); //null

《小笔记:JS原型和原型链》

  • Fun是函数对象,f1照样一般对象
  • f1是Fun的实例
  • Fun的原型prototype的__proto__指向Object的原型prototype,而Object的原型prototyped的__proto__指向null;

原型链

ECMscript中形貌了原型链的观点,并将原型链作为js完成继续的重要要领。
基本思路:应用原型,让一个援用类继续另一个援用类的属性和要领。
组织函数、原型和实例的关联:
    每一个组织函数都有一个原型对象,原型对象都包括一个指向组织函数的指针,而实例都包括一个指向原型对象的内部指针。
    

实在,avascript中,每一个对象都邑在内部天生一个proto 属性,当我们接见一个对象属性时,假如这个对象不存在就回去proto 指向的对象内里找,一层一层找下去,这就是javascript原型链的观点。

f1.__proto__ ==> Fun.prototype ==> Fun.prototype.__proto__ ==> Object.prototype ==> Object.prototype.__proto__ ==> null

JS天下中一切的东西都是对象,一切的东西都由Object衍生而来, 所以一切东西原型链的尽头指向null

    原文作者:D阿伟
    原文地址: https://segmentfault.com/a/1190000019239824
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞