博客

Javascript prototype 属性

  • Post category:JavaScript

以下是关于JavaScript prototype属性的完整攻略。

JavaScript prototype属性

JavaScript prototype属性是每个函数都有的一个属性，它指向一个对象，这个对象包含了该函数的所有实例共享的属性和方法。我们可以使用prototype属性来添加新的属性和方法，从而实现代码的复用。

下面是一个使用prototype属性的示例：

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", 30);
var person2 = new Person("Jane", 25);

person1.sayHello(); // 输出：Hello, my name is John and I am 30 years old.
person2.sayHello(); // 输出：Hello, my name is Jane and I am 25 years old.

在上面的示例中，我们定义了一个Person()函数，用于创建一个人的对象。在函数中，我们使用this关键字定义了name和age两个属性。然后，我们使用prototype属性添加了一个sayHello()方法，用于输出人的信息。最后我们创建了两个Person对象，分别输出它们的信息。

示例

下面是两个使用prototype属性的示例：

示例1：添加新的方法

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

Animal.prototype.sayName = function() {
  console.log("My name is " + this.name);
};

Animal.prototype.run = function() {
  console.log(this.name + " is running");
};

var dog = new Animal("Dog");
var cat = new Animal("Cat");

dog.sayName(); // 输出：My name is Dog
cat.sayName(); // 输出：My name is Cat

dog.run(); // 输出：Dog is running
cat.run(); // 输出：Cat is running```

在上面的示例中，我们定义了一个Animal()函数，用于创建一个动物的对象。在函数中，我们使用this关键字定义了name属性。然后，我们使用prototype属性添加了一个sayName()方法，用于输出动物的名字，以及一个run()方法，用于输出动物正在奔跑。最后，我们创建了两个Animal对象，分别输出它们的名字和奔跑的信息。

### 示例2：添加新的属性

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

Car.prototype.color = "black";

var car1 = new Car("Toyota", "Camry", 2021);
var car2 = new Car("Honda", "Civic", 2022);

console.log(car1.color); // 输出：black
console.log(car2.color); // 输出：black

car1.color = "red";

console.log(car1.color); // 输出：red
console.log(car2.color); // 输出：black

在上面的示例中，我们定义了一个Car()函数，用于创建一个汽车的对象。在函数中，我们使用this关键字定义了make、model和year三个属性。然后，我们使用prototype属性添加了一个color属性，用于表示汽车的颜色。最后，我们创建了两个Car对象，分别输出它们的颜色。我们还修改了car1的颜色为红色，再次输出它的颜色，以及car2的颜色。

总结

JavaScript prototype属性是每个函数都有的一个属性，它指向一个对象，这个对象包含了该函数的所有实共享的属性和方法。我们可以使用prototype属性来添加新的属性和方法，从而实现代码的复用。在实际开发中，我们可以使用prototype属性来编写一些实用的函数，例如添加新的方法、添加新的属性等。

Tags: