欢迎访问响应式个人博客!
男生版
女生版
初遇时,她的微笑,她往日的深情、承诺和傻劲,两个人共度的美丽时刻,一一印在回忆里,今天的感情已经比不上从前,但是我爱着恋着往日的她,舍不得离开!
排行
详情
您当前的位置>首页 > 正文
你不得不学的es6
2017-09-26 10:08:19   来源:   评论:0 点击:

继承原生的构造函数,在原生函数的基础上,自定义自己的函数。

静态方法

ES6 支持 static 关键字,该关键字定义的方法,不会被实例继承,但可以被子类继承:

class A{
  static add(x, y){
    return x + y;
 }
}
A.add(1, 2);
var a = new A();
a.add()// error
class B extends A{}
B.add(2, 2)// 4 

Module

ES6 之前,JS 一直没有 modules 体系,解决外部包的问题通过 CommonJS 和 AMD 模块加载方案,一个用于服务器,一个用于浏览器。ES6 提出的 modules (import/export)方案完全可以取代 CommonJS 和 AMD 成为浏览器和服务器通用的模块解决方案。

关于模块,就只有两个命令,import 用于导入其他模块,export 用于输出模块。

// profile.js
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;

export {firstName, lastName, year};

// main.js
import {firstName, lastName, year} from './profile';
console.log(firstName, lastName) // Michael Jackson

import 加载的模块可以只加载用到的,但是必须使用同名的原则,可以用 as 来解决名字问题,同样,as 也可以解决 export 问题:

//main.js
import { lastName as surname } from './profile';
console.log(surname); // Jackson

//profile.js
export {firstName as name}

export 可以输出的内容很多,包括变量、函数、类,貌似都可以输出,还可以借助 export default 来加载默认输出。

//default.js
function add(a, b){
  return a + b;
}
export default add;
// 实际上
export {add as default};

// main.js
import add from './default'
//实际上 add 名字可以随便起
import {default as add} from './default'

模块加载的实质

这部分 ES6模块加载的实质 完全只能参考了,因为对模块加载用的不多,没有一点经验,但是看到作者提到了拷贝和引用,感觉逼格很高的样子。

ES6模块加载的机制,与CommonJS模块完全不同。CommonJS模块输出的是一个值的拷贝,而ES6模块输出的是值的引用。

比如一个 CommonJS 加载的例子:

// lib.js
var counter = 3;
function incCounter() {
  counter++;
}
module.exports = {
  counter: counter,
  incCounter: incCounter,
};

// main.js
var mod = require('./lib');

console.log(mod.counter);  // 3
mod.incCounter();
console.log(mod.counter); // 3

这个值会被 mod 缓存,而取不到原始的值。

ES6 中不一样,它只是生成一个引用,当真正需要的时候,才会到模块里去取值,

// lib.js
export let counter = 3;
export function incCounter() {
  counter++;
}

// main.js
import { counter, incCounter } from './lib';
console.log(counter); // 3
incCounter();
console.log(counter); // 4

循环加载

循环加载也比较有意思,经常能看到 node

相关热词搜索:

上一篇:如果要学习web前端开发,需要学习什么?
下一篇:分享一个目前可用的翻墙方法

收藏