ES6中的类
-
类的写法
class Person{ height="178cm"; constructor(name,age){ //属性 this.name = name; this.age = age; } //方法 getName(){ console.log("姓名是:"+this.name); } } let student = new Person("张三",20); student.getName();
-
静态方法和属性:实例不会继承的属性和方法
class Person{ //静态方法 static hobby(){ console.log("喜欢篮球"); } } //静态属性 Person.height = "178cm"; //通过类来调用 Person.hobby(); console.log(Person.height);
-
类的继承
class Dad{ name = "张三"; age = 40; constructor(height){ this.height = height; } hobby(){ console.log("喜欢篮球"); } } class Son extends Dad{ constructor(height){ //表示父类的构造函数 super(height); } }
-
私有成员 “#”符号
class Person{ #height = "178cm"; constructor(name){ this.name = name; } }
es6模块化
-
浏览器默认模块化 script 里加入 “type=module”;
-
导出 关键字 export
-
导出 方式一 :
export { a ,b , c};
-
导出方式二 关键字 “as”
export { a as aa ,b , c};
-
导出方式三
export let c = ()=>{console.log("I am function...")};
-
导出方式四
export default a;
- 等同
export {a as default};
-
export 可以导出多个,export default 只能导出一个;
-
-
导入方式:关键字 import
-
export导出的,命名要保持一致
import {aa , b , c} from './moduleb.js';
-
export导出的,命名可以自定义;
import myfn from './moduleb.js';
-
通配符 "*"方式导入
import * as obj from './moduleb.js';
-
-
按需导入(延迟导入)
import 方法;
document.onclick =async function(){
// import {fn1} from './fn.js';
let res = await import("./fn.js");
console.log(res);
}
王者荣耀选择英雄案例
- 抽象玩家类
- 抽象英雄类
- 抽象技能类
- 抽象游戏管理类
- 模块化分各类
- 扩展英雄及技能
- 亚瑟
- 契约之盾
- 回旋打击
- 圣剑裁决
- 鲁班
- 河豚手雷 S11210
- 无敌鲨嘴炮S11220
- 空中支援 S11230