ES6.Class
编程语言，都有关于类的定义和使用，java，C#，C++。使用class的关键字，js之前的版本，没有用。保留字，ES6启用了该关键字。
一.传统方法
通过构造函数定义，并生成对象。
//定义传统的类，js之前的写法 function Person(name,salary) { this.name=name; this.salary=salary; } //定义它的方法 Person.prototype.toString=function () { return this.name+","+this.salary; } //如何来获取 let p1=new Person('张晨光',90000); console.log(p1.toString()); //这时候，用的是function来定义一个类。
和传统面向对象语言，写法差别很大，很难受。
接下来，看看ES6是如何写的呢？
二.ES6类的定义：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> //使用ES6来定义类,启用了之前的保留字class class Person{ //构造方法 constructor(name,salary){ this.name=name; this.salary=salary; } //其他方法 toString(){ return `${this.name}，${this.salary}`; } } //使用该类 let p2=new Person('张晨光老师',100000); console.log(p2.toString()); //这种方式，看起来就是面向对象，ES6更加面向对象; console.log(typeof(Person)); //输出的是一个function //证明ES6，class对应了之前的function let result=(Person===Person.prototype.constructor); console.log(result); //证明类本身指向了构造方法. </script> </head> <body> </body> </html>
三.静态方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> //class Person{} const Person=class{ constructor(name,salary){ this.name=name; this.salary=salary; } //自定义方法 showName(){ return `姓名:${this.name}`; } showSalary(){ return `工资：${this.salary}`; } //静态方法 static isFee(salary){ if(salary<5000) return '不用交税'; } } //类定义的结束 //调用之 let p3=new Person('张晨光',4500); console.log(p3.showName()); console.log(p3.showSalary()); //调用类的静态方法;类名.静态方法 console.log(Person.isFee(4500)); </script> </head> <body> </body> </html>
使用静态方法的时候，语法
static 方法名(参数){}
调用的时候：类名.方法名()
四.继承
基本语法
子类 extends 父类，在之前ES5通过修改原型链模式实现。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> //人的定义 class Person{ //构造方法的定义 constructor(name,salary){ this.name=name; this.salary=salary; } //自定义方法 showName(){ return `姓名:${this.name}`; } showSalary(){ return `工资：${this.salary}`; } } //定义一个子类 class YellowPerson extends Person{ //子类如果没有定义construtor,则该方法会默认添加上去，即任何子类都有constructor() //constructor(...args){ super(...args) } //这时候，子类需要针对父类进行加工处理 constructor(name,salary,skin){ super(name,salary);//super()使用，在子类构造方法最前面; this.skin=skin; // } //子类增加一个自己的方法; showInfo(){ //通过super.方法，来调用父类的方法 return super.showName()+","+super.showSalary()+",肤色："+this.skin; } } //调用之; let yp=new YellowPerson('张晨光',8888,'青铜色'); //测试实例; //console.log(yp instanceof YellowPerson); //yp是不是子类的实例 //console.log(yp instanceof Person); //yp是不是父类的实例 console.log(yp.showInfo()); </script> </head> <body> </body> </html>
总结：
1.ES6类定义的语法，使用class 类名{
//构造方法 //自定义方法 }
2.ES6 静态方法的定义和使用
3.ES6 子类继承父类的语法和使用
