class是ES6引入的,它并不是一种全新的继承模式,而只是基于原型对象继承封装的语法糖,因此只要充分理解原型对象,原型链,继承等知识,class也就很好容易理解了

类的声明

ES5及之前是通过创建一个构造函数(Fn)以及将方法指派到该构造函数的原型对象(Fn.prototype)上,来创建一个类。

在ES6中类的声明就十分简单了,只要以class关键字开始, 接上类名, 最后将方法编写在花括号{}里面。(注意点:方法之间不需要逗号,方法之间不需要逗号,方法之间不需要逗号

class Person {
// 等价于 Person构造函数
constructor(name) {
this.name = name;
}
// 等于Person.prototype.sayHello
sayHello() {
console.log(`Hello, my name is ${this.name}`);
}
} let me = new Person('mxk');
console.log(me.name); // mxk
console.log(me.sayHello()) // Hello, my name is mxk console.log(me instanceof Person) // true
console.log(typeof Person) //function
console.log(Object.getPrototypeOf(me) === Person.prototype) // true
console.log(Person.prototype.constructor === Person) // true

类表达式

匿名函数表达式

let Person = class {
constructor(name) { this.name = name; }
}

具名函数表达式

let Person = class Person1{
constructor(name) { this.name = name; }
}

与函数的声明和表达式不同,函数声明是会被提升的,但是类的声明和表达式都不存在提升,因此它们主要的不同就是代码风格

类的特点

  1. 类声明不会被提升,这与函数定义不同。类声明的行为与 let 相似,因此在程序的执行到达声明处之前,类会存在于暂时性死区内。
  2. 类声明中的所有代码会自动运行在严格模式下,并且也无法退出严格模式。
  3. 类的所有方法都是不可枚举的,而自定义类创建的方法默认是可枚举的
  4. 类的所有方法内部都没有 [[Construct]] ,因此使用 new 来调用它们会抛出错误。
  5. 调用类构造器时不使用 new ,会抛出错误。
  6. 不得修改类内部的类名

模拟类的创建

let/*不会被提升*/ Person /*外部可以访问的*/  = (function() {
"use strict"; /*运行在严格模式下*/ const /*不能修改内部的类名*/ Person1 = function(name) {
if (new.target === void 0) {
throw new Error('构造函数必须使用new');
}
this.name = name;
} Object.defineProperty(Person1.prototype, 'sayHello', {
value: function() {
if (new.target !== void 0) {
throw new Error('类内方法调用不能使用new')
}
console.log(`Hello, my name is ${this.name}`);
},
enumerable: false, /*类内所有的方法都是不可枚举的*/
writable: true,
configurable: true
}) return Person1;
})();

类的声明和表达式基本是一致的,函数声明暴露给外部的类名和内部的类名是相同的,类表达式的话只有赋值符号左边的类名是我们可以访问的,右侧那个是内部的类名

立即调用类构造函数

let me = new class {
constructor(name) { this.name = name; } sayHello() {
console.log(`Hello, my name is ${this.name}`);
}
}('mxk'); console.log(me.name) // mxk
console.log(me.sayHello()) // Hello, my name is mxk

使用这种模式你无法访问到类,因为外部可以访问的类名它并没有暴露出来

访问器属性

class Person {
constructor(name, age) {
this.name = name;
this.__age = age
} get age() {
return this.__age;
} set age(value) {
this.__age = value + 1;
}
}
相当于
Object.defineProperty(Person.prototype, 'age', {
enumerable: false, /*不可枚举*/
configurable: true,
get() { return this.__age; },
set(value) { this.__age = value + 1; }
})

静态成员

直接定义在构造函数对象上的方法,实例对象无法访问到

class ClassType {
constructor() {
this.type = 'class_type';
} static create() {
return new ClassType();
}
} let ct = ClassType.create();
console.log(ct.type); //class_type
console.log(ct.create); // undefined

class(一)--类的创建的更多相关文章

  1. C# 根据类名称创建类示例

    //获得类所在的程序集名称(此处我选择当前程序集) string bllName = System.IO.Path.GetFileNameWithoutExtension(System.Reflect ...

  2. php简单实用的操作文件工具类(创建、移动、复制、删除)

    php简单实用好用的文件及文件夹复制函数和工具类(创建.移动.复制.删除) function recurse_copy($src,$dst) {  // 原目录,复制到的目录 $dir = opend ...

  3. 李洪强iOS开发之OC[013] -类的创建的练习

    // //  main.m //  12 - 类的创建练习 // //  Created by vic fan on 16/7/9. //  Copyright © 2016年 李洪强. All ri ...

  4. C++:类的创建

    类的创建 #include<iostream> #include<cmath> using namespace std; class Complex //声明一个名为Compl ...

  5. 2--OC -- 类的创建与实例化

    2.OC -- 类的创建与实例化   一.OC类的简述 1.OC类分为2个文件:.h文件用于类的声明,.m文件用于实现.h的函数: 2.类是声明使用关键字:@interface.@end : 3.类是 ...

  6. JAVA类的创建: 创建JAVA的类 ,JAVA的字段,JAVA类的方法

    1. 创建Java的类 如果说Java的一切都是对象,那么类型就是决定了某一类对象的外观与行为.可是类型的关键字不是type,而是class,创建一个新的类型要用下面的代码: 1 2 3 class ...

  7. python 通过元类控制类的创建

    一.python中如何创建类? 1. 直接定义类 class A: a = 'a' 2. 通过type对象创建 在python中一切都是对象 在上面这张图中,A是我们平常在python中写的类,它可以 ...

  8. Day 5-7 exec 和元类的创建.

    exec方法 元类 exec(str_command,globals,locals)参数1:字符串形式的命令参数2:全局作用域(字典形式). 如果不指定,默认globals参数3:局部作用(字典形式) ...

  9. Egret 类的创建和继承--TypeScript

    class test extends egret.DisplayObjectContainer { /** * 类的创建 */ //属性 name: string; age: number; ts: ...

  10. 快速创建SpringBoot2.x应用之工具类自动创建web应用、SpringBoot2.x的依赖默认Maven版本

    快速创建SpringBoot2.x应用之工具类自动创建web应用简介:使用构建工具自动生成项目基本架构 1.工具自动创建:http://start.spring.io/ 2.访问地址:http://l ...

随机推荐

  1. Ubuntu16.04深度学习基本环境搭建,tensorflow , keras , pytorch , cuda

    Ubuntu16.04深度学习基本环境搭建,tensorflow , keras , pytorch , cuda Ubuntu16.04安装 参考https://blog.csdn.net/flyy ...

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:选择框(Select)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. SQL中limit的用法

    limit子句用于限制查询结果返回的数量 格式: select * from tableName limit i,n # tableName:表名 # i:为查询结果的索引值(默认从0开始),当i=0 ...

  4. 「SCOI2010」连续攻击游戏

    传送门 Luogu 解题思路 二分图匹配,关键是建图. 如果我们naive地直接把每个武器的两个属性分为两部建图的话,显然是跑不了的. 我们考虑把每一个武器的属性向它连边:\(a_i \rightar ...

  5. php 实现店铺装修1

    一.原型分析 1.店铺未装修的情况下,使用默认样式,哪个是默认样式由后台告知: 2.所有的样式由后台进行维护(但后台始终有一个默认样式,不可删除不可编辑),所有样式,只要用户未编辑过,则默认按照商品的 ...

  6. jmeter之Xpath提取器

    首先创建线程组,添加http请求,具体的设置如图1所示: 图1 然后,再添加后置处理器中的XPath Extractor,具体的参数设置,以及表达式如图2: 图2 可以添加Debug PostProc ...

  7. JuJu团队1月2号工作汇报

    JuJu团队1月2号工作汇报 JuJu   Scrum 团队成员 今日工作 剩余任务 困难 飞飞 -- 测试dataloader 无 婷婷 调试代码 提升acc 无 恩升 -- 测试dataloade ...

  8. Python测试进阶——(5)Python程序监控指定进程的CPU和内存利用率

    用Python写了个简单的监控进程的脚本monitor190620.py,记录进程的CPU利用率和内存利用率到文件pid.csv中,分析进程运行数据用图表展示. 脚本的工作原理是这样的:脚本读取配置文 ...

  9. 编程练习:实现树的层次遍历 (CVTE笔试)

    直接层次遍历是比较简单的,但是题目要求的分层打印,这就变得稍微有些麻烦 我是采用两个队列的方法实现. 1.将树结构入队列1. 2.当队列1和队列2都不为空的时候,则一直循环. 3.当队列1不为空的时候 ...

  10. 题目:给定一数组 例如:a = [1,2,3,5,2,1] 现用户提供一个数字 请返回用户所提供的数字的所有下标

    def test(ary): ds = {} for i in range(len(ary)): if ds.get(ary[i]): ds[ary[i]].append(i) else: ds[ar ...