其实JavaScript中的继承,就是指的是一种机制,它允许一个对象(子对象)获取另一个对象(父对象)的属性和方法。这样的话子对象可以重用父对象的代码,同时还可以添加自己的特定功能。
JavaScript是使用原型继承的方式来实现对象之间的继承关系。
首先你肯定得知道一些基本概念:
对象:在JavaScript中,几乎所有的东西都是对象,包括数组、函数和日期等。每个对象都有属性和方法。
构造函数:构造函数是用于创建对象的特殊函数。它们通常以大写字母开头,用于创建具有相似属性和方法的对象。
原型:每个JavaScript对象都有一个原型(prototype)。原型是一个对象,它包含该对象共享的属性和方法。当我们访问对象的属性或方法时,JavaScript引擎会首先在对象本身中查找,如果找不到,就会去原型中查找。
举个简单的例子希望你能更好地理解JavaScript中的继承机制:
// 定义一个构造函数
function Animal(name) {
this.name = name;
}
// 在原型上定义一个方法
Animal.prototype.sayName = function() {
console.log("My name is " + this.name);
};
// 创建一个Animal对象
var animal = new Animal("Tom");
animal.sayName(); // 输出: My name is Tom
上面的例子,我们定义了一个名为Animal的构造函数。通过使用new Animal("Tom")创建了一个Animal对象,这个对象有一个名为name的属性和一个名为sayName的方法。我们将sayName方法添加到Animal.prototype中,以便所有通过Animal构造函数创建的对象都可以访问它。
再说一下继承的概念,在JavaScript里面,我们可以使用prototype来实现继承关系。
// 定义一个子构造函数
function Dog(name, breed) {
Animal.call(this, name); // 调用父构造函数
this.breed = breed;
}
// 创建一个原型链
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;
// 在子构造函数上定义一个方法
Dog.prototype.bark = function() {
console.log("Woof!");
};
// 创建一个Dog对象
var dog = new Dog("Max", "Labrador");
dog.sayName(); // 输出: My name is Max
dog.bark(); // 输出: Woof!
这个例子,我们定义了一个名为Dog的子构造函数。我们使用call方法在子构造函数中调用了父构造函数Animal,以确保子对象也具有name属性。然后,我们使用Object.create方法将Animal.prototype作为Dog.prototype的原型,从而建立了原型链。这意味着Dog.prototype继承了Animal.prototype的属性和方法。
接着,我们将Dog.prototype.constructor设置为Dog,以确保构造函数引用正确。这是因为在创建原型链时,Dog.prototype.constructor会被设置为Animal,我们需要将它恢复为Dog。
最后,我们在子构造函数Dog.prototype上定义了一个新的方法bark,这个方法是子对象特有的。
现在我们可以创建一个Dog对象dog,调用继承自Animal的sayName方法以及Dog自身定义的bark方法。
通过原型链的方式,Dog对象继承了Animal对象的属性和方法,还可以添加自己特定的功能。
需要注意的是,原型继承是基于对象的。这意味着当我们修改原型对象时,所有继承自该原型的对象也会受到影响。
除了原型继承,ES6(ECMAScript 2015)也引入了类和继承的概念,让JavaScript中的继承更加易于理解和使用。
class Animal {
constructor(name) {
this.name = name;
}
sayName() {
console.log("My name is " + this.name);
}
}
class Dog extends Animal {
constructor(name, breed) {
super(name);
this.breed = breed;
}
bark() {
console.log("Woof!");
}
}
var dog = new Dog("Max", "Labrador");
dog.sayName(); // 输出: My name is Max
dog.bark(); // 输出: Woof!
ES6中引入的class关键字简化了类的定义和继承。在上面的例子中,我们定义了Animal类和Dog类,通过extends关键字实现了继承关系。super关键字用于调用父类的构造函数。
JavaScript的继承机制使用原型链来实现对象之间的继承关系。通过继承,子对象可以获取父对象的属性和方法,并且可以添加自己的特定功能。原型继承是基于对象的,通过修改原型对象,所有继承自该原型的对象都会受到影响。ES6中引入的类和继承语法使得JavaScript中的继承更加易于理解和使用。