ES6中的Class方法与早期JavaScript方法有哪些本质区别

各位老铁们，下面我们来探讨一下es6中的class类方法与早期的javascript方法有哪些本质的区别？在分析问题之前我们先简单了解一下，什么是es6，它有哪些特性。ES6全称是ECMAScript 6是JavaScript在2015年6月发布的一个重要版本，进行了大量的改进和新增的相关的新特性。包括变量申明（使用let申明块级作用域，解决var导致作用域混乱的现象；新增const关键字，一旦被申明就不能被修改；）、模板字符串（为字符串提供拼接与插值嵌入表达式；）、箭头函数（简化函数定义过程，解决函数内部this指向问题；）、新增解构函数（利用解构函数可以快速提取对象和数组中的数据问题；）、增加了类和继承的概念（从此让JS具有面向对象编程的可能）等等。这些新特性对于JavaScript编程和质量有了一个质的飞跃；
说回来下面来分析class特性及使用技巧以及早期javascript函数比较：

Class具有隔离特点

解决了早期JavaScript所有函数在项目中定义必须保持唯一性的问题，定义在class类中的方法有各自独特的区间概念，哪怕方法名一致其在内存中指向也是不同的，使得js编程具有对象的概念；

• 在es6中类是可以被继承的，如上图左边部分继承之后可以调用类2中的m1、m2和m3等所有方法，同时m1也称之为方法的重载作用；

• 在es6中因为有class作为区域空间，所有相同的方法名函数可以被定义不同的类中互相不冲突；

• 在早期的JavaScript中在同一作用域下如果同时导入了两个全局组件，而它们都定义了相同方法名的函数，此时就会被后加载的js所覆盖；

• es6 class 本质上是语法糖，底层仍然基于原型链，而JavaScript则直接操作函数和原型链。如下ES6class 中的方法仍然挂载在原型上：

  class Person {
       
      sayHello() {
       }
  }
  console.log(typeof Person); // 输出: function
  console.log(Person.prototype.sayHello); // 输出: [Function: sayHello]
  

Class独有的类特性

ES6 class支持getter、setter属性可以方便清晰的定义实体对象，同时还支持私有字段的定义，可以真正的隐藏哪些变量和方法不被暴露；而早期JavaScript则没有原生的 getter 和 setter，需要通过 Object.defineProperty 实现，更没有私有字段的概念，通常通过闭包或命名约定（如 _age）模拟，被模拟出来的属性如果外部想调用也是可以直接访问的，需要靠开发人员去约束、容易出现错误；

ES6 class新增属性

//支持getter和setter属性
class Person {
   
    constructor(name) {
   
        this._name = name;
    }
    get name() {
   
        return this._name;
    }
    set name(value) {
   
        this._name = value;
    }
}
const person = new Person("Alice");
console.log(person.name); // 输出: Alice
person