高级 JavaScript 进阶指南：掌握面向对象、构造函数、原型、实例与原型链

2023-11-21 08:07:38

JavaScript 面向对象编程简介

JavaScript 作为一门强大的编程语言，其面向对象编程功能使开发人员能够创建复杂且可重用的代码。面向对象编程的基本思想是将对象作为程序的基本单位，每个对象都有自己的数据和行为。通过创建和使用对象，开发人员可以将代码组织成模块化和易于维护的形式。

构造函数和实例

构造函数是创建对象的蓝图，它定义了对象的属性和方法。当使用 new 运算符调用构造函数时，就会创建一个新的对象。这个新的对象是构造函数的实例，它拥有构造函数中定义的所有属性和方法。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

const person1 = new Person('John', 30);
const person2 = new Person('Mary', 25);

console.log(person1.name); // John
console.log(person2.age); // 25

原型和原型链

原型是每个构造函数都拥有的一个特殊对象，它包含了该构造函数所有实例共享的属性和方法。当一个对象被创建时，它会自动继承其构造函数的原型。这意味着对象可以访问原型中定义的所有属性和方法，即使这些属性和方法没有在对象的构造函数中定义。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};

const person1 = new Person('John', 30);
person1.greet(); // Hello, my name is John and I am 30 years old.

原型链是指一个对象可以访问的所有原型的链条。当一个对象尝试访问一个属性或方法时，它会首先在自己的属性中查找。如果找不到，它会沿着原型链向上查找，直到找到该属性或方法为止。

原型链继承

原型链继承是一种实现继承的方式，它允许子对象访问父对象的属性和方法。要实现原型链继承，只需将子对象的原型设置为父对象的实例即可。

function Parent(name) {
  this.name = name;
}

Parent.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name}.`);
};

function Child(name, age) {
  Parent.call(this, name);
  this.age = age;
}

Child.prototype = new Parent();

const child1 = new Child('John', 30);
child1.greet(); // Hello, my name is John.