在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. js使用defineProperty的一些坑

    var p2={ }; Object.defineProperty(p2,"gs",{ get:function () { return this.gs; }, set:funct ...

  2. CentOS 6安装Oracle报错解决方案

    1. Preparing to launch Oracle Universal Installer from /tmp/OraInstall2017-05-23_04-18-48AM. Please ...

  3. Java多线程推荐使用的停止方法和暂停方法

    判断线程结束和让线程结束 package cn.lonecloud.Thread.study; /** * 用于循环1000次的线程 * @Title: Run1000Thread.java * @P ...

  4. Mac下VirtualBox共享文件夹设置

    环境:CentOS7.2最小化安装 步骤: 先安装必要软件包 yum install -y gcc gcc-devel gcc-c++ gcc-c++-devel make kernel kernel ...

  5. 2017CCPC 网络选拔赛1003 Ramsey定理

    Ramsey定理 任意6个人中,一定有三个人互为朋友,或者互相不是朋友. 证明 这里我就不证明了.下面链接有证明 鸽巢原理 Ramsey定理 AC代码 #include <stdio.h> ...

  6. LRUCache原理分析

    一.注释 LRUCache的原理,基本都在注释里面描述清楚了. /** * A cache that holds strong references to a limited number of va ...

  7. 关于服务器的CPU的几个概念学习总结

    物理CPU 物理CPU: 物理CPU是指插在主板上面的CPU芯片.即指在主板上肉眼能看到的CPU的个数.一般而言,个人台式机或笔记本上只会有一个物理CPU芯片.而服务器主板上往往有多个物理CPU. L ...

  8. MFC 多线程及线程同步

    一.MFC对多线程编程的支持 MFC中有两类线程,分别称之为工作者线程和用户界面线程.二者的主要区别在于工作者线程没有消息循环,而用户界面线程有自己的消息队列和消息循环. 工作者线程没有消息机制,通常 ...

  9. java Socket实现简单在线聊天(一)

    最近的项目有一个在线网页交流的需求,由于很久以前做过的demo已经忘记的差不多了,因此便重新学习一下. 我计划的大致实现步骤分这样几大步: 1.使用awt组件和socket实现简单的单客户端向服务端持 ...

  10. Flex中的FusionCharts 四图监听

    <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="ht ...