ES6 面向对象 VS ES5 面向对象（伪）

计算机语言发展简史

机器语言（0和1，面向硬件）
⬇
汇编语言（英文单词）
⬇
低级语言（相比高级语言更加接近计算机的底层，如c语言，面向过程/函数，以函数为单位进行功能的数据和方法的封装）
⬇
高级语言（不直接操作计算机的底层，如js、java、python，面向对象，将针对某一功能的方法、数据封装到对象中）
⬇
模块系统（封装许许多多的对象）
⬇
框架（封装许许多多的模块）
⬇
系统接口（API）

ES5面向对象（伪面向对象，假的）

存在的问题：没有统一的写法

1 . 类的声明方法

这是一种写法：

//没有专门的类声明方法，以函数的形式来写类
function Person(name,age){//1.既是构造函数又是类
  this.name = name;
  this.age = age; 
 }
 //给类添加方法
Person.prototype.showName = function(){//2.方法独立在类之外
	console.log(this.name);
 }
Person.prototype.showAge = function(){
	console.log(this.age);
}
let p = new Person('yinzhiyuan',12);
p.showName();
p.showAge();

还有一种写法，虽然会有问题，但也能实现功能

//没有专门的类声明方法，以函数的形式来写类
function Person(name,age){//1.既是构造函数又是类
 this.name = name;
 this.age = age; 
 //给类添加方法
 this.showName = function(){//2.方法写在类里
   console.log(this.name);
 }
 this.showAge = function(){
   console.log(this.age);
 }
}
let p = new Person('yinzhiyuan',12);
p.showName();//yinzhiyuan
p.showAge();//12

当使用两种写法的代码混在一起，看起来混乱，不方便阅读

2.实现继承父类的属性和方法

function Person(name,age){//1.既是构造函数又是类
 this.name = name;
 this.age = age; 
 //给类添加方法
 this.showName = function(){//2.方法在类里
   console.log(this.name);
 }
 this.showAge = function(){
   console.log(this.age);
 }
}
function Worker(name,age,job){
  Person.call(this,name,age);//this是Worker对象，实现父类属性的继承
  this.job = job;//加上自身的属性
}
Worker.prototype = new Person();//将父类Person的实例作为Worker的原型，来继承父类的方法
Worker.prototype.constructor = Worker;//修正Worker的构造方法
Worker.prototype.showJob = function(){//添加自己的方法
  console.log(this.job);
}
let w = new Worker('dada',12,'singer');
w.showName();
w.showJob();

还有其他的写法，看起来很乱

ES6面向对象（真的）

提供了4个新的关键字，用于解决上面的问题，统一写法

• class：类声明
• constructor：构造函数/构造器
• extends：继承
• super：超类/父类

1 . 类的声明方法

 //有单独的类的声明和构造函数的声明
class Person{//类
  constructor(name,age){//构造函数
    this.name = name;
    this.age = age;
  }
  showName(){
    console.log(this.name);
  }
  showAge(){
    console.log(this.age);
  }
}
let p = new Person('yinzhiyuan',18);
p.showName();
p.showAge();

2.实现继承父类的属性和方法

//有单独的类的声明和构造函数的声明
class Person{//类
  constructor(name,age){//构造函数
    this.name = name;
    this.age = age;
  }
  showName(){
    console.log(this.name);
  }
  showAge(){
    console.log(this.age);
  }
}
class Worker extends Person{//继承关键字extends
  constructor(name,age,job){
    super(name,age);//超类/父类 直接继承父类的属性
    this.job = job;//加上自身的属性
  }
  //只要用了extends关键字来实现继承，会自动继承父类的方法
  //加上自身的方法
  showJob = function(){
    console.log(this.job);
  }
}
let w = new Worker('dd',13,'dancer');
w.showName();
w.showJob();

好处：写法统一，更加简洁方便