深入了解JavaScript的原型链和继承机制

JavaScript原型继承与对象概述

在JavaScript中,对象和继承机制与许多其他语言使用的基于类的模型有着显著的区别。在本节中,我们将提供一个基本概述,以便您能够理解JavaScript中的原型继承与对象的基本概念。

对象的定义

JavaScript对象本质上只是一组称为“属性”的键值对集合。例如,以下对象表示一个用户:

<code>const user = { username: "wiener", userId: 01234, isAdmin: false }</code>

您可以使用点表示法或括号表示法访问对象的属性:

<code>user.username // "wiener" user['userId'] // 01234</code>

除了数据,属性还可以包含可执行函数,这种情况下,该函数被称为“方法”:

<code>const user = { username: "wiener", userId: 01234, exampleMethod: function(){ // do something } }</code>

需要注意的是,JavaScript中几乎所有内容都是对象。在这些材料中,“对象”一词指所有实体,而不仅仅是对象字面量。

JavaScript中的原型

图片[1]-深入了解JavaScript的原型链和继承机制-山海云端论坛

JavaScript中的每个对象都与另一个对象链接在一起,这称为它的原型。默认情况下,JavaScript会自动为新对象分配其中一个内置原型。例如,字符串会自动分配内置的String.prototype。

<code>let myObject = {}; Object.getPrototypeOf(myObject); // Object.prototype let myString = ""; Object.getPrototypeOf(myString); // String.prototype let myArray = []; Object.getPrototypeOf(myArray); // Array.prototype let myNumber = 1; Object.getPrototypeOf(myNumber); // Number.prototype</code>

原型链

每个对象的原型都是另一个对象,它也应该有自己的原型,依此类推。因此,JavaScript中的原型形成了一个链,最终会回溯到顶层的Object.prototype,其原型为null。关键是,对象不仅继承其直接原型的属性,还继承其原型链中上层所有对象的属性。

图片[2]-深入了解JavaScript的原型链和继承机制-山海云端论坛

使用__proto__访问对象的原型

每个对象都有一个特殊的属性__proto__,您可以使用它来访问其原型。虽然这个属性没有正式标准化的名称,但__proto__是大多数浏览器使用的事实标准。您可以使用它来读取原型及其属性,并在必要时重新分配它们。

<code>username.__proto__ username['__proto__']</code>

您甚至可以链式引用__proto__,以此沿着原型链向上遍历。

修改原型

虽然通常被认为是不好的做法,但可以修改JavaScript的内置原型。这意味着开发人员可以定制或覆盖内置方法的行为,甚至可以添加新的方法来执行有用的操作。

<code>String.prototype.removeWhitespace = function(){ // 删除前导和尾随空白 }</code>

由于原型继承的关系,所有字符串都可以访问到这个方法:

<code>let searchTerm = " example "; searchTerm.removeWhitespace(); // "example"</code>

以上是JavaScript中原型继承与对象概述的基本概念。理解这些概念将有助于您更好地理解JavaScript的工作原理。

© 版权声明
THE END
喜欢就支持一下吧
点赞13 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容