ES6中的类

4.1、class基本语法

在之前的javascript语法中是不存在class这样的概念,如果要通过构造函数生成一个新对象代码

function Shape(width,height){
this.width = width;
this.height = height;
} Point.prototype.toString = function () {
return '(' + this.width + ', ' + this.height + ')';
}

ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。基本上,ES6的class可以看作只是一个语法糖,它的绝大部分功能,ES5都可以做到,新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。上面的代码用ES6的“类”改写,就是下面这样。

//定义类
class Shape { constructor(width, height) {
this.height = height;
this.width = width;
} toString() {
return '(' + this.width + ', ' + this.height + ')';
} }

通过class定义类名,constructor关键字定义构造函数。

4.2、继承与多态

继承与多态是面向对象最重要的两个特性,通过继承可以实现代码的重构,在之前的javascript中继承需要通过原型链来实现,而在ES6中可以通过extends关键字直观的实现继承。首先定义基类Shape,定义子类Rect集成与基类并重写方法toArea实现多态。

'use strict'
class Shape {
constructor(width,height){
this.width=width;
this.height=height;
}
/***
* 获取面积
* @returns {number}
*/
toArea(){
return this.width*this.height
}
}
module.exports = Shape;
'use strict'
var Shape = require('./Shape');
class Rect extends Shape {
constructor(width, height) {
super(width, height);
}
toArea() {
return this.width*this.height*2
}
}
module .exports = Rect;

子类Rect集成与基类Shape,拥有了基类的方法toArea,和属性width与height,而子类通过相同的方法名重写了方法toArea。

var sharp = new Sharp(1,2);
var rect = new Rect(1,2);
console.log(sharp.toArea());
console.log(rect.toArea());
====
2
4

4.3、类的静态方法

ES6中的类提供静态方法,静态方法只能在类成员下调用,如果类实例化后再调用会抛出异常。同样的基类定义的静态方法能被子类所继承。静态方法通过static关键字定义。

'use strict'
class Shape {
constructor(width,height){
this.width=width;
this.height=height;
}
/***
* 获取面积
* @returns {number}
*/
toArea(){
return this.width*this.height
}
/**
* 静态方法
* @returns {string}
*/
static toName(){
return 'shape'
}
}
module.exports = Shape;
console.log(Rect.toName());
===
shape

值得注意的是在ES6的类中并没有静态属性的概念。静态属性可以通过Shape.name这样来定义。

