一、Class
ES6中的Class用法类似Java的Class用法，但class的本质是js一个function
//定义类 class Person { //定义构造方法 constructor(name, age){ console.log("父类构造方法") this.name = name; this.age = age; } getInfo(){ return `姓名：${this.name} , 年龄： ${this.age}`; } } let person = new Person("Jack", 10); console.log(person); console.log(person.getInfo()); //通过extends 实现继承 class BlackPerson extends Person{ constructor(name, age, height){ super(name, age); console.log("子类构造方法"); this.height = height; } //重写父类方法 getInfo(){ return `姓名：${this.name} , 年龄： ${this.age} , 身高： ${this.height}`; } } let xiaohei = new BlackPerson("xiaohei", 24, 160); console.log(xiaohei); console.log(xiaohei.getInfo());
二、模块化export
在创建JavaScript模块时，export 语句用于从模块中导出函数、对象或原始值，以便其他程序可以通过 import 语句使用它们。
export.js
let name = 'Jack'; let age = 11; let func = function () { return `姓名： ${name} ,年龄：${age}`; }; let myclass = class myClass{ static a = "呵呵"; } //export {name, age, func, myclass}; export default { name: name, age: age, getInfo(){ return `姓名：${this.name} , 年龄： ${this.age}`; } }
es6模块.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> 1 <script type="module"> //import {name, age, func, myclass}; import student from "./js/export.js"; console.log(student); console.log(student.getInfo()); </script> </body> </html>
结果：
