本文实例分析了JS继承的用法。分享给大家供大家参考。具体分析如下:
继承 : 子类不影响父类,子类可以继承父类的一些功能 ( 代码复用 )
属性的继承 : 调用父类的构造函数 call
方法的继承 : for in : 拷贝继承 (jquery也是采用拷贝继承extend)
1. 拷贝继承
function Person (name){
this.name = name;
}
Person.prototype.showName =function (){
alert(this.name);
}
function Worker(name,job){
Person.call(this,n
JavaScript中的继承是面向对象编程的重要概念,它允许子类继承父类的属性和方法,从而实现代码的重用和模块化。在JavaScript中,继承主要可以通过三种方式实现:属性继承、call方法继承和原型链继承。
1. **属性继承**
属性继承通常涉及到调用父类的构造函数来初始化子类的实例。例如,在`Worker`构造函数中,通过`Person.call(this, name)`,将父类`Person`的构造函数作用域应用到当前`Worker`实例上,确保`name`属性被正确设置。这种继承方式使得子类可以拥有父类的部分特性,而不影响父类自身。
```javascript
function Person(name) {
this.name = name;
}
Person.prototype.showName = function() {
alert(this.name);
}
function Worker(name, job) {
Person.call(this, name); // 继承Person的属性
this.job = job;
}
```
2. **call方法继承**
`call`方法可以改变函数的执行上下文,让函数的行为如同在其他对象的作用域内调用。`for...in`循环常用于拷贝对象的属性,实现类似jQuery的`extend`功能。这种拷贝继承可以创建一个新对象,包含源对象的所有可枚举属性,但不会创建引用。
```javascript
function extend(obj1, obj2) {
for (var i in obj2) {
obj1[i] = obj2[i];
}
}
// 示例中未使用,但在实际项目中可能会用到
// var coder = new Worker('magicfly', 'frontEnd');
// extend(coder, someOtherObject);
```
3. **类继承**
JavaScript中没有真正的类,但可以通过模拟类继承实现类似的功能。这里使用的是代理构造函数(`F`)来避免父类不必要的属性被继承。`Worker.prototype`被设置为`F.prototype`的一个新实例,`F.prototype`又继承自`Person.prototype`,这样就实现了类继承。
```javascript
function Person(name) {
this.name = name;
}
Person.prototype.showName = function() {
alert(this.name);
}
function Worker(name, job) {
Person.call(this, name);
this.job = job;
}
// 使用代理构造函数避免继承不必要的属性
function F() {}
F.prototype = Person.prototype;
Worker.prototype = new F();
```
4. **原型继承**
原型继承是JavaScript中实现继承的一种常见方式,通过对象的原型链来共享属性和方法。`cloneObj`函数创建了一个新对象,其原型指向`a`的原型,实现了对`a`的浅复制。
```javascript
var a = {name: '小明'};
var b = cloneObj(a);
b.name = '小强';
// 输出 "小强" 和 "小明"
alert(b.name);
alert(a.name);
function cloneObj(obj) {
var F = function() {};
F.prototype = obj;
return new F();
}
```
适用情况:
- **拷贝继承**:适用于任何需要复制对象并可能修改副本的情况,无论对象是否通过`new`创建。
- **类继承**:适用于需要模拟类结构,且希望避免继承父类不必要的属性的情况。
- **原型继承**:适用于处理无`new`对象的情况,通过原型链共享属性和方法。
总结,JavaScript的继承机制提供了多种实现方式,可以根据具体需求选择合适的策略。了解这些继承模式及其应用场景,有助于编写更加灵活和可维护的代码。在实际开发中,还可以结合使用ES6的类和继承语法,以获得更简洁、清晰的代码结构。