Nodejs与ES6系列4:ES6中的类的更多相关文章

  1. ES6系列之项目中常用的新特性

    ES6系列之项目中常用的新特性 ES6常用特性 平时项目开发中灵活运用ES6+语法可以让开发者减少很多开发时间,提高工作效率.ES6版本提供了很多新的特性,接下来我列举项目中常用的ES6+的特性: l ...

  2. 《深入理解ES6》笔记—— JavaScript中的类class(9)

    ES5中的近类结构 ES5以及之前的版本,没有类的概念,但是聪明的JavaScript开发者,为了实现面向对象,创建了特殊的近类结构. ES5中创建类的方法:新建一个构造函数,定义一个方法并且赋值给构 ...

  3. [ES6系列-03]ES6中关于参数相关特性详解(参数默认值与参数解构赋值与剩余参数)

    [原创] 码路工人 大家好,这里是码路工人有力量,我是码路工人,你们是力量. 今天总结一下 ES6 中跟参数相关的内容. 欢迎补充斧正.留言交流. 让我们互相学习一起进步. 1. ES6 参数默认值( ...

  4. ts中的类的定义,继承和修饰符

    自己搞一个ts文件 里面写代码如下,试一下就行了 /* 1.vscode配置自动编译 1.第一步 tsc --inti 生成tsconfig.json 改 "outDir": &q ...

  5. 大白话,讲编程之《ES6系列连载》汇总

    如果你经历过2,3年前的前端开发,你一定感受过兼容IE6,7的痛苦,一定用过网页三剑客的dreamweaver编写html,面试的时候面试官一定会问你:会用PS切图吗? 刚开始的时候你发现,web前端 ...

  6. [js高手之路] es6系列教程 - 对象功能扩展详解

    第一:字面量对象的方法,支持缩写形式 //es6之前,这么写 var User = { name : 'ghostwu', showName : function(){ return this.nam ...

  7. [js高手之路] es6系列教程 - 迭代器,生成器,for...of,entries,values,keys等详解

    接着上文[js高手之路] es6系列教程 - 迭代器与生成器详解继续. 在es6中引入了一个新的循环结构for ....of, 主要是用来循环可迭代的对象,那么什么是可迭代的对象呢? 可迭代的对象一般 ...

  8. ES6 系列之 Babel 是如何编译 Class 的(下)

    前言 ES5 寄生组合式继承 function Parent (name) { this.name = name; } Parent.prototype.getName = function () { ...

  9. ES6 系列之异步处理实战

    前言 我们以查找指定目录下的最大文件为例,感受从 回调函数 -> Promise -> Generator -> Async 异步处理方式的改变. API 介绍 为了实现这个功能,我 ...

随机推荐

  1. JAVA设计模式《三》

    上一篇为大家介绍了一下关于模板方法模式的实现,后来我发现里面有一点小瑕疵,本篇重新为大家介绍一下关于模板方法模式的实现.另外为大家分享一下关于策略模式的实现. 一.模板方法模式: 对于上一篇为大家介绍 ...

  2. 【原创】.NET读写Excel工具Spire.Xls使用(4)对数据操作与控制

                  本博客所有文章分类的总目录:http://www.cnblogs.com/asxinyu/p/4288836.html .NET读写Excel工具Spire.Xls使用文章 ...

  3. Angularjs 跳转页面并传递参数的方法总结

    http://www.zhihu.com/question/33565135 http://www.codeproject.com/Articles/1073780/ASP-NET-MVC-CRUD- ...

  4. backbone库学习-model

    backbone库的结构: http://www.cnblogs.com/nuysoft/archive/2012/03/19/2404274.html 本文所有例子来自于http://blog.cs ...

  5. 让Team Foundation Server/TFS自动记住用户名密码解决方案

    在使用Team Foundation Server(以下简称TFS) 的时候,在每次打开Visual Studio TFS时候,需要输入用户名和秘密,比较麻烦.现提供一种方法可以解决这个问题: 依次执 ...

  6. JS兼容所有浏览器的一段加入收藏代码,设置为首页

    <script language="javascript" type="text/javascript"> function addfavorite ...

  7. 老鸟谈谈JAVA EE的学习

    老鸟谈谈JAVA EE的学习 因为出差和项目的原因,有将近一个月的时间没有更新博客了,今天终于得闲,和兄弟们分享一下JAVA EE的学习心得.书中带过,直入主题,下面我们首先看看什么是JAVA EE. ...

  8. Redis发布订阅实现原理

    发布订阅中使用到的命令就只有三个:PUBLISH,SUBSCRIBE,PSUBSCRIBE PUBLISH 用于发布消息 SUBSCRIBE 也叫频道订阅,用于订阅某一特定的频道 PSUBSCRIBE ...

  9. shell的历史

    shell的历史 shell概况 人想要和操作系统进行交互,传送指令给操作系统,就需要使用到shell.宏义的shell是人与机器交互的页面,它分为两种,一种是有界面的,比如GUI,另外一种是没有界面 ...

  10. php+mysql+apache项目运行所遇到的一系列配置问题

    今天运行一个php项目时,突然发现访问不了了.起因应该是mac系统升级,导致apache配置文件完全恢复到了默认状态,一切归零.作为一个经验尚欠的前端,对这些后台配置完全是一窍不通,赶紧微信联系了小胖 ...