Nodejs与ES6系列4:ES6中的类
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中的类的更多相关文章
- ES6系列之项目中常用的新特性
ES6系列之项目中常用的新特性 ES6常用特性 平时项目开发中灵活运用ES6+语法可以让开发者减少很多开发时间,提高工作效率.ES6版本提供了很多新的特性,接下来我列举项目中常用的ES6+的特性: l ...
- 《深入理解ES6》笔记—— JavaScript中的类class(9)
ES5中的近类结构 ES5以及之前的版本,没有类的概念,但是聪明的JavaScript开发者,为了实现面向对象,创建了特殊的近类结构. ES5中创建类的方法:新建一个构造函数,定义一个方法并且赋值给构 ...
- [ES6系列-03]ES6中关于参数相关特性详解(参数默认值与参数解构赋值与剩余参数)
[原创] 码路工人 大家好,这里是码路工人有力量,我是码路工人,你们是力量. 今天总结一下 ES6 中跟参数相关的内容. 欢迎补充斧正.留言交流. 让我们互相学习一起进步. 1. ES6 参数默认值( ...
- ts中的类的定义,继承和修饰符
自己搞一个ts文件 里面写代码如下,试一下就行了 /* 1.vscode配置自动编译 1.第一步 tsc --inti 生成tsconfig.json 改 "outDir": &q ...
- 大白话,讲编程之《ES6系列连载》汇总
如果你经历过2,3年前的前端开发,你一定感受过兼容IE6,7的痛苦,一定用过网页三剑客的dreamweaver编写html,面试的时候面试官一定会问你:会用PS切图吗? 刚开始的时候你发现,web前端 ...
- [js高手之路] es6系列教程 - 对象功能扩展详解
第一:字面量对象的方法,支持缩写形式 //es6之前,这么写 var User = { name : 'ghostwu', showName : function(){ return this.nam ...
- [js高手之路] es6系列教程 - 迭代器,生成器,for...of,entries,values,keys等详解
接着上文[js高手之路] es6系列教程 - 迭代器与生成器详解继续. 在es6中引入了一个新的循环结构for ....of, 主要是用来循环可迭代的对象,那么什么是可迭代的对象呢? 可迭代的对象一般 ...
- ES6 系列之 Babel 是如何编译 Class 的(下)
前言 ES5 寄生组合式继承 function Parent (name) { this.name = name; } Parent.prototype.getName = function () { ...
- ES6 系列之异步处理实战
前言 我们以查找指定目录下的最大文件为例,感受从 回调函数 -> Promise -> Generator -> Async 异步处理方式的改变. API 介绍 为了实现这个功能,我 ...
随机推荐
- 快速入门系列--深入理解C#
C#语言在近些年得到了长足的方法,代码风格越来越简洁美观,例如常用的泛型及其约束.可空类型.隐式类型.匿名类型和委托等,通过下面的表格可以对这部分相对简单的特性的使用有一个初步的了解. 特性 示例 泛 ...
- CSS画出的图
// × 目录 [1]矩形 [2]圆形 [3]椭圆[4]直角三角形[5]正三角形[6]平行四边形[7]梯形[8]六角星[9]六边形[10]五角星 简单图形 矩形 div{ width: 100px; ...
- 深入理解CSS中的空白符和换行
前面的话 CSS3新增了两个换行属性word-wrap和word-break.把空白符和换行放在一起说,是因为实际上空白符是包括换行的,且常用的文本不换行是使用的空白符的属性white-space: ...
- Sybase 数据库新增用户,赋权
Sybase数据库, 需求:新增用户user1,赋予对原数据库中表t_jingyu的查询权限 数据库原用户登陆 isql -U用户 -P密码 -S服务名 sp_addlogin 'user1','us ...
- 【GIT】Github上传本地代码详解
本教程结合Github服务端和客户端完成本地代码上传至Github,下面进行详细讲解: 1.创建Github账号,这一个步骤应该不用太多解释,直接上官网进行注册登录即可https://github.c ...
- 一步一步开发Game服务器(一)
什么是服务器?对于很多人来说也许只是简单成为在服务器端运行的程序的确如此,服务器通常意义就是说在服务器端运行的程序而已.那么我们怎么理解和分析游戏服务器哪? 传统意义上来说,程序运行后,正常流程, 启 ...
- vim黏贴自动增加tab的毛病
vim在ctrl + p的时候有可能会自动给你增加了个tab 很是郁闷 解决方法如下: :set noautoindent :set nosmartindent
- Java中不同转换符实现不同数据类型到字符串的转换
String类的format()方法用于创建格式化的字符串以及连接多个字符串对象.熟悉C语言的同学应该记得C语言的sprintf()方法,两者有类似之处.format()方法有两种重载形式. form ...
- CSS常用选择器名
一.页面结构划分 box 盒子wrap 包裹container 容器 header 头部main 主要区域footer 底部 content 内容区域banner 横幅广告区域menu 菜单 二.模块 ...
- 【SQL】CLR聚合函数什么鬼
之前写过一个合并字符串的CLR聚合函数,基本是照抄MS的示例,外加了一些处理,已经投入使用很长时间,没什么问题也就没怎么研究,近日想改造一下,遇到一些问题,遂捣鼓一番,有些心得,记录如下. 一.杂项 ...