在ES2015之前,定义类的方法只能通过原型链来模拟

function Animal(family,species) {
this.family = family;
this.species = species;
};
Animal.prototype.yell = function() {
console.log(this.family);
}
let dog = Animal('dogs','four feet');

而在ES2015中可以使用class关键字来定义类,使用constructor来定义类创建时所需的参数,直接定义函数来创建类方法:

class Animal {
constructor (family,species) {
this.family = family;
this.species = species;
};
yell () {// 等于Animal.prototype.yell = function(){}
return this.family;
}
} const dog = new Animal('dog','four feet');

在类定义中可以看到yell的方法没有使用键值对的方式,这也是ES6中新引入的对象字面量扩展,等同于:

const Animal= {
yell: function() {
return this.family;
}
}

类 + promise

class Point {
constructor (x, y) {
this.x = x;
this.y = y;
};
moveright(step) {
return new Promise(resolve => resolve({
x: this.x + step,
y: this.y
}))
}
}
const p = new Point(2,5);

定义一个点类,拥有moveright的方法,返回的使一个Promise,利用箭头函数调用resolve,使Promise状态转换到onFulfilled。

p.moveright(3)
.then(({x, y}) => console.log(`${x}, ${y}`));//5,5

这里的{x,y} 用了ES6的新语法解构,将返回的对象中的x和y键对应的值返回。

下面讲讲类的继承,在函数中的继承有很多种继承方式,具体的继承方式我会在我的博客中更新。

创建一个Point2D类

class Point2D {
constructor(x,y) {
this.x = x;
this.y = y;
}
toString() {
console.log('2d function');
return `${this.x},${this.y}`;
}
};

创建Point3D类并继承Point2D,核心关键字extends, super

class Point3D extends Point2D {
constructor(x,y,z) {
super(x,y);// 如果没有super,则在constructor中不能使用this,其他方法中可以。
this.z = z;
}
toString(){
super.toString();
return `${this.x},${this.y},${this.z}`;
}
};

这样的继承方式比使用function继承来的更为直接和方便。

最后测试:

const p = new Point3D(1,2,3)
p.toString()

输出为:

这样使用super便实现了对父类方法的继承。

ES2015 类 class 语法的更多相关文章

  1. go类c语法

    go类c语法 一般来说,如果一门语言具有类c语法,意味着当你习惯使用其他类c语言例如c.c++.java.javascript和c#,然后你就会发现go语言和它们也类似,至少表面上是.例如,使用&am ...

  2. [C++]C++类基本语法

    本测试代码包括以下内容: (1)如何使用构造函数:(2)默认构造函数:(3)对象间赋值:(4)const使用语法:(5)定义类常量: 一种方法是用enum,另一种方法是使用static. #inclu ...

  3. ES2015 类中的静态方法

    在ES2015中,终于不用用函数原型来实现类系统,可以直接使用关键字class,下面是对class的静态属性的研究: 举例:一个Node类,每一个Node类之间都可以建立从属关系,每一个Node实例下 ...

  4. python类的语法和底层实现

    语法: class 类名: name = “egon”    # 类属性 def __init__(self): self.age = 18  # 对象属性 self.__sex = "fe ...

  5. C# 面向对象2 (类的语法)

    1.类 语法: [public] class 类名 { 字段; 属性; 方法; } **类名首字母必须大写 2.创建对象 创建这个类的对象过程称之为类的实例化,关键字:new this:表示当前这个类 ...

  6. 什么是静态内部(Static Inner)类,语法要注意什么?

    4静态内部类(Static Inner Classes) 马克-to-win:这里的内部类的static,意思是它可以不用实例化外部类,就自己单独被实例化,单独存在(有点像生活中的办公室和办公桌(独立 ...

  7. 类模板语法知识体系梳理(包含大量常犯错误demo,尤其滥用友元函数的错误)

    demo 1 #include <iostream> #include <cstdio> using namespace std; //template <typenam ...

  8. 【c++错误】类的语法错误 error c2533:constructors not allowed a return type(构造函数不允许返回一个类型)

    今天编写类的程序的时候不小心把类后的分号忘写了,就出现上面的错误提示. 顺便复习下类的正确格式: class 类名 { public: //习惯上将公有类型放在前面,便于阅读 ……(外部接口) pro ...

  9. python 类高级语法 静态方法

    通过@staticmethod装饰器即可把其装饰的方法变为一个静态方法,什么是静态方法呢?其实不难理解,普通的方法,可以在实例化后直接调用,并且在方法里可以通过self.调用实例变量或类变量,但静态方 ...

随机推荐

  1. centos/linux下的安装Maven

    1.保证该项目安装了JDK 请在系统中输入java -version查看该命令是否存在 如果没有安装JDK请移步到Centos/linux下的JDK安装 2.下载Maven wget http://m ...

  2. rxjs-流式编程

    前言 第一次接触rxjs也是因为angular2应用,内置了rxjs的依赖,了解之后发现它的强大,是一个可以代替promise的框架,但是只处理promise的东西有点拿尚方宝剑砍蚊子的意思. 如果我 ...

  3. 动态规划算法的java实现

    一:动态规划 1)动态规划的向前处理法 java中没有指针,所以邻接表的存储需要转化一中形式,用数组存储邻接表 用三个数组u,v,w存储边,u数组代表起点,v数组代表终点,w代表权值;例如:1--&g ...

  4. Django 学习笔记

    day 1 : 一.web 框架本质: 1.http 建立在tcp 之上:一次互通后断开,无状态,短链接 请求头: b'GET / HTTP/1.1 Host: 127.0.0.1:8080 Conn ...

  5. duilib界面库学习(仿PC微信界面,有服务器,有数据库,可以网络通信)

    客户端代码:https://github.com/TTGuoying/duilib_ChatClient 服务器代码:https://github.com/TTGuoying/duilib_ChatS ...

  6. Spark SQL 1.3测试

    Spark SQL 1.3 参考官方文档:Spark SQL and DataFrame Guide 概览介绍参考:平易近人.兼容并蓄——Spark SQL 1.3.0概览 DataFrame提供了一 ...

  7. Hadoop1.x原理

    将这种单机的工作进行分拆,变成协同工作的集群,这就是分布式计算框架设计.使得计算机硬件类似于应用程序中资源池的资源,使用者无需关心资源的分配情况,从而最大化了硬件资源的使用价值.分布式计算也是如此,具 ...

  8. hbase 命令

    HBase是Google Bigtable的开源实现,它利用Hadoop HDFS作为其文件存储系统,利用Hadoop MapReduce来处理HBase中的海量数据,利用Zookeeper作为协同服 ...

  9. Lua Table转C# Dictionary

    因为在游戏公司做web后台开发,经常会涉及到取游戏服务器的数据库里面读写各种操作. 昨天下午,服务器那边让我读一个配置显示到后台,让运营大佬们可以在web后台配置游戏参数. 本来以为很简单个事情,结果 ...

  10. accordion 分类

    <!--accordion--><h1>accordion 分类</h1><div id="accordionId" class=&quo ...