一、Class的基本语法

1、简介


基本上,ES6的class可以看作只是一个 语法糖,它的绝大部分功能,ES5都可以做到,新的class写法只是让 对象原型 的写法更加清晰、更像面向对象编程的语法而已。

如果要生成一个对象实例,需要先定义一个构造函数,然后通过new操作符来完成。构造函数实例:

//函数名和实例化构造名相同并且大写(有助于区分构造函数和普通函数)

function Person(name,age){
this.name = name;
this.age = age;
}
Person.prototype.read = function(){
return "我的名字叫" + "this.name" + "今年" + this.age + "岁了";
} var obj = new Person("一诺",18);//通过构造函数创建对象,使用new
console.log(obj.read()) //结果:我的名字叫一诺今年18岁了。

上面代码的代码用ES6改写:

class Person{ //定义一个名为Person的类
constructor(name,age){ //constructor是一个构造方法,用来接收参数
this.name = name;
this.age = age;
}
read(){
return "我的名字叫" + this.name + "今年" + this.age + "岁了"
}
}
var obj = new Person ("一诺",18)
console.log(obj.read()) //我的名字叫一诺今年18岁了

constructor方法是类的构造函数的默认方法,通过new 命令生成对象实例时,自动调用该方法。

class Box{
constructor(){
console.log("这个礼拜天气不错"); //当实例化对象时该行代码会执行
}
} var obj = new Box();
 
constructor方法如果没有显式定义,会隐式生成一个constructor方法。所以即使你没有添加构造函数,构造函数也是存在的。constructor方法默认返回实例对象this,但是也可以指定constructor方法返回一个全新的对象,让返回的实例对象不是该类的实例。
class Desk{
constructor(){
this.ss = "大千世界,无奇不有";
}
}
class Box{
constructor(){
return new Desk();//没有用this,直接返回一个全新的对象
}
}
var obj = new Box();
console.log(obj.ss) //大千世界,无奇不有

class不错在变量提升,所以需要先定义再使用。因为ES6不会把类的声明提升到代码的头部,但是ES5就不一样,ES5存在变量提升,可以先使用,然后再定义

2、静态方法
类相当于实例的原型,所有再类中定义的方法,都会被实例继承。如果再一个方法前加上static关键字,就 表示该方法不会被实例继承,而是直接通过类来调用,这就称为静态方法

 
注意,如果静态方法包含this关键字,这个this指的是类,而不是实例
          类的静态方法不可被实例所继承,却可以被子类继承
3、静态属性
4、class的继承
5、super关键字

ES6之Class类的更多相关文章

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

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

  2. ES6中的类

    前面的话 大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScri ...

  3. 深入理解ES6之——JS类的相关知识

    基本的类声明 类声明以class关键字开始,其后是类的名称:剩余部分的语法看起来像对象字面量中的方法简写,并且在方法之间不需要使用逗号. class Person { //等价于prototype的构 ...

  4. ES6中的类和继承

    class的写法及继承 JavaScript 语言中,生成实例对象的传统方法是通过构造函数.下面是一个例子     function Point(x, y) {  this.x = x;  this. ...

  5. ES6中的类继承和ES5中的继承模式详解

    1.ES5中的继承模式 我们先看ES5中的继承. 既然要实现继承,首先我们得要有一个父类. Animal.prototype.eat = function(food) { console.log(th ...

  6. 160803、如何在ES6中管理类的私有数据

    如何在ES6中管理类的私有数据?本文为你介绍四种方法: 在类的构造函数作用域中处理私有数据成员 遵照命名约定(例如前置下划线)标记私有属性 将私有数据保存在WeakMap中 使用Symbol作为私有属 ...

  7. ES6里关于类的拓展(二):继承与派生类

    继承与派生类 在ES6之前,实现继承与自定义类型是一个不小的工作.严格意义上的继承需要多个步骤实现 function Rectangle(length, width) { this.length = ...

  8. ES6里关于类的拓展(一)

    大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScript 6中 ...

  9. es6入门5--class类的基本用法

    在ES6之前,准确来说JavaScript语言并无类的概念,却有模拟类的做法.相比在类似java这类传统面向对象语言中通过类来生成实例,js则通过构造函数模拟类来生成实例. 这是因为在JS设计初期,作 ...

  10. TypeScript完全解读(26课时)_7.ES6精讲 - 类Class基础

    ES6精讲 - 类Class基础 es5中创建构造函数和实例 原来在es5中的写法 定义好Point后,在原型对象上定义getPostion的方法 实例自身是没有这个方法的,我们调用的时候会去创建他的 ...

随机推荐

  1. mysql-常用组件之触发器

    基本概念 触发器是一种特殊的存储过程,不像存储过程需要显示调用,触发器通过监控表事件(增删改操作)自动触发某条 sql 的执行,可以用于购物车加购后库存减少等场景. 触发器基本操作 1. 创建触发器 ...

  2. IJKPlayer如何支持https

    给ijkplayer安装支持https 首先使用如下终端命令安装yasm 第一: 1. curl http://www.tortall.NET/projects/yasm/releases/yasm- ...

  3. 2018HDU多校训练-3-Problem G. Interstellar Travel

    链接:http://acm.hdu.edu.cn/showproblem.php?pid=6325                                   Interstellar Tra ...

  4. stm32 io操作 头文件规范

    在stm32众多项目开发中,有太多的对io进行操作,若置1或清0,使用官方库提供的函数,固然方便,规范,但是需要包含标准的库,尺寸较大,还得处理不同版本兼容问题,包括io初始化也太繁琐,于是操作原子等 ...

  5. Python3 类的继承小练习

    1.打印并解释结果 class Parent(object): x = 1 class Child1(Parent): pass class Child2(Parent): pass print(Pa ...

  6. Python3 循环和判断小练习

    设计一个函数, 在桌面上创建10个文本, 以数字给它们命名 def text_creation(): path = r'C:\Users\Black\Desktop\test\\' for name ...

  7. 【Maven】聚合

    [Maven]聚合 转载: 使用聚合一次能为多个 maven 项目执行命令,而不用到每一个项目下去执行命令. 聚合 pom 的特殊之处 1.packaging 配置 pom <packaging ...

  8. 3步轻松搞定Spring Boot缓存

    作者:谭朝红 前言 本次内容主要介绍基于Ehcache 3.0来快速实现Spring Boot应用程序的数据缓存功能.在Spring Boot应用程序中,我们可以通过Spring Caching来快速 ...

  9. PostgreSQL 、springboot 、spring data jpa 集成

    项目地址:https://gitee.com/zhxs_code/PostgreSQL_springboot_jpa_demo.git 增删查改都已经实现. 重点部分: 1.定义自己的方言. pack ...

  10. 重学前端--js是面向对象还是基于对象?

    重学前端-面向对象 跟着winter老师一起,重新认识前端的知识框架 js面向对象或基于对象编程 以前感觉这两个在本质上没有什么区别,面向对象和基于对象都是对一个抽象的对象拥有一系列的行为和状态,本质 ...