关于ES6 Class语法相关总结
关于ES6,其实网上已经有很多的资料可供查询,教程可参考阮一峰大神的ES6入门,本文只是对Class这一语法做一个总结:
一、Class基本语法
constructor方法
constructor是类的默认构造方法,new命令生成对象实例时,自动调用该方法。一个类必须有constructor方法,如果没有显式定义,一个空的constructor方法会被默认添加。
this的指向
类的方法内部如果含有this,它默认指向类的实例。注意,在static静态方法中,this会指向当前类,不是实例;
静态方法和实例方法
静态方法是在方法名前面加static关键字,静态方法不会被实例继承,只能通过类来调用。如在实例上调用,则会抛出一个错误;注意,如果静态方法包含this关键字,这个this指的是类,而不是实例。
实例方法可通过new关键字直接调用,同ES5一样;
静态属性和实例属性
静态属性指的是 Class 本身的属性,即Class.propName,而不是定义在实例对象(this)上的属性。ES6,定义类的属性,不能定义在类里面,需要在外面定义,见代码:
Class Person{
}
Person.school = "Beijing University";
ES7中,可定义在类的内部,前面加static关键字即可;
类的实例属性可以用等式,写入类的定义之中。在实例上,可以直接调用这个属性;
二、Class继承
Class 可以通过extends关键字实现继承,见代码:
class A{
}
class B extends A{
}
子类必须在constructor方法中调用super方法,否则新建实例时会报错。这是因为子类没有自己的this对象,而是继承父类的this对象,然后对其进行加工。如果不调用super方法,子类就得不到this对象。
父类的静态方法,也会被子类继承。
最后,见下面代码:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
static log(text) {
console.log(`Helow ${text},I'm come from ${this.school}`)
}
toString() {
return (`My name is ${this.name},I'm ${this.age}`)
}
}
Person.school = "Beijing University";
Person.log("Jack");
// 创建一个实例
var person = new Person("Jason", 30); // ==> Helow Jack,I'm come from Beijing University
console.log(person.toString()) // ==> My name is Jason,I'm 30
console.log(person instanceof Person); // ==> true
console.log(Person instanceof Object); // ==> true
console.log(person.age); // ==> 30
console.log(person.hasOwnProperty('age')); // ==> true
console.log(person.hasOwnProperty('log')); // ==> false
console.log(Person.hasOwnProperty('log')); // ==> true
class People extends Person {
constructor(name, age, sex) {
super(name, age);
this.sex = sex;
this.string = super.toString();
}
speak() {
// console.log(super.toString(), this.total)
console.log(`${this.string}, My sex is a ${this.sex}`)
}
}
const people = new People('Tome', 30, 'Man');
people.speak(); // ==> My name is Tome,I'm 30, My sex is a Man
People.log("Lucy"); // ==> Helow Lucy,I'm come from Beijing University
console.log(people.hasOwnProperty('total')); // ==> false
关于ES6 Class语法相关总结的更多相关文章
- ES6常用语法
ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...
- ES6继承语法
<!--http://www.56.com/u85/v_MTMyNjk1OTc4.html--> <!DOCTYPE html> <html> <head&g ...
- ECMAScript简介以及es6新增语法
ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...
- ES6新语法
ES6新语法概览 简介 ES6是JavaScript语言的新一代标准,加入了一些新的功能和语法,正式发布于2015年6月,亦称ES2015:该标准由ECMA(欧洲计算机制造联合会)的第39号技术专家委 ...
- ES6新语法的介绍
对于ES6新语法,阮一峰有一篇文章介绍的挺详细 http://es6.ruanyifeng.com/#docs/destructuring
- ES6最新语法
ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...
- ES6新语法之let关键字;有别于传统关键字var的使用
ES6新语法于2015年发布:而我这个前端小白在17年才接触到.惭愧惭愧!!不过到目前为止,似乎只有FireFox和Chrome对ES6的支持相对良好.不过既然人家ES6已经出来了,还是要跟上技术的潮 ...
- MySQL语法相关其一
一篇基础语法相关的笔记 // 参考资料: MySQL入门很简单 黄缙华等编著 清华大学出版社 北京 建议进入官网下载对应版本后安装:https://dev.mysql.com/downloads/my ...
- 让 Node.js 支持 ES6 的语法
为了让 Node.js 支持 ES6 的语法, 需要使用 Babel. 安装 es-checker 在使用 Babel 之前 , 我们先检测一下当前 node 对 es6 的支持情况. 在命令行下执行 ...
随机推荐
- 一致性Hash算法(KetamaHash)的c#实现
Consistent Hashing最大限度地抑制了hash键的重新分布.另外要取得比较好的负载均衡的效果,往往在服务器数量比较少的时候需要增加虚拟节点来保证服务器能均匀的分布在圆环上.因为使用一般的 ...
- git add -A 和 git add . 的区别
git add -A和 git add . git add -u在功能上看似很相近,但还是存在一点差别 git add . :他会监控工作区的状态树,使用它会把工作时的所有变化提交到暂存区,包括文 ...
- python response.text和response.content的区别
1.重点理解 response.text返回的类型是str response.content返回的类型是bytes,可以通过decode()方法将bytes类型转为str类型 推荐使用:respo ...
- Oracle12c 之后的路线图
Oracle18c 以及 Oracle19c 的原始版本信息 装载一下别人的博客内容 http://www.cnblogs.com/zhjh256/p/9816499.html 感谢原作者.. 另外 ...
- TCP&UDP基础
TCP TCP/IP是一种网络通讯协议,而socket则是TCP/IP网络最为通用的API,即一种应用程序接口,称为套接字.TCP是面向连接的协议,在进行数据收发前必须连接,且在收发时必须保持该连接. ...
- Android自动化之旅—生成渠道包
美团Android自动化之旅—生成渠道包:http://tech.meituan.com/mt-apk-packaging.html Android Studio系列教程六--Gradle多渠道打 ...
- Delphi报的错误
引入单元时提示Unit 'Unit1' already uses all the units in the project. 可能是没有添加环境变量造成的,需要手动输入代码引用单元. 和Environ ...
- P2236 [HNOI2002]彩票
题目描述 某地发行一套彩票.彩票上写有1到M这M个自然数.彩民可以在这M个数中任意选取N个不同的数打圈.每个彩民只能买一张彩票,不同的彩民的彩票上的选择不同. 每次抽奖将抽出两个自然数X和Y.如果某人 ...
- Hashtable 和 HashMap 以及 ConcurrentHashMap
备忘: ConcurrentHashMap与Hashtable的区别: Hashtable中采用的锁机制是一次锁住整个hash表,从而同一时刻只能由一个线程对其进行操作:而ConcurrentHash ...
- SpringMVC框架并发时出现id变成另外一个用户id问题
今天测试写的代码,出现了在用一个账户登录操作的时候,操作记录的是另外一个id. 经过查找网上的解决方案确认了问题:在controller里面定义了一个userid属性,每次都通过userid传输值.然 ...