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编程思想(Chapter2、4、6)

    一切皆对象 用引用操纵对象 Java中操纵的标识符实际上是对象的“引用”.例如想要操纵一个字符串,则可以创建一个String引用. String s; 此处s只是一个引用. 存储位置 基本类型/对象的 ...

  2. android studio 使用gradle 导出jar包,并打包assets目录

    警告:本文年久失修. 随着android studio的升级 ,gradle的升级,严格按照本文的代码去做可能不会成功,希望依然可以作为解决问题的思路. 最近项目在做一个sdk,供别的开发者使用,所以 ...

  3. javascript运算符——条件、逗号、赋值、()和void运算符

    × 目录 [1]条件 [2]逗号 [3]赋值[4]()[5]void 前面的话 javascript中运算符总共有46个,除了前面已经介绍过的算术运算符.关系运算符.位运算符.逻辑运算符之外,还有很多 ...

  4. poj 1724ROADS(bfs和dfs做法)

    /* dfs比较好想,就是测试数据的问题,导致在遍历边的时候要倒着遍历才过! */ #include<iostream> #include<cstdio> #include&l ...

  5. 数据可视化(7)--D3基础

    一直想写写D3,觉得D3真心比较强大,基本上你能想出来的图表都能绘制出来,只不过使用起来比前几个要稍麻烦一点. 正好最近读完了<数据可视化实战>,将关于D3的知识梳理了一遍,写这篇博客记录 ...

  6. Dapper的基本使用

    Dapper是.NET下一个micro的ORM,它和Entity Framework或Nhibnate不同,属于轻量级的,并且是半自动的.也就是说实体类都要自己写.它没有复杂的配置文件,一个单文件就可 ...

  7. SQL Server 2014新特性——基数评估(白皮书阅读笔记)

    基数评估 目录 基数评估 说明 基数评估准确的重要性 模型假设 启用新的基数评估 验证基数评估的版本 在迁移到新的基数评估前要测试 校验基数评估 偏差问题 需要手动处理的变化 避免因为新的CE造成性能 ...

  8. 基于HT for Web的3D拓扑树的实现

    在HT for Web中2D和3D应用都支持树状结构数据的展示,展现效果各异,2D上的树状结构在展现层级关系明显,但是如果数据量大的话,看起来就没那么直观,找到指定的节点比较困难,而3D上的树状结构在 ...

  9. asp.net mvc5+Echarts3.0+AspNet.SignalR2.0 实时监控cpu占用率推送

    先看看效果: 感谢QQ群18668853的群主,无私的公开课,全是干货,当初学的时候,群主用的是jquery.flot做图表,我这里改成百度的Echarts3.0,这算是自己的修改吧,喜欢的可以去下载 ...

  10. Python语言特性之5:自省

    自省是Python中非常耀眼的特性. 自省就是面向对象的语言所写的程序在运行时,所能知道对象的类型.简单一句就是运行时能够获得对象的类型.比如 type() dir() getattr() hasat ...