JavaScript: Functions and PrototypesJavaScript 函数与原型

---

学习目标

观看本视频后，您将能够：

• 描述 JavaScript 函数。
• 描述 JavaScript 原型。
• 演示如何创建自定义对象。
  

---

JavaScript 函数

函数的定义与结构

函数 是一段代码块，声明后可在脚本的任意位置调用。

函数的组成部分：

1. function 关键字。
2. 函数名。
3. 参数列表：用括号 () 包裹，参数是可选的。
4. 函数体：用大括号 {} 包裹的逻辑代码块。
5. 返回语句 (可选)：通过 return 将值返回给调用者。

---

函数示例：加法与拼接

function add(a, b) {
  return a + b; // 返回数字相加或字符串拼接的结果
}

• 参数类型：不需要显式声明参数的数据类型，类型由传递的值决定。
• 返回类型：由返回值的类型决定。
• 行为：
  • 如果参数为数字，则执行加法。
  • 如果参数为字符串，则执行拼接操作。

---

创建对象的函数

通过函数构造对象时，可以使用 this 关键字引用当前实例。

示例：Car 对象

function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}

var car = new Car("Toyota", "Corolla", 2020);
console.log(car.make); // 输出 "Toyota"

• this 关键字：
  • 引用当前对象实例。
  • 区分全局变量与局部变量。
• 添加方法：

Car.prototype.getName = function () {
  return `${this.make} ${this.model} ${this.year}`;
};
console.log(car.getName()); // 输出 "Toyota Corolla 2020"

---

JavaScript 原型

原型的定义

原型 (Prototype) 是用于定义对象共享属性和方法的一种机制。

• 继承：所有通过 new 关键字创建的对象都从其原型继承属性和方法。
• 灵活性：通过修改原型，可以为对象添加新的属性或方法，而无需修改构造函数。

---

原型的特点

1. 动态继承：
   • 改变原型的属性或方法，所有使用该原型的对象都会自动继承这些更改。
2. 便捷扩展：
   • 通过一次调用即可为对象添加新的属性或方法。

---

原型的示例

为 Car 对象添加方法

Car.prototype.getAge = function () {
  return new Date().getFullYear() - this.year;
};

• 效果：
  • 所有 Car 的实例都会自动继承 getAge 方法。
  • 无需修改已有对象。

使用原型的优势

• 减少重复：所有实例共享原型中的方法，节省内存。
• 动态性：随时可以为现有对象添加新功能。

---

自执行函数 (Self-Executing Functions)

定义

自执行函数 是一种立即运行的匿名函数，其内部的变量和函数与外部代码隔离。

语法：

(function () {
  console.log("自执行函数已运行");
})();

• 特点：
  • 立即执行，不需要显式调用。
  • 内部变量与函数不会污染全局命名空间。
• 用途：
  • 初始化数据。
  • 声明 DOM 元素。

---

总结

通过这些概念，您可以更高效地构建和管理 JavaScript 对象，同时利用函数与原型优化代码结构和性能！ 🚀