前言

写本《JavaScript简餐》系列文章的目的是记录在阅读学习《JavaScript高级程序设计（第4版）》一书时出现的各个知识点。虽是对读书的笔记和总结，但是希望它轻量、简洁、犀利，不会引起阅读疲劳，可以在碎片化时间和闲暇之余轻巧地沐浴一下知识点。每篇文章只针对一个小部分进行讲解式的梳理，来达到个人复习总结和分享知识的目的。

一、类

诸如C++和JAVA这类语言它们都有类这么一说，可以用来封装自己的类型。JavaScript也不能说没有，只不过一直以来都是用function()和ES5的特性来强撑出来一个这么一个“类”，但就是总感觉别扭，觉得它还不太正宗！正因如此，实现继承的代码也显得非常冗长和混乱，活像一锅东北铁锅炖。为解决这些问题，ES6中新引入了class关键字，具有正式定义类的能力。是的，那个男人回来了。虽然ES6的类表面上看起来可以支持正式的面向对象编程，但实际上它背后使用的仍然是原型和构造函数的概念，是ES中新的基础性语法糖。

二、类定义

与函数类型相似，定义类也有两种主要方式：类声明和类表达式。这两种方式都使用class关键字加大括号。如下面的代码所示

class Person {}
const Person = class {}; // 都可以

与函数表达式类似，类表达式在它们被求值前也不能引用。不过，与函数定义不同的是，虽然函数声明可以提升，但类定义不能。下面的示例给出了演示：

console.log(FunctionDeclaration); // [Function: FunctionDeclaration]
function FunctionDeclaration() {}console.log(ClassExpression);  // ReferenceError: Cannot access 'ClassExpression' before initialization
class ClassExpression {}

如此，函数提前使用没问题，会打印出相关信息，但是类要是在初始化前使用，那就会报ReferenceError错误。另一个函数与类不同的地方是函数受作用域限制，但是类会受到块作用域限制。如下所示：

{function FunctionDeclaration() {}class ClassExpression {}
}console.log(FunctionDeclaration); // [Function: FunctionDeclaration]
console.log(ClassExpression);  // ReferenceError: ClassExpression is not defined

像这样，如果将类定义在一个块中，在块的外部访问时，打印信息直接告诉我们没有定义类。再来看一下类的构成，类可以包含构造函数方法、实例方法、获取函数、设置函数和静态类方法，不过类中不包含这些也同样有效。如下所示：

class Person() {}; //空类定义，有效class Person {constructor() {} // 可以有构造函数
}class Person {sayName() {} // 可以有实例方法
}class Person {get myName() {} // 可以有获取函数
}class Person {set myName(name) {} // 可以有设置函数
}class Person {static sayName() {} // 可以有静态方法
}

默认情况下类定义中的代码都会在严格模式下执行。类名建议首字母要大写，以区别于通过它创建的实例。（例如通过Class Person {}创建person实例）。类表达式是可选的。在把类表达式赋值给变量后，可以通过name属性获取类表达式的名称字符串。但不能在类表达式作用域外部访问这个标识符。如下所示：

let Person = class PersonName {sayClassName () {console.log(Person.name, PersonName.name);}
}let p = new Person();p.sayClassName(); // PersonName PersonNameconsole.log(Person.name); // PersonName
console.log(PersonName.name); // ReferenceError: PersonName is not defined

三、总结

以上就是今天要讲的内容，今天简单地介绍了一下类的概念、类的定义方法、类的提升限制、类的作用域限制、以及类的构成和获取name标识符时要注意的作用域限制。下一篇我们来介绍一下类构造函数。撒花~

JavaScript简餐——类，那个男人回来了！相关推荐

JavaScript简餐——类构造函数
文章目录前言一.类的构造函数及其实例化二.把类当成特殊函数三.总结前言写本<JavaScript简餐>系列文章的目的是记录在阅读学习<JavaScript高级程序设计(第 ...
JavaScript简餐——关于类的继承
文章目录前言一.继承基础二.super关键字三.抽象基类四.总结前言写本<JavaScript简餐>系列文章的目的是记录在阅读学习<JavaScript高级程序设计(第 ...
JavaScript简餐——寄生组合继承
文章目录前言一.什么是寄生组合继承? 二.寄生组合继承的基本模式三.总结前言写本<JavaScript简餐>系列文章的目的是记录在阅读学习<JavaScript高级程序设计 ...
JavaScript简餐——细看函数的参数
文章目录前言一.理解参数二.箭头函数中的参数三.总结前言写本<JavaScript简餐>系列文章的目的是记录在阅读学习<JavaScript高级程序设计(第4版)> ...
JavaScript简餐——代理Proxxy与反射（三）
文章目录前言一.跟踪属性访问二.隐藏属性三.属性验证四.函数与构造函数参数验证五.数据绑定与可观察对象总结前言写本<JavaScript简餐>系列文章的目的是记录在阅读学 ...
JavaScript简餐——那些函数属性与方法（call、apply和bind）
文章目录前言一.arguments对象的callee属性二.函数的caller属性三.new.target 四.call.apply和bind方法 1.call方法 2.apply方法 3.b ...
JavaScript简餐——代理Proxxy与反射（二）
文章目录前言一.可撤销代理二.代理另一个代理三.代理的问题与不足四.总结前言写本<JavaScript简餐>系列文章的目的是记录在阅读学习<JavaScript高级程序 ...
JavaScript简餐——关于盗用构造函数
文章目录前言一.什么是盗用构造函数? 二.使用实例三.参数传递四.盗用构造函数的问题所在五.总结前言写本<JavaScript简餐>系列文章的目的是记录在阅读学习<Ja ...
JavaScript简餐——闭包
文章目录前言一.闭包概念二.闭包的副作用三.闭包的用途 1.在函数外部读取函数的内部变量 2.利用外部函数变量缓存值四.总结前言写本<JavaScript简餐>系列文章的目的 ...

JavaScript简餐——类，那个男人回来了！

文章目录

前言

一、类

二、类定义

三、总结

JavaScript简餐——类，那个男人回来了！相关推荐

最新文章

热门文章