When the ES6 class shipped back in 2015, a number of additional keywords came with it. Two of these are constructor and super. Both of these are specific to the class keyword and make working with classes manageable. Both are utilized when the new keyword is used to create a new instance of a class. constructors are called initially with the new keyword and super is how a subclass can utilize it's parent's methods (like it's parent's constructor function) within that child class

You have to call super() function when you extends one class:

class Rectangle {
constuctor(height, width) {
this.name = 'Rectangle'
this.height = height
this.width = width
}
} class Square extends Rectangle {
constructor(length) {
super(length, length)
this.name = 'Square'
}
} const myShape = new Square(1) console.log(myShape)

Again, even if our rectangle class did not have a constructor, we'd still need to call super within the square's constructor because it is required when we're working with subclasses that have constructors and when the this keyword is used in the constructor.

class Rectangle {

}

class Square extends Rectangle {
constructor(length) {
super()
this.name = 'Square'
}
}

[Javascript] ES6 Class Constructors and the Super Keyword的更多相关文章

  1. [转]JavaScript ES6 class指南

    [转]JavaScript ES6 class指南 前言 EcmaScript 2015 (又称ES6)通过一些新的关键字,使类成为了JS中一个新的一等公民.但是目前为止,这些关于类的新关键字仅仅是建 ...

  2. JavaScript es6 class类的理解。

    本着互联网的分享精神,在本篇文章我将会把我对JavaScript  es6 class类的理解分享给大家. JavaScript 类主要是 JavaScript 现有的基于原型的继承的语法糖. 类语法 ...

  3. JavaScript ES6中export及export default的区别

    相信很多人都使用过export.export default.import,然而它们到底有什么区别呢? 在JavaScript ES6中,export与export default均可用于导出常量.函 ...

  4. JavaScript ES6 新特性详解

    JavaScript ES6 带来了新的语法和新的强大功能,使您的代码更现代,更易读 const ,  let and var 的区别: const , let 是 ES6 中用于声明变量的新关键字. ...

  5. JavaScript ES6 核心功能一览

    JavaScript 在过去几年里发生了很大的变化.这里介绍 12 个你马上就能用的新功能. JavaScript 历史 新的语言规范被称作 ECMAScript 6.也称为 ES6 或 ES2015 ...

  6. JavaScript ES6中export及export default的区别以及import的用法

    本文原创地址链接:http://blog.csdn.net/zhou_xiao_cheng/article/details/52759632,未经博主允许不得转载. 相信很多人都使用过export.e ...

  7. JavaScript ES6 核心功能一览(转)

    原文地址:Overview of JavaScript ES6 features (a.k.a ECMAScript 6 and ES2015+) 原文作者:Adrian Mejia 译文出自:掘金翻 ...

  8. JavaScript ES6 promiss的理解。

    本着互联网的分享精神,我将我对promise的理解分享给大家. JavaScript ES6的promise方法主要应用在处理异步函数返回的结果,注意他不是将异步函数转换为同步函数,而是等异步函数有结 ...

  9. JavaScript ES6功能概述(ECMAScript 6和ES2015 +)

    JavaScript在过去几年中发生了很大的变化.这些是您今天可以开始使用的12项新功能! 该语言的新增内容称为ECMAScript 6.它也称为ES6或ES2015 +. 自1995年JavaScr ...

随机推荐

  1. servlet和response

    servlet基础知识 Servlet在内存中是单例----单实例对象一个Servlet类 在内存中最多有一个对象 一个项目有多少功能,将来就有多少Servlet. servlet是自启动的,就是可以 ...

  2. CentOS7安装Kubernetes1.16.3

    一.概述 手工搭建 Kubernetes 集群是一件很繁琐的事情,为了简化这些操作,就产生了很多安装配置工具,如 Kubeadm ,Kubespray,RKE 等组件,我最终选择了官方的 Kubead ...

  3. 「UNR#1」奇怪的线段树

    「UNR#1」奇怪的线段树 一道好题,感觉解法非常自然. 首先我们只需要考虑一次染色最下面被包含的那些区间,因为把无解判掉以后只要染了一个节点,它的祖先也一定被染了.然后发现一次染色最下面的那些区间一 ...

  4. SpringCloud面试题及答案

    1. 什么是 spring cloud? spring cloud 是一系列框架的有序集合.它利用 spring boot 的开发便利性巧妙地简化了分布式系统基础设施的开发,如服务发现注册.配置中心. ...

  5. Mysql——查看数据库,表占用磁盘大小

    .查询所有数据库占用磁盘空间大小 select TABLE_SCHEMA, concat(,),' MB') as data_size, concat(,),'MB') as index_size f ...

  6. Python开发【第十四篇】装饰器

    装饰器 什么是装饰器? ​ 装饰器是一个函数,主要作用是用来给包装另一个函数或者类 包装的目的是不改变原函数名(或类名)的情况下改变或添加被包装对象的功能 函数装饰器 是指装饰器是一个函数,传入的是一 ...

  7. thinkPHP中 query()和execute()的区别

    query()执行的是查询(select)的SQL语句. execute()执行的是插入(insert)和修改(update)的SQL语句.execute()方法将返回影响的记录数. 如果在TP中使用 ...

  8. JS实现文件自动上传

    JS引用: <script type="text/javascript" src="~/bootstrap/js/fileinput.min.js"> ...

  9. Winows上简单配置使用kafka(.net使用)

    一.kafka环境配置 1.jdk安装 安装文件:http://www.oracle.com/technetwork/java/javase/downloads/index.html 下载JDK安装完 ...

  10. vue中进行窗口变化的监听

    今天vue项目中用到的元素的宽度依赖与窗口的宽度,所以在进行宽度设置的时候涉及到窗口的变化,因为元素的宽度要随着窗口变化 分成几个步骤来实现这一过程 1.首先元素的宽度依赖与窗口的宽度,就需要有接受窗 ...