12.class基础用法和继承

12.1.class基础语法

在es5中,面向对象我们通常写成这样


function Person(name,age) {
this.name = name;
this.age = age;
}
Person.prototype.showName = function () {
console.log(this.name);
}; let p = new Person("xiaoqiang", 10);
p.showName();

上面这种写法与传统的面向对象写法有很大的不同,让学习过其他面向对象语言的同学感到很别扭,因此,在ES6中,增加了语法糖,使用class关键字来定义类,这里说的语法糖的意思简单的理解就是另一种更便捷的写法,编译后的功能实际上是一样的

下面是ES6中定义类的语法:

class Person{
constructor(name, age){
this.name = name;
this.age = age;
}
showName(){
console.log(this.name)
}
}
let p = new Person("xiaoqiang2", 10);
p.showName();

注意1: constructor是默认添加的方法,当new 关键字去调用类的时候,constructor会默认被执行,即使不写这个constructor方法,也会默认添加一个空方法

constructor(name, age){
console.log("开始执行了")
this.name = name;
this.age = age;
}

注意2: 在类中写的方法之间不能加逗号,否则会报错

class Person{
constructor(name, age){
console.log("开始执行了")
this.name = name;
this.age = age;
}
showName(){
console.log(this.name)
},
showAge(){
console.log(this.age);
}
}
let p = new Person("xiaoqiang2", 10);
p.showName();

12.2.继承

在ES6中使用extends关键字来实现继承


class Parent{
constructor(name, age){
console.log("开始执行了");
this.name = name;
this.age = age;
}
showName(){
console.log(this.name)
}
} //Child去继承 Parent
class Child extends Parent{ } let c = new Child('nodeing', 20);
console.log(c);

上面代码就是继承的基本写法,只是我们并没有在子类中去增加方法,此时,子类相当于去拷贝了父类

注意1: 在子类中如果重写父类的constructor方法,需要首先调用supper方法


class Parent{
constructor(name, age){
console.log("开始执行了");
this.name = name;
this.age = age;
}
showName(){
console.log(this.name)
}
} class Child extends Parent{
constructor(name, age, gender){
super(name, age);
this.gender = gender
}
} let c = new Child('nodeing', 20);
console.log(c);

注意2: 如果这样写会报错:

class Child extends Parent{
constructor(name, age, gender){
this.gender = gender
super(name, age);
}
}

视频教程地址:http://edu.nodeing.com/course/50

es6+最佳入门实践(12)的更多相关文章

  1. es6+最佳入门实践(7)

    7.set和map数据结构 7.1.什么是set? Set就是集合,集合是由一组无序且唯一的项组成,在es6中新增了set这种数据结构,有点类似于数组,但是它的元素是唯一的,没有重复 let st = ...

  2. es6+最佳入门实践(5)

    5.对象扩展 5.1.对象简写 在es5中,有这样一种写法 var name = "xiaoqiang"; var age = 12; var obj = { name : nam ...

  3. es6+最佳入门实践(14)

    14.模版字符串 模版字符串(template string)是增强版的字符串,定义一个模版字符串需要用到反引号 let s = `这是一个模版字符串` console.log(s) 14.1.模版字 ...

  4. es6+最佳入门实践(10)

    10.Generator 10.1.Generator是什么? Generator函数是ES6提供的一种异步编程解决方案.在它的内部封装了多个状态,因此,又可以理解为一种状态机,执行Generator ...

  5. es6+最佳入门实践(9)

    9.Iterator和for...of 9.1.Iterator是什么? Iterator又叫做迭代器,它是一种接口,为各种不同的数据结构提供统一的访问机制.这里说的接口可以形象的理解为USB接口,有 ...

  6. es6+最佳入门实践(8)

    8.Promise 8.1.什么是异步? 要理解异步,首先,从同步代码开始说 alert(1) alert(2) 像上面的代码,执行顺序是从上到下,先后弹出1和2,这种代码叫做同步代码 alert(0 ...

  7. es6+最佳入门实践(6)

    6.Symbol用法 6.1.什么是Symbol? Symbol是es6中一种新增加的数据类型,它表示独一无二的值.es5中我们把数据类型分为基本数据类型(字符串.数字.布尔.undefined.nu ...

  8. es6+最佳入门实践(4)

    4.函数扩展 4.1.参数默认值 默认参数就是当用户没有传值的时候函数内部默认使用的值,在es5中我们通过逻辑运算符||来实现 function Fn(a, b) { b = b || "n ...

  9. es6+最佳入门实践(3)

    3.数组扩展 3.1.扩展运算符 扩展运算符用三个点(...)表示,从字面上理解,它的功能就是把数组扩展开来,具体形式如下: let arr = [1, 2, 3]; console.log(...a ...

随机推荐

  1. Sql Server 游标概念与实例

    引言 先不讲游标的什么概念,看如下Sql Server2008 图例: 需求:两张表的O_ID是一一对应的,现在求将加薪的工资+原来的工资=现在的工资,也就是O_Salary=O_Salary+A_S ...

  2. git的关于测试的相关的内容

    今天,我们来讲一下git的分支的一些内容,在以前的时候,我一直都以为,对于一个项目,这个时候,我们把这个项目叫做项目a项目,这个a项目有master,staging,以及我自己的分支xxx,当我想上测 ...

  3. MSSQL如何查看当前数据库的连接数 【转】

    - [SQL Server]版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本声明 http://ai51av.blogbus.com/logs/52955622.html   如果我们发布 ...

  4. OBS源码编译开发

    本文来自网易云社区 作者:梁敏 OBS简介 OBS(Open Broadcaster Software)是免费开源的视频录制和直播软件,支持运行在windows,Mac和linux平台.官方链接 ht ...

  5. ionic 向路由中的templateUrl(模板页)传值

    .state('product', { url: '/product/:id', templateUrl: function ($routeParams) { return '/Product/Ind ...

  6. Jmeter中传递cookie值

    场景:用户登陆后会本地会保存cookie,cookie是用来跟服务端验证此用户已经登陆过的重要信息,但是如何获取并在其他请求时将此cookie传递给服务器呢? 在线程组下面之直接添加HTTP Cook ...

  7. Python 中的容器 collections

    写在之前 我们都知道 Python 中内置了许多标准的数据结构,比如列表,元组,字典等.与此同时标准库还提供了一些额外的数据结构,我们可以基于它们创建所需的新数据结构. Python 附带了一个「容器 ...

  8. Python网络编程(socketserver、TFTP云盘、HTTPServer服务器模型)

    HTTP协议? HTTP是一个应用层协议,由请求和响应构成,是一个标准的客户端服务器模型.HTTP是一个无状态的协议. 通常承载于TCP协议之上,有时也承载于TLS或SSL协议层之上,这个时候,就成了 ...

  9. Halcon17无法加载"hdevenginecpp":找不到指定的模块

    Halcon17无法加载"hdevenginecpp":找不到指定的模块 在C#和Halcon17混合编程中,当执行private HDevEngine MyEngine = ne ...

  10. tensorflow学习笔记(1)-基本语法和前向传播

    tensorflow学习笔记(1) (1)tf中的图 图中就是一个计算图,一个计算过程.                                       图中的constant是个常量 计 ...