1、ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。

2、

//定义类
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
} toString() {
return '(' + this.x + ', ' + this.y + ')';
}
}

上面代码定义了一个“类”,可以看到里面有一个constructor方法,这就是构造方法,而this关键字则代表实例对象。也就是说,ES5的构造函数Point,对应ES6的Point类的构造方法。

3、定义“类”的方法的时候,前面不需要加上function这个关键字,直接把函数定义放进去了就可以了。另外,方法之间不需要逗号分隔,加了会报错。

4、构造函数的prototype属性,在ES6的“类”上面继续存在。事实上,类的所有方法都定义在类的prototype属性上面。

class Point {
constructor(){
// ...
} toString(){
// ...
} toValue(){
// ...
}
} // 等同于 Point.prototype = {
toString(){},
toValue(){}
};

5、Object.assign方法可以很方便地一次向类添加多个方法。

class Point {
constructor(){
// ...
}
} Object.assign(Point.prototype, {
toString(){},
toValue(){}
});

6、类的内部所有定义的方法,都是不可枚举的(non-enumerable)。这一点与ES5的行为不一致。

7、类的属性名,可以采用表达式。

let methodName = "getArea";
class Square{
constructor(length) {
// ...
} [methodName]() {
// ...
}
}

上面代码中,Square类的方法名getArea,是从表达式得到的。

8、constructor方法是类的默认方法,通过new命令生成对象实例时,自动调用该方法。一个类必须有constructor方法,如果没有显式定义,一个空的constructor方法会被默认添加。constructor方法默认返回实例对象(即this),完全可以指定返回另外一个对象。

9、类的构造函数,不使用new是没法调用的,会报错。

10、可以通过实例的__proto__属性为Class添加方法。

var p1 = new Point(2,3);
var p2 = new Point(3,2); p1.__proto__.printName = function () { return 'Oops' }; p1.printName() // "Oops"
p2.printName() // "Oops" var p3 = new Point(4,2);
p3.printName() // "Oops"

11、使用实例的__proto__属性改写原型,必须相当谨慎,不推荐使用,因为这会改变Class的原始定义,影响到所有实例。

12、Class不存在变量提升(hoist)。

js-ES6学习笔记-Class的更多相关文章

  1. JS&ES6学习笔记(持续更新)

    ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...

  2. ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能

    前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...

  3. ES6学习笔记<五> Module的操作——import、export、as

    import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...

  4. ES6学习笔记<一> let const class extends super

    学习参考地址1  学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...

  5. js再学习笔记

    #js再学习笔记 ##基本 1.js严格区分大小写   2.js末尾的分号可加,也可不加   3.六种数据类型(使用typeof来检验数据的类型) `typeof` - undefined: `var ...

  6. JS数组学习笔记

    原文:JS数组学习笔记 最近在备课数组,发现很多ES5的方法平时很少用到.细节比较多,自己做了大量例子和整理,希望对大家了解JavaScript中的Array有所帮助. 概念 数组是值的有序集合.每个 ...

  7. es6学习笔记-class之一概念

    前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ...

  8. ES6学习笔记<四> default、rest、Multi-line Strings

    default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...

  9. ES6学习笔记<三> 生成器函数与yield

    为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...

  10. ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring

    接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...

随机推荐

  1. fastjson 反序列化漏洞笔记,比较乱

    现在思路还是有点乱,希望后面能重新写 先上pon.xml 包 <?xml version="1.0" encoding="UTF-8"?> < ...

  2. 无图形界面安装CentOS

    有些插在ATCA中的x86刀片虽然是提供了Micro HDMI显示接口的,但是可能由于厂家出于节省成本的考量,没有给板卡配备显卡,那么在无图形界面下安装系统,就成为一个运维人员应知的一件事情.这里我们 ...

  3. JS获取客户端IP地址、MAC和主机名的7个方法汇总

    今天在搞JS(javascript)获取客户端IP的小程序,上网搜了下,好多在现在的系统和浏览器中的都无效,很无奈,在Chrome.FireFox中很少搞到直接利用ActiveX获取IP等的JS脚本. ...

  4. 【disruptor】2、disruptor中生产者线程与消费者之间的协调

    由于ringbuffer是一个环形的队列,那么生产者和消费者在遍历这个队列的时候,如何制衡呢? 1.生产快,消费慢,数据丢失? 生产者速度过快,导致一个对象还没消费完,就循环生产了一个新的对象要加入r ...

  5. Python中对矩阵的洗牌操作

    [code] import numpy as np # 创建随机交换的索引 permutation = list(np.random.permutation(3)) # 创建矩阵X,Y X = np. ...

  6. c++之window.h

    在c++中引入window.h头文件. Sleep函数,此函数接受一个时间参数,单位是ms.即使得程序在一段时间后继续运行.如下: 在hello输出之后3000ms,才会继续输出world字符串. M ...

  7. C# 字符串操作详解

    MSDN关于String的所有Method 1.字符串转字符数组 (1).ToCharArray()方法,源码如下: 调用代码: var str = "Hello World"; ...

  8. Vagrant安装Docker

    ======方法1=========== 一.vagrant安装centos 1.1 什么是vagrant: Vagrant是一个基于Ruby的工具,用于创建和部署虚拟化开发环境.它 使用Oracle ...

  9. Android下用Sqlite数据库存储数据

    第一步:  写个类 ,继承 SQLiteOpenHelper public class MyDatabaseOpenHelper extends SQLiteOpenHelper { } 第二步:   ...

  10. 01-SpringBoot项目:helloworld

    1.Spring 官网:spring.io 2.继承SpringBoot的父项目 <parent> <groupId>org.springframework.boot</ ...