一、前沿
-
JavaScript 的原型和原型链是该语言中一个重要且独特的概念,理解它们对于深入理解 JavaScript 的工作原理和编程范式至关重要。
-
原型(Prototype) 是 JavaScript 对象的一个内部属性,它指向另一个对象或者为 null。每个对象都可以拥有一个原型,通过原型,对象可以继承另一个对象的属性和方法。当我们访问一个对象的属性或方法时,如果对象本身没有该属性或方法,JavaScript 引擎会沿着原型链查找,直到找到匹配的属性或方法或者到达原型链的顶端。
-
原型链(Prototype Chain) 是由一系列对象组成的链表结构,用于实现对象之间的继承关系。每个对象都有一个原型,而原型本身也可以有自己的原型,从而形成了原型链。通过原型链,对象可以访问和继承原型链上的属性和方法。原型和原型链的工作原理如下:每个 JavaScript 对象都有一个内部属性 [[Prototype]],它指向该对象的原型。对象的原型也是一个对象,它也有自己的原型,这样就形成了一个原型链。
-
当我们访问一个对象的属性或方法时,如果对象本身没有该属性或方法,JavaScript 引擎会沿着原型链向上查找,直到找到匹配的属性或方法或者到达原型链的顶端。
-
原型链的顶端是 Object.prototype,它是 JavaScript 中所有对象的默认原型。
-
原型和原型链的概念使得 JavaScript 具有了灵活的继承机制,可以通过原型链实现对象之间的属性和方法的共享和继承。
-
理解原型和原型链对于理解 JavaScript 中的面向对象编程、继承和属性访问的机制非常重要。它们也是深入学习 JavaScript 高级概念和框架的基础。现在,我将从以下几方面进行梳理。
二、构造函数
在 JavaScript 中,构造函数是用来创建特定类型的对象的函数。构造函数通常与 new 关键字一起使用,用于实例化对象。构造函数的特点包括:
1、函数形式:构造函数本质上就是一个普通的 JavaScript 函数,但是它用来创建对象实例。
2、关键字new:通过使用 new 关键字调用构造函数,可以创建该构造函数所定义的对象类型的新实例。
3、this关键字:在构造函数内部,可以使用 this 关键字来引用将要创建的对象实例。以下是一个简单的构造函数的示例:
//定义一个构造函数
function Fun(name) {
this.name = name;
}
// 使用构造函数创建对象实例
const obj = new Fun("mhr");
三、原型对象
1、prototype 是【函数】的一个属性,并且创建函数默认加上prototype这个属性
2、prototype 是个对象通过代码进行验证:
四、原型链
1、显式原型:prototype 属性。这个属性指向一个对象,这个对象就是该函数的原型。当你使用 new 关键字来调用这个函数创建一个新对象时,这个新对象的原型就会指向该函数的 prototype 属性所指向的对象。
function Fun(name) {
this.name = name;
}
const obj = new Fun("Mhr");
console.log(obj.__proto__ === Fun.prototype); // true
在这个例子中,Fun.prototype 就是 obj 对象的显示原型。
2、隐式原型:每个对象都有一个指向它的构造函数的原型的引用,这个引用被称为对象的隐式原型(也可以通过__proto__属性来访问)。当你访问一个对象的属性或方法时,如果对象本身没有该属性或方法,JavaScript 引擎会沿着对象的隐式原型链向上查找,直到找到匹配的属性或方法或者到达原型链的顶端(Object.prototype)。
function Fun(name) {
this.name = name;
}
const obj = new Fun("Mhr");
console.log(obj.__proto__ === Fun.prototype); // true
在这个例子中,obj.proto 就是 Fun.prototype,它是obj对象的隐式原型。
3、原型链
是由一系列对象组成的链表结构,用于实现对象之间的继承关系。也就是通过隐式原型__proto__形成的链表关系。下面通过一张关系图来表述它们之间的关系。
4、原型链的终点
通过上面的图解可以看到,最终原型链会指向null,也是原型链的终点,即Object.prototype.__proto__指向null。
5、所有函数都是Function()的实例,所以它们的__proto__都指向Function.prototype。
五、总结
1、构造函数通常与 new 关键字一起使用,用于实例化对象。
2、prototype是【函数】的一个属性,并且创建函数事默认添加上这个属性
3、prototype是一个【对象】
4、__proto__是【对象】的一个属性,并且指向构造函数的prototype
5、原型链的终点为null,即Object.prototype.__proto__指向null
6、所有函数都是Function()的实例,所以它们的__proto__都指向Function.prototype