---恢复内容开始---

es5中生成实例对象的传统方法是通过构造函数:

function Point(x,y){
this.x = x;
this.y = y;
}
Point.prototype.toString = function(){ return '(' + this.x + ', ' + this.y + ')';
}
var p= new Point(2,3);
console.log(p.toString())

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

class Point{
constructor(x,y){
  this.x = x;
  this.y = x;
}
  toString(){
return '(' + this.x + ', ' + this.y + ')';
  }
}
var p= new Point(2,3);
console.log(p.toString())

  浏览器的执行结果

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

class Point {
// ...
} typeof Point // "function"
Point === Point.prototype.constructor // true
类的数据类型就是函数,类本身就指向构造函数。
constructor方法是类的默认方法,通过new命令生成对象实例时,自动调用该方法。一个类必须有constructor方法,如果没有显式定义,一个空的constructor方法会被默认添加。
class Point {
} // 等同于
class Point {
constructor() {}
}

 如果忘记加上new,像函数那样调用Class,将会报错

class Point {
// ...
} // 报错
var point = Point(2, 3); // 正确
var point = new Point(2, 3);

 super可以继承类

class Animal{
constructor(name){
this.name = name;
}
getName() {
return this.name
}
}
let animal = new Animal('animal');
console.log(animal.getName());
class Cat extends Animal{
constructor() {
super()
this.name = 'cat';
}
}
let cat = new Cat();
console.log(cat.getName())

  运行结果:

使用super()注意

在构造函数中访问this之前一定调用super(),它负责初始化this,如果在调用super()之前之前尝试访问this会导致程序出错

如果不想调用super(),唯一的方法就是让类的构造函数返回一个对象

父类的静态方法可以被子类继承:

class Foo {
static classMethod() {
return 'hello';
}
} class Bar extends Foo {
} Bar.classMethod() // 'hello'

  可计算成员名称:类和对象字面量有很多相似之处,类方法和访问器属性也支持使用可计算名称,用方括号包裹一个表达式可使用计算名称:

let methodName = "sayName";
class PersonClass {
constructor(name){
this.name = name;
}
[methodName](){
console.log(this.name)
}
}
let me = new PersonClass("ninaclass");
me.sayName();//ninaclass

  

---恢复内容结束---

es6中的class的使用的更多相关文章

  1. ES6中的模板字符串和新XSS Payload

    ES6中的模板字符串和新XSS Payload 众所周知,在XSS的实战对抗中,由于防守方经常会采用各种各样严格的过滤手段来过滤输入,所以我们使用的XSS Payload也会根据实际情况作出各种各样的 ...

  2. ES5和ES6中的继承 图解

    Javascript中的继承一直是个比较麻烦的问题,prototype.constructor.__proto__在构造函数,实例和原型之间有的 复杂的关系,不仔细捋下很难记得牢固.ES6中又新增了c ...

  3. ES6中块作用域之于for语句是怎样的?

    在ES6中新加了快作用域的概念(C语言就有,作为类c语言的js,当然应该加上),算是很好理解. { let i; } console.log(i);// i is not defined 在代码块当中 ...

  4. ES6中的var let const应如何选择

    javascript世界里面的每个人都在说有关ECMAScript 6 (ES6,也称作ES 2015)的话题,对象的巨大变化 ( 类 , super() , 等), 函数 (默认参数等), 以及模块 ...

  5. Nodejs与ES6系列4:ES6中的类

    ES6中的类 4.1.class基本语法 在之前的javascript语法中是不存在class这样的概念,如果要通过构造函数生成一个新对象代码 function Shape(width,height) ...

  6. ES6中Arguments和Parameters用法解析

    原文链接 译文 ECMAScript 6 (也称 ECMAScript 2015) 是ECMAScript 标准的最新版本,显著地完善了JS中参数的处理方式.除了其它新特性外,我们还可以使用rest参 ...

  7. ES6中的Class

    对于javascript来说,类是一种可选(而不是必须)的设计模式,而且在JavaScript这样的[[Prototype]] 语言中实现类是很蹩脚的. 这种蹩脚的感觉不只是来源于语法,虽然语法是很重 ...

  8. ES5和ES6中对于继承的实现方法

    在ES5继承的实现非常有趣的,由于没有传统面向对象类的概念,Javascript利用原型链的特性来实现继承,这其中有很多的属性指向和需要注意的地方. 原型链的特点和实现已经在之前的一篇整理说过了,就是 ...

  9. ES6中的高阶函数:如同 a => b => c 一样简单

    作者:Sequoia McDowell 2016年01月16日 ES6来啦!随着越来越多的代码库和思潮引领者开始在他们的代码中使用ES6,以往被认为是"仅需了解"的ES6特性变成了 ...

  10. 深入理解 JavaScript 异步系列(3)—— ES6 中的 Promise

    第一部分,Promise 加入 ES6 标准 原文地址 http://www.cnblogs.com/wangfupeng1988/p/6515855.html 未经作者允许不得转载! 从 jquer ...

随机推荐

  1. zabbix配置邮件告警

    1.安装邮件服务 yum -y install mailx @qq.com #发邮件测试 2.添加报警媒介 输入接收告警邮件的邮箱 3.配置SMTP服务端 使用本机作为SMTP服务器 4.创建触发器 ...

  2. java jdk动态代理(proxy)

    1. 涉及主要jdk api java.lang.reflect.InvocationHandler: public interface InvocationHandler { /** * Proce ...

  3. Linux 下查看字体

    1.查看所有字体 命令:fc-list 2.查看中文字体 命令:fc-list :lang=zh 3.查看更多字体 命令:fc-match -v "AR PL UKai CN"

  4. Centos7安装搜狗输入法.

    系统默认安装输入法管理器的是 ibus. 而搜狗使用 fcitx 1.以我们先要安装 fcitx和必要的软件包 yum -y install fcitx* yum -y install libQtWe ...

  5. 性能测试中TPS上不去的几种原因浅析

    转:https://www.cnblogs.com/imyalost/p/8309468.html 下面就说说压测中为什么TPS上不去的原因: 1.网络带宽 在压力测试中,有时候要模拟大量的用户请求, ...

  6. 揽货最短路径解决方案算法 - V2(增加了时间维度-客户允许的服务时间段,C#/JAVA同步实现,带python作图)

    继上篇,这里改进增加了客户允许服务的时间范围这个维度,并且把C#版本翻译成java,加强了更加形象的图表展示路径(继续是用python的matplotlib作图). 这里的时间范围维度是指:每个客户都 ...

  7. Python--day10(函数(使用、分类、返回值))

    1.  函数 1.  函数: 完成特定功能的代码块,作为一个整体,对其进行特定的命名,该名字就代表这函数 现实中:很多问题要通过一些工具进行处理 => 可以将工具提前生产出来并命名 =>通 ...

  8. SpringMVC 框架介绍以及环境搭建

    目录 前端设计模式介绍 分析前端设计模式 Spring MVC简单介绍 Spring和Spring MVC的关系 配置Spring MVC的环境并简单测试 前端设计模式介绍 前端设计模式其实和前端没啥 ...

  9. flutter 自定义主题切换

    1. 定义local_srorage.dart文件 使用Flutter第三方插件shared_preferences实现存储键值对信息 相关shared_preferences插件可参考: flutt ...

  10. java 锁 Lock接口详解

    一:java.util.concurrent.locks包下常用的类与接口(lock是jdk 1.5后新增的) (1)Lock和ReadWriteLock是两大锁的根接口,Lock代表实现类是Reen ...