JavaScript里实现继承的几种方式

这篇具有很好参考价值的文章主要介绍了JavaScript里实现继承的几种方式。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

JavaScript 中的继承可以通过以下几种方式来实现:

1、原型链继承:通过将子类的原型对象指向父类的实例来实现继承。这种方式的优点是实现简单,缺点是父类的私有属性和方法子类是不能访问的。

function Parent() {
  this.name = 'parent';
  this.age = 30;
}
Parent.prototype.sayName = function() {
  console.log(this.name);
}

function Child() {
  Parent.call(this);
}
Child.prototype = new Parent();
Child.prototype.constructor = Child;

 2、借用构造函数继承:通过在子类的构造函数中调用父类的构造函数来实现继承。这种方式的优点是子类可以访问父类的私有属性和方法,缺点是每个子类实例都会有一份父类实例的拷贝。

function Parent() {
  this.name = 'parent';
  this.age = 30;
}
Parent.prototype.sayName = function() {
  console.log(this.name);
}

function Child() {
  Parent.call(this);
}

 3、组合继承:通过结合原型链继承和借用构造函数继承的优点来实现继承。这种方式的优点是既可以访问父类的私有属性和方法,又可以避免每个子类实例都有一份父类实例的拷贝。

function Parent() {
  this.name = 'parent';
  this.age = 30;
}
Parent.prototype.sayName = function() {
  console.log(this.name);
}

function Child() {
  Parent.call(this);
}
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

 4、ES6 Class继承:通过使用ES6 class语法来实现继承。

class Parent {
  constructor() {
    this.name = 'parent';
    this.age = 30;
  }
  sayName() {
    console.log(this.name);
  }
}

class Child extends Parent {
  constructor() {
    super();
  }
}

 

JavaScript 中的继承可以通过多种方式来实现,如原型链继承、借用构造函数继承、组合继承、ES6 Class继承等。每种方式都有各自的优缺点,需要根据具体需求来选择使用。

另外,对于JavaScript中的继承,还有一些需要注意的点:

  • 在原型链继承和组合继承中,子类的原型对象会继承父类的原型对象,这意味着子类和父类共享同一个原型对象,如果父类原型对象上的属性和方法发生改变,子类也会受到影响。
  • 在借用构造函数继承和组合继承中,子类的实例会有一份父类实例的拷贝,这意味着每个子类实例都有自己的父类实例,不会受到其他实例的影响。
  • 在ES6 Class继承中,父类的静态方法和属性会被继承到子类,子类的实例也会继承父类的实例方法和属性。

选择合适的继承方式和组合使用,可以帮助我们更好的组织代码,提高代码的可维护性。文章来源地址https://www.toymoban.com/news/detail-421980.html

到了这里,关于JavaScript里实现继承的几种方式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 前端技术中的几种居中方式

    1、使用margin:0px auto可以使盒子水平居中,但要设置宽度。 2、在父元素中使用text-align:center可以将子元素设置水平居中,但子元素必须为行内元素或行内块元素。 3、使用绝对定位,父相子绝的原则,在子元素中设置left:50%和transform:translateX(-50%)。可以不设置宽高。       这里

    2024年02月04日
    浏览(44)
  • 一文道破将bean注入到Spring中的几种方式

    前言: 前两天有学妹问我如何将bean注入到Spring中,虽问题较简单,但还是写此文以告之。 在Java的Spring框架中,将bean注入到容器中是核心概念之一,这是实现依赖注入的基础。Spring提供了多种方式来将bean注入到容器中。 写此文,同时也希望这篇文章能帮助到各位路过的大佬

    2024年04月15日
    浏览(43)
  • 【java】对ArrayList中的元素进行排序的几种方式

    一、使用Collections工具类 1、对基本类型排序 通过 Collections.sort() 对基本类型排序默认是以升序排序 2、对字符串类型排序 对字符串类型排序默认按照首字母a-z排序 3、对对象排序 如何使用Collections对对象排序呢? 其实只需要让我们的数据类型实现Comparable接口即可,下面定义

    2024年02月09日
    浏览(45)
  • 实现跨域的几种方式

    前后端的分离导致了跨域的产生  跨域的三要素:协议 域名 端口 三者有一个不同即产生跨域 例如: http ://www.csdn.com https ://www.csdn.com 由于协议不同,端口不同而产生跨域 注:http的默认端口80,https的默认端口443 跨域的解决方案 前端:webpack proxy,jsonp,ngix反向代理,webpac

    2024年02月13日
    浏览(43)
  • C语言实例:输出字符的几种方式和实际编程中的应用

    在C语言中,要输出单个字符可以使用多种方式。以下是一些常见的方法: 使用putchar函数 putchar函数可以输出单个字符到标准输出设备(通常是屏幕)。例如,下面的代码将字符’A’输出到屏幕上: 使用printf函数 printf函数可以用于格式化输出。如果只想输出单个字符,则需

    2024年02月08日
    浏览(45)
  • 线程间实现通信的几种方式

    线程间通信的模型有两种:共享内存和消息传递,下面介绍的都是围绕这两个来实现 有两个线程A和B,B线程向一个集合里面依次添加元素“abc”字符串,一共添加10次,当添加到第五次的时候,希望线程A能够收到线程B的通知,然后B线程执行相关的业务操作 Object类提供了线程

    2024年02月15日
    浏览(63)
  • 单例模式的几种实现方式

    在Java中,实现单例模式主要有几种方式:懒汉式、饿汉式、双重检查锁定、静态内部类和枚举。每种方式都有其特点和适用场景。 1. 饿汉式(线程安全) 饿汉式是最简单的一种实现方式,通过静态初始化实例,保证了线程安全。但它不是懒加载模式,无法在实际使用时才创

    2024年02月20日
    浏览(49)
  • 前端实现动画的几种方式简介

    这里只是做简要介绍,属于知识的拓展。每种方案的更详细的使用方式需要各位自行了解。 大体上技术方案分为:CSS 动画、SVG 动画、CSS + SVG、JS 控制的逐帧动画、GIF 图。 CSS 实现动画有两种方式,一种是使用 trasition ;另一种是使用 animation 。 默认情况下,当 CSS 中的属性值

    2024年04月22日
    浏览(44)
  • Java实现异步的几种方式

    普通线程实现异步,但频繁创建、销毁线程比较耗资源,所以一般交给线程池执行 结果: Future异步 和普通线程实现异步区别不大,只是使用Future是要获取执行后的返回值 结果: Spring的@Async异步 使用@Async注解实现异步的前提是需要在启动类上标注@EnableAsync来开启异步配置

    2024年02月04日
    浏览(65)
  • 游戏中模型动画的几种实现方式

    游戏内动画的实现方式一般有这几种: 骨骼动画 顶点动画 材质动画 CPU蒙皮动画 骨骼动画是一种基于骨骼系统的动画技术,它通过对骨骼进行变换来控制模型的姿态和动作。 在骨骼动画中,模型通常被分解成多个部分,每个部分都与一个或多个骨骼相连,通过对骨骼进行旋

    2024年02月05日
    浏览(59)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包