带你读《现代Javascript高级教程》七、原型和原型链(2)

简介: 带你读《现代Javascript高级教程》七、原型和原型链(2)

带你读《现代Javascript高级教程》七、原型和原型链(1)https://developer.aliyun.com/article/1349650?groupCode=tech_library


2.构造函数和原型对象

构造函数是用于创建对象的特殊函数。它通常以大写字母开头,通过使用 new 关键字来调用构造函数,我们可以创建一个新的对象实例。构造函数在创建对象时可以执行一些初始化操作,并为对象添加属性和方法。

 

原型对象是构造函数的一个属性,它是一个普通的 JavaScript 对象。原型对象上的属性和方法可以被通过构造函数创建的对象实例所继承。通过将属性和方法定义在原型对象上,我们可以实现方法的共享和节省内存空间。

 

让我们通过一个示例来说明构造函数和原型对象的概念以及如何使用它们来创建对象和共享方法:

 

// 构造函数function Person(name, age) {
  this.name = name;
  this.age = age;}
// 在原型对象上添加方法Person.prototype.sayHello = function() {
  console.log("Hello, my name is " + this.name + " and I am " + this.age + " years old.");};
// 创建对象实例var person1 = new Person("John", 25);var person2 = new Person("Alice", 30);
// 调用共享的方法
person1.sayHello(); // 输出: "Hello, my name is John and I am 25 years old."
person2.sayHello(); // 输出: "Hello, my name is Alice and I am 30 years old."

 

在这个示例中,我们定义了一个构造函数 Person,它接受 name age 参数,并将它们赋值给对象的属性。

 

然后,我们通过在原型对象 Person.prototype 上添加一个方法 sayHello,使得通过 Person 构造函数创建的对象实例可以访问该方法。我们创建了两个对象实例 person1 person2,并分别调用了共享的方法 sayHello

 

以下是一个简单的构造函数和原型对象的流程图示意图:


 

+----------------------------------+
|           Constructor            |
|                                  |
|  +--------------------------+    |
|  |   Prototype Properties   |    |
|  +--------------------------+    |
|                                  |
|  - Property: name               |
|  - Property: age                |
|  - Method: sayHello()           |
|                                  |
+----------------------------------+
        ^
        |
        |
+----------------------------------+
|          Object Instance         |
|                                  |
|  +--------------------------+    |
|  |     Instance Properties   |    |
|  +--------------------------+    |
|                                  |
|  - Property: name               |
|  - Property: age                |
|                                  |
+----------------------------------+

 

在这个示意图中,构造函数和原型对象之间存在关联,构造函数拥有原型对象的引用。通过构造函数,我们可以创建对象实例,并且这些实例可以通过原型对象继承原型上的属性和方法。


带你读《现代Javascript高级教程》七、原型和原型链(3)https://developer.aliyun.com/article/1349648?groupCode=tech_library

相关文章
|
2月前
|
JavaScript 前端开发
如何在JavaScript中实现基于原型的继承机制
【8月更文挑战第14天】如何在JavaScript中实现基于原型的继承机制
25 0
|
3月前
|
JavaScript
vue中使用 HotKeys.js 教程(按键响应、快捷键开发)
vue中使用 HotKeys.js 教程(按键响应、快捷键开发)
148 0
|
7天前
|
JSON JavaScript 前端开发
js原型继承|26
js原型继承|26
|
3天前
|
JavaScript 前端开发
JavaScript prototype(原型对象)
JavaScript prototype(原型对象)
9 0
|
1月前
|
JavaScript 前端开发
JavaScript基础知识-原型(prototype)
关于JavaScript基础知识中原型(prototype)概念的介绍。
29 1
|
2月前
|
JavaScript NoSQL 前端开发
|
2月前
|
JavaScript 前端开发
JavaScript中什么是原型?有什么用?
JavaScript中什么是原型?有什么用?
15 1
|
2月前
|
JavaScript 前端开发 Java
什么是JavaScript原型对象
【8月更文挑战第2天】什么是JavaScript原型对象
50 9
|
2月前
|
开发者 图形学 iOS开发
掌握Unity的跨平台部署与发布秘籍,让你的游戏作品在多个平台上大放异彩——从基础设置到高级优化,深入解析一站式游戏开发解决方案的每一个细节,带你领略高效发布流程的魅力所在
【8月更文挑战第31天】跨平台游戏开发是当今游戏产业的热点,尤其在移动设备普及的背景下更为重要。作为领先的游戏开发引擎,Unity以其卓越的跨平台支持能力脱颖而出,能够将游戏轻松部署至iOS、Android、PC、Mac、Web及游戏主机等多个平台。本文通过杂文形式探讨Unity在各平台的部署与发布策略,并提供具体实例,涵盖项目设置、性能优化、打包流程及发布前准备等关键环节,助力开发者充分利用Unity的强大功能,实现多平台游戏开发。
53 0
|
2月前
|
JavaScript 前端开发 开发者
揭开JavaScript的神秘面纱:原型链背后隐藏的继承秘密
【8月更文挑战第23天】原型链是JavaScript面向对象编程的核心特性,它使对象能继承另一个对象的属性和方法。每个对象内部都有一个[[Prototype]]属性指向其原型对象,形成链式结构。访问对象属性时,若当前对象不存在该属性,则沿原型链向上查找。
27 0
下一篇
无影云桌面