前言
在学习类之前我们先来了解一下面向对象和面向过程
面向对象：是一种开发思想，一切皆为对象。对象是属性和行为的结合体
面向过程：也是一种开发思想。开发中的每个细节，开发者都需要考虑到。
面向对象的三大特性
（1）封装性：对象是属性和行为的封装体——数据安全
（2）继承性：子类可以继承父类父类的属性和方法——代码复用
（3）多态性：同一个消息传递给不同对象，出现的效果不同——应用灵活，可以适应不同的需求
类
定义：具有相同属性和行为的集合
ES5中实现类的方法：构造函数，在构造函数中封装了属性和方法。缺陷是构造函数和普通函数的定义方式是一样的，容易混淆。
ES6中类的定义方式：语义性更强、语法更简洁
class 类名{
属性
行为
}
class是关键字，专门用来定义类
// 用class定义Student类
class Student{
constructor(id,name,sex){ //构造函数 id,name,sex是属性
this.id = id,
this.name = name,
this.sex = sex
}
display(){
console.log('学号',this.id)
console.log('姓名',this.name)
console.log('性别',this.sex)
}
}
// 使用Student类创建对象:创建对象时，不能显式的使用constructor 必须用类名创建 默认调用constructor函数
let stu1 = new Student(01,'孙悟空','男');
let stu2 = new Student(02,'白骨精','女');
let stu3 = new Student(03,'紫霞仙子','女');
// 使用对象
stu1.display();
console.log('---------------')
stu2.display();
console.log('---------------')
stu3.display();
ES6中支持getter/setter方法来获取属性值、设置属性值
（1）定义get()方法、set()方法的目的是：用于隐藏对象的属性名
（2）在使用get()方法、set()方法时不用带'()'
类定义时需要注意的问题：
（1）类的属性和函数：类可以由属性也可以没有属性，可以由方法也可以没有方法
（2）类的属性是放在构造方法中初始化的，若类没有属性，可以不显式定义构造方法，此时，系统会自动生成一个无参的控的构造方法
类属性的setter/getter函数
1、作用：在面向对象开发中，对象是属性和行为的结合体（封装性），不能在对象的外部直接访问属性，若需要访问对象的属性，通过getter/setter方法来进行，就相当于在对象的外部屏蔽了对象的属性
2、用法：下面代码定义了Location类 并且使用get set函数
// 定义类
class Location{
constructor(){
this._row = 0,
this._column = 0,
this._maxValue = 0
}
get row(){
return this._row;
}
set row(row){
this._row = row;
}
get column(){
return this._column;
}
set column(column){
this._column = column;
}
get maxValue(){
return this._maxValue
}
set maxValue(max){
this._maxValue = max;
}
}类的继承
1、基本概念
（1）基类（父类）：可以派生子类的类
（2）派生类（子类）：由父类派生而来的类
2、继承的实现
（1）ES5中的继承实现，没有类的概念
a、构造函数：构造函数就是类名，在ES5中类的继承实际就是构造函数的继承
b、实现：通过call、apply、bind
// 定义构造函数：基类
function Father(name){
this.name = name,
this.age = 45
this.disp = function(){
console.log('姓名',this.name);
console.log('年龄',this.age);
}
}
// 定义构造函数：
function Son(name){
Father.call(this,name);
this.height = '189cm';
this.show = function(){
this.disp();
console.log('身高',this.height);
}
}
let son = new Son('赵四')
son.show();
（2）ES6中的继承实现 extends实现继承
a、super：指向父类，super(参数)表示调用父类的构造函数
b、如果在子类的构造函数中调用父类的构造函数，那么super()必须作为子类构造函数中的第一条语句(在执行子类的构造函数之前，必须先执行父类的构造函数(先有父，再有子))
c、方法覆盖(方法重写OverWrite):在继承过程中，若父类的某个方法与子类的某个方法同名，则子类方法覆盖父类的同名方法
d、在子类的方法中可以使用super调用父类中的某个方法
e、不允许多继承，只能单继承
多继承：类的直接父类有多个
单继承：类的直接父类只有一个
// 定义父类
class Father{
constructor(name,age){
this.name = name,
this.age = age
}
fun(){
console.log('我是父类中的方法');
}
show(){
console.log('姓名',this.name);
console.log('年龄',this.age);
}
}
class Mother{
constructor(a,b){
this.a = a,
this.b = b
}
}
// 定义子类 继承Father类
class Son extends Father{
constructor(name,age,height){
super(name,age);//调用父类的构造函数
this.height = height;
}
hobby(){
console.log('我喜欢羽毛球~');
}
show(){
super.show();
console.log('身高',this.height);
}
}
let s1 = new Son('小王同学',22,'187cm');
s1.hobby();
s1.show();
s1.fun();
继承的好处
在父类中定义好的属性和方法，子类继承后可直接使用
类继承过程中的向上转型
子类对象的类型一定是父类的类型，反之父类对象的类型不能是子类的类型。
注：
（1）typeof：用于判断变量的数据类型（基本数据类型）
typeof 变量名 == ‘数据类型’
（2）instanceof：用于判断变量的数据类型（类类型）
ES6的模块化管理
1、Node.js简介
（1）Node是什么
a、浏览器内核有两个引擎：渲染引擎(渲染html/css)、JavaScript引擎()运行JavaScript代码
b、Node是独立于浏览器的JavaScript的运行环境，通常将Node称为JavaScript的服务器运行环境
（1）Node相当于运行JavaScript程序的虚拟机
（2）是JavaScript的工具库 Node.js内部采用Google公司的V8引擎
（2）使用Node的原因：有了Node后JavaScript就正式成为一个工程化的语言。
2、安装Node.js
（1）环境变量的设置的目的：在自定义的目录下运行程序时，操作系统可以找到相应的指令
3、ES6中的模块化管理
1、ES6的方式：
（1）一个.js文件就是一个模块采用“module”方式管理。即用exports导出，用import...from导入、
文件名：主文件名.扩展名
.扩展名作用：指定文件类型 例如： .mp3:音频文件 .mp4:视频文件 .jpg .png 图片文件
（2）Node的方式：采用“CommonJS”方式。即export.module=‘变量名’导出，用require导入
2、在VSCode中配置ES6的模块管理环境
（1）：初始化环境，在存放js文件的文件夹下执行：npm init -y（生成package.json文件）
（2）：在package.json文件中加入:"type":module（表示采用的是ES6的模块化）
（3）导出/导入变量
（4）导入/导出整个模块：使用“通配符”，表示导入所有
（5）默认导出（export default）
1.一个模块只能有一个默认导出，对于默认导出，导入的名称可以和导出的名称不一致
2、混合导出
3、重命名export和import
到此这篇关于JavaScript ES6中类与模块化管理超详细讲解的文章就介绍到这了,更多相关JS ES6类与模块化管理内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网！
