js继承的三种方法

JavaScript继承是面向对象编程的一个重要特性,它允许我们创建一个新的类,从现有的类中继承属性和方法,在JavaScript中,有几种不同的继承方式,包括原型链继承、构造函数继承、组合继承和寄生组合继承等,下面我们将详细介绍这些继承方式。

1、原型链继承

原型链继承是JavaScript中最基本的继承方式,在原型链继承中,我们创建一个新的对象,并将其原型设置为现有对象的实例,这样,新对象就可以访问现有对象的属性和方法,原型链继承的优点是简单易实现,但缺点是共享所有实例属性,可能导致命名冲突。

function Parent() {
  this.name = 'parent';
}
Parent.prototype.sayName = function() {
  console.log(this.name);
};
function Child() {
  this.age = 18;
}
Child.prototype = new Parent();
var child = new Child();
child.sayName(); // 输出 'parent'

2、构造函数继承

构造函数继承是通过在子类构造函数中调用父类构造函数来实现的,这种方法可以实现属性和方法的私有性,避免了原型链继承中的命名冲突问题,构造函数继承不能实现方法的复用,每个子类都需要重新定义方法。

function Parent() {
  this.name = 'parent';
}
Parent.prototype.sayName = function() {
  console.log(this.name);
};
function Child() {
  Parent.call(this); // 调用父类构造函数
  this.age = 18;
}
var child = new Child();
child.sayName(); // 输出 'parent'

3、组合继承

组合继承是将原型链继承和构造函数继承结合起来的一种继承方式,它将父类的实例作为子类的属性,这样既实现了方法的复用,又避免了命名冲突问题,组合继承会导致子类实例具有两份相同的属性,增加了内存占用。

function Parent() {
  this.name = 'parent';
}
Parent.prototype.sayName = function() {
  console.log(this.name);
};
function Child() {
  Parent.call(this); // 调用父类构造函数
  this.age = 18;
}
Child.prototype = new Parent(); // 将父类实例作为子类属性
Child.prototype.constructor = Child; // 修正构造函数指向
var child = new Child();
child.sayName(); // 输出 'parent'

4、寄生组合继承

js继承的三种方法

寄生组合继承是对组合继承的一种优化,它通过在子类原型上添加一个代理对象来拦截对父类原型的访问,这样,我们就可以只继承父类的静态属性和方法,而不包括实例属性,这样既实现了方法的复用,又避免了内存浪费,寄生组合继承需要更多的代码实现。

function Parent() {
  this.name = 'parent';
}
Parent.prototype.sayName = function() {
  console.log(this.name);
};
function Child(name, age) {
  var self = this; // 保存引用,防止丢失上下文
  self.name = name || 'child'; // 设置子类属性
  self.age = age || 18; // 设置子类属性
}
Child.prototype = Object.create(Parent.prototype); // 创建代理对象,拦截对父类原型的访问
Child.prototype.constructor = Child; // 修正构造函数指向
Child.prototype.sayAge = function() { // 添加子类方法,不包含在父类原型中
  console.log(this.age);
};

js继承的三种方法

JavaScript有多种继承方式,包括原型链继承、构造函数继承、组合继承和寄生组合继承等,每种继承方式都有其优缺点,我们需要根据实际需求选择合适的继承方式,在实际开发中,我们通常会使用组合继承或寄生组合继承来实现类的继承。

内容声明:本文中引用的各种信息及资料(包括但不限于文字、数据、图表及超链接等)均来源于该信息及资料的相关主体(包括但不限于公司、媒体、协会等机构》的官方网站或公开发表的信息,内容仅供参考使用!本站为非盈利性质站点,本着免费分享原则,发布内容不收取任何费用也不接任何广告! 【若侵害到您的利益,请联系我们删除处理。投诉邮箱:i77i88@88.com】

本文链接:http://7707.net/JavaScript/202401133712.html

发表评论

提交评论

评论列表

还没有评论,快来说点什么吧~