» JavaScript快速入门 » 2. 高级篇 » 2.2 Prototypes 原型

Prototypes 原型

在JavaScript中,每个对象都有一个原型,对象可以从其原型继承属性和方法。 由于函数本质上也是对象,所以它们也有原型。

// 'Person'对象的构造函数
function Person(name, age) {
  this.name = name;
  this.age = age;
}

// 将方法添加到 'Person' 构造函数的原型上
Person.prototype.sayHello = function () {
  console.log('Hello, my name is ' + this.name + ' and I am ' + this.age + ' years old.');
};

const person1 = new Person('Alice', 25);
const person2 = new Person('Bob', 30);

// 调用从原型继承的 'sayHello' 方法
person1.sayHello(); // 输出: Hello, my name is Alice and I am 25 years old.
person2.sayHello(); // 输出: Hello, my name is Bob and I am 30 years old.

继承

可以通过原型实现继承。

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

Animal.prototype.sayName = function () {
  console.log('I am ' + this.name);
};

function Dog(name, breed) {
  // 使用 'call' 调用父构造函数
  Animal.call(this, name);
  
  // 特定于 Dog 的附加属性
  this.breed = breed;
}

// 设置原型链:Dog.prototype 继承自 Animal.prototype
Dog.prototype = Object.create(Animal.prototype);


// 向 Dog 的原型添加特定于 Dog 的方法
Dog.prototype.bark = function () {
  console.log('Woof! Woof!');
};

// 创建实例
const myDog = new Dog('Buddy', 'Golden Retriever');
myDog.sayName(); // 输出: I am Buddy
myDog.bark();    // 输出: Woof! Woof!

Object.create() 静态方法使用已有对象作为新创建的对象的原型,从而创建一个新对象。

代码挑战

CircleRectangle 的原型中覆盖 calculateArea 方法,以计算每种形状特定的面积。

Loading...
> 此处输出代码运行结果
上页
下页