JavaScript(ES6-10)语法详解 —— ES6基础知识【Class类】

Class基础语法

ES5声明一个类

定义既带属性，又带通用方法的类

let Animal = function(type) {
          
   
	this.type = type;
	this.eat = function() {
          
   
		console.log(jack eating)
	}
}
let dog = new Animal(dog);
let monkey = new Animal(monkey);
console.log(dog); // 在属性中即会有type属性,又会有eat函数
console.log(monkey);// 在属性中即会有type属性,又会有eat函数
// 然而eat函数是通用方法,我们并不应该定义在function中

定义带有属性的类，并使用原型链的方式声明通用方法

let Animal = function(type) {
          
   
	this.type = type;
}
Animal.prototype.eat = function() {
          
   
	console.log(jack eat);
}
let dog = new Animal(dog);
let monkey = new Animal(monkey);
console.log(dog); // 在属性中只会有type属性,打开_prototype属性查看原型链会发现eat函数定义在原型链中
console.log(monkey);// 在属性中只会有type属性,打开_prototype属性查看原型链会发现eat函数定义在原型链中
// 此时如果想修改通用方法,可以使用如下方式
monkey.constructor.prototype.eat = function() {
          
   
	console.log(changed);
}
// 此时即使是通过monkey修改的,依旧会修改dog原型链中的eat函数,因为他们是同一个Animal原型链

ES6声明一个类

class Animal {
          
   
	constructor(type) {
          
   
		this.type = type;
	}
	eat() {
          
   
		console.log(jack eat);
	}
}
let dog = new Animal(dog);
let monkey = new Animal(monkey);
console.log(dog); // 在属性中只会有type属性,打开_prototype属性查看原型链会发现eat函数定义在原型链中
console.log(monkey);// 在属性中只会有type属性,打开_prototype属性查看原型链会发现eat函数定义在原型链中
// 注意!!
// 在Class中定义function会声明在原型链中,因为没有放在constructor中
console.log(typeof Animal); // Animal查看类型同样是function

Setter&Getter

如何读写属性

Static Methods

如何操作方法

Sub Classes

如何继承一个类

Default Parameters

函数参数的默认值

Rest Parameter

怎么处理不确定参数

Spread Operator

rest参数的逆运算

Arrow Functions

箭头函数