一、类
在js语言中，生成实例对象的传统方法是通过构造函数。例如：
function Animal(type,name,age,sex){
this.type = type
this.name = name
this.age = age
this.sex = sex
}
Animal.prototype.print = function(){
console.log(`【种类】:${this.type}`)
console.log(`【名字】:${this.name}`)
console.log(`【年龄】:${this.age}`)
console.log(`【性别】:${this.sex}`)
}
const dog = new Animal("狗","巴顿",5,"公")
dog.print()
for (const key in dog) {
console.log(key)
}
为了更好的，更简洁的书写类。ES6引入了Class类。通过class关键字来定义。ES6的类只是构造函数的语法糖
1、类的简介
通过类改造上面代码
class Animal{
constructor(type,name,age,sex){
this.type = type
this.name = name
this.age = age
this.sex = sex
//constructor方法默认返回实例对象（即this），完全可以指定返回另外一个对象。
}
print(){
console.log(`【种类】:${this.type}`)
console.log(`【名字】:${this.name}`)
console.log(`【年龄】:${this.age}`)
console.log(`【性别】:${this.sex}`)
}
}
const dog = new Animal("狗","巴顿",5,"公")
dog.print()
for (const key in dog) {
console.log(key)
}
（1）constructor 方法
constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用该方法。一个类必须有constructor方法，如果没有显式定义，一个空的constructor`方法会被默认添加。
class Animal {
}
// 等同于
class Animal {
constructor() {}
}
（2）取值函数（getter）和存值函数（setter）
与 ES5 一样，在“类”的内部可以使用get和set关键字，对某个属性设置存值函数和取值函数，拦截该属性的存取行为。存值函数和取值函数是设置在属性的 Descriptor 对象上的，不在原型上。
class Animal{
constructor(name,age){
this.name = name
this.age = age
}
// 创建一个age属性，并给他加上setter,给该属性赋值时，会运行该函数
set age(age){
if(age<0){
age = 0
}else if(age>150){
age = 100
}
this._age = age
}
// 创建一个age属性，并给他加上getter,给该属性赋值时，会运行该函数
get age(){
return this._age + "岁"
}
}
const dog = new Animal("巴顿",5)
console.log(dog.age)
相当于es5中写法如下 Object.defineProperty可定义某个对象成员属性的读取和设置
Object.defineProperty(this,"age",{
set(val){
//...
},
get(){
//...
}
})
（3）属性表达式：可计算的成员名
const printName = "print"
class Animal{
constructor(type,name,age,sex){
this.type = type
this.name = name
this.age = age
this.sex = sex
}
[printName](){
console.log(`【种类】:${this.type}`)
console.log(`【名字】:${this.name}`)
console.log(`【年龄】:${this.age}`)
console.log(`【性别】:${this.sex}`)
}
}
const dog = new Animal("狗","巴顿",5,"公")
dog.print()
for (const key in dog) {
console.log(key)
}
（4）Class类表达式
const A = class { //匿名类 ，类表达式
a = 1
b = 2
}
const a = new A()
采用 Class 表达式，可以写出立即执行的 Class。
let person = new class {
constructor(name) {
this.name = name;
}
sayName() {
console.log(this.name);
}
}('ll');
person.sayName();
2、有关类的注意点
（1）类和模块的内部，默认就是严格模式。类中的所有代码均在严格模式下执行
（2）类声明不会被提升，与 let和 const一样，存在暂时性死区
new A(); // ReferenceError
class A {}
（3）类的所有方法都是不可枚举的
（4）类的所有方法都无法被当作构造函数使用
（5）类的构造器必须使用 new来调用
（6）类的方法内部如果含有this，它默认指向类的实例。
class Person {
printName(name = '小张') {
this.print(`Hello ${name}`);
}
print(text) {
console.log(text);
}
}
const person = new Person();
const { printName } = person;
printName(); // TypeError: Cannot read property 'print' of undefined
原因：printName方法中的this，默认指向Person类的实例。但是，如果将这个方法提取出来单独使用，this会指向该方法运行时所在的环境（由于 class内部是严格模式，所以 this实际指向的是undefined），从而导致找不到print方法而报错。
3、静态成员
如果在一个方法前，加上static关键字，就表示该方法不会被实例继承，而是直接通过类来调用构造函数本身的成员。使用static关键字定义的成员即静态成员
class Chess{
//使用static关键字定义的
static width = 100
static height = 100
static getWidth(){
return `width:${Chess.width}`
}
constructor(name){
this.name = name
}
}
//与使用static关键字定义一样，定义在构造函数身上
Chess.width = 100 //每个棋子都应该有宽高
Chess.getWidth()
注意：
（1）使用static的字段初始化器，添加的是静态成员
（2）没有使用static的字段初始化器，添加的成员位于对象上
class Chess{
static width = 100
static height = 100
step = 1 //相当于直接写在constructor构造器中
constructor(name){
this.name = name
//this.step = 1 //上面代码的效果
}
}
4、类的继承
（1）类的继承简介
Class 可以通过extends关键字实现继承，这比 ES5 的通过修改原型链实现继承，要清晰和方便很多。
如果子类定义了constructor构造器，则必须在constructor的第一行通过super关键字调用父类的构造方法。如果子类没有定义constructor，则会有默认的构造器，该构造器需要的参数和父类一致，并且自动调用父类构造器
class Animal{
constructor(type,name,age,sex){
this.type = type
this.name = name
this.age = age
this.sex = sex
}
static print(){
console.log(`【种类】:${this.type}`)
console.log(`【名字】:${this.name}`)
console.log(`【年龄】:${this.age}`)
console.log(`【性别】:${this.sex}`)
}
}
class Dog extends Animal{
constructor(name,age,sex,weight){
super("犬类",name,age,sex)//通过super关键字调用父类的构造器
this.weight = weight
}
print2(){
console.log(`【性别】:${this.weight}`)
}
}
const dog = new Animal("巴顿",5,"公",100)
dog.print()
注意：父类的静态方法，也会被子类继承。
（2）Object.getPrototypeOf()
可以从子类上获取父类。因此，可以使用这个方法判断，一个类是否继承了另一个类。
Object.getPrototypeOf(Dog)//返回Dog的父类Animal
Object.getPrototypeOf(Dog) === Animal //true
（3）super 关键字
super既可以当函数调用，也可以当对象使用。
a、super作为函数调用：
super作为函数调用时，代表父类的构造函数。ES6 要求，子类的构造函数必须执行一次super函数。否则 JavaScript 引擎会报错。
class A {}
class B extends A {
constructor() {
super();//调用A的构造器。
}
}
注意：super内部的this仍指向B。只能用在子类的构造函数之中，用在其他地方就会报错。
b、super作为对象调用：
class A {
print() {
console.log("我被调用了")
}
}
class B extends A {
constructor() {
super();
super.print(); // "我被调用了"
}
}
const b = new B();
子类B当中的super.p()，就是将super当作一个对象使用。这时，super在普通方法之中，指向A.prototype，所以super.p()就相当于A.prototype.p()。
注意：由于super指向父类的原型对象，所以定义在父类实例上的方法或属性，是无法通过super调用的。
二、符号Symbol
1、普通符号
符号是ES6新增的一个数据类型，它通过使用函数 Symbol(符号描述)来创建。符号设计的初衷，是为了给对象设置私有属性（私有属性：只能在对象内部使用，外面无法使用）
const sym1 = Symbol("这个是描述信息")
const sym2 = Symbol("abc")
console.log(sym1,sym2)//Symbol(这个是描述信息) Symbol(abc)
符号具有以下特点：
- 没有字面量
- 使用 typeof 得到的类型是 symbol
- 每次调用 Symbol 函数得到的符号永远不相等，无论符号名是否相同
- 符号可以作为对象的属性名存在，这种属性称之为符号属性
- 开发者可以通过精心的设计，让这些属性无法通过常规方式被外界访问
- 符号属性是不能枚举的，因此在 for-in 循环中无法读取到符号属性，Object.keys 方法也无法读取到符号属性
- Object.getOwnPropertyNames 尽管可以得到所有无法枚举的属性，但是仍然无法读取到符号属性
- ES6 新增 Object.getOwnPropertySymbols 方法，可以读取符号
const sym = Symbol("这是一个符号属性")
const obj = {
a:1,
b:2,
[sym]:3
}
console.log(obj)//{a: 1, b: 2, Symbol(这是一个符号属性): 3}
const syms = Object.getOwnPropertySymbols(obj)//获取符号属性
console.log(syms)//[Symbol(这是一个符号属性)]
- 符号无法被隐式转换，因此不能被用于数学运算、字符串拼接或其他隐式转换的场景，但符号可以显式的转换为字符串，通过 String 构造函数进行转换即可，console.log 之所以可以输出符号，是它在内部进行了显式转换
const hero = (function(){
const getRandom = Symbol("用于产生随机数")
return{
attack:30,
hp:100,
defence:10,
battle(){
//攻击，伤害:攻击力*随机数
const dmg = this.attack * this[getRandom](0.5,2)
console.log(dmg)
},
[getRandom](min,max){
return Math.random()* (max-min)+min
}
}
})()
console.log(hero)
console.log(hero.battle())//一个数
console.log(hero[getRandom](0.5,2))//Uncaught ReferenceError: getRandom is not defined
2、 共享符号
根据某个符号名称（符号描述）能够得到同一个符号
Symbol.for("符号名/符号描述") //获取共享符号
const syb1 = Symbol.for("abc");
const syb2 = Symbol.for("abc");
console.log(syb1 === syb2)
const obj1 = {
a: 1,
b: 2,
[syb1]: 3
}
const obj2 = {
a: "a",
b: "b",
[syb2]: "c"
}
console.log(obj1, obj2);
3、 知名符号
知名符号是一些具有特殊含义的共享符号，通过 Symbol 的静态属性得到
ES6 延续了 ES5 的思想：减少魔法，暴露内部实现。因此，ES6 用知名符号暴露了某些场景的内部实现
（1）Symbol.hasInstance
该符号用于定义构造函数的静态成员，它将影响 instanceof 的判定
obj instanceof A
//等效于
A[Symbol.hasInstance](obj)
//Function.prototype[Symbol.hasInstance]
function A() {}
Object.defineProperty(A, Symbol.hasInstance, {
value: function (obj) {
return false; //均返回false
}
})
const obj = new A();
console.log(obj instanceof A); //false
console.log(A[Symbol.hasInstance](obj)); //false
（2） Symbol.isConcatSpreadable：响数组的 concat 方法
该数组是否展开。默认是展开
const arr = [3];
const arr2 = [5, 6, 7, 8];
const result = arr.concat(56, arr2)
console.log(result)//[3, 56, 5, 6, 7, 8]
//-------------------
const arr = [3];
const arr2 = [5, 6, 7, 8];
arr2[Symbol.isConcatSpreadable] = false;
const result = arr.concat(56, arr2)
console.log(result)//[3, 56, [5,6,7,8]]
（3）Symbol.toPrimitive：影响类型转换的结果
该对象被转为原始类型的值时，会调用这个方法，返回该对象对应的原始类型值。
class Temperature {
constructor(degree) {
this.degree = degree;
}
[Symbol.toPrimitive](type) {
if (type === "default") {
return this.degree + "摄氏度";
}
else if (type === "number") {
return this.degree;
}
else if (type === "string") {
return this.degree + "℃";
}
}
}
const t = new Temperature(30);
console.log(t + "!");//30摄氏度!
console.log(t / 2); //15
console.log(String(t));//30℃
（4）Symbol.toStringTag：影响 Object.prototype.toString 的返回值
class Person {
[Symbol.toStringTag] = "Person"
}
const p = new Person();
const arr = [32424, 45654, 32]
console.log(Object.prototype.toString.apply(p));//[object Person]
console.log(Object.prototype.toString.apply(arr))//[object Array]
（5）Symbol.iterator：可以改变遍历器方法。
（6）Symbol.split：当该对象被String.prototype.split方法调用时，会返回该方法的返回值
（7）Symbol.search：当该对象被String.prototype.search方法调用时，会返回该方法的返回值。
（8）Symbol.replace：当该对象被String.prototype.replace方法调用时，会返回该方法的返回值。
（9）Symbol.match：当执行str.match(myObject)时，如果该属性存在，会调用它，返回该方法的返回值
（10）Symbol.species：创建衍生对象时，会使用该属性。
log(Object.prototype.toString.apply(p));//[object Person]
console.log(Object.prototype.toString.apply(arr))//[object Array]