ES6特性-Module初了解-上
2017-12-19 00:00
501 查看
1.概述
ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系
和commonJS相比,commonJS是运行时才能确定依赖关系
2.严格模式use strict
ES6模块自动采用严格模式
3.export命令
export命令用于定义对外暴露的接口
4.import命令
import是静态执行,所以import语法内不能使用表达式(运行时才能得到结果)
5.模块的整体加载
6.export default命令
本质上,
ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系
和commonJS相比,commonJS是运行时才能确定依赖关系
2.严格模式use strict
ES6模块自动采用严格模式
3.export命令
export命令用于定义对外暴露的接口
//xx.js var name = "bill"; var age = 12; //或者定义时关键字前加export,如 export var m =1,使用as 可以重命名,import的时候也要使用重命名后的名字 export {name as oldName, age} //export输出的接口对应的值是动态绑定关系,即通过该接口可以取到模块内部实时的的值,commonJS模块输出的是值的缓存
4.import命令
//可以使用as重命名导入的变量,路径可以是相对路径或绝对路径,也可以是模块名,但必须通过配置文件告诉js引擎模块的位置 import {name as newName, age} from './xx.js'
import是静态执行,所以import语法内不能使用表达式(运行时才能得到结果)
5.模块的整体加载
//整体模块加载在obj对象上,可以通过.语法引用里面export的函数和变量,但是不能在这里额外为obj定义额外的方法和属性 //这会导致无法静态分析 import * as obj from './xx.js'
6.export default命令
//使用export default命令可以指定模块的默认输出,但是一个模块只能有一个默认输出,这时可以不用花括号 //xx.js export default function(){ console.log("233"); } //xx.js var a = 2; export default a; //导入时语法 import aName from './xx.js' //可改名,但要用花括号 import {default as bName} from './xx.js'
本质上,
export default就是输出一个叫做
default的变量或方法或对象,然后系统允许你为它取任意名字。
//module.js function add(x, y){ return x+y; } //等同于export default add export {add as default} //example.js //等同于 import foo from 'module' import {default as foo} from 'module' //同时导入其他的变量的语法 import aiasName, {name , age ,foo} from './xx.js'
相关文章推荐
- ES6特性-Module初了解-下
- 【前端知识点】30分钟了解ES6最新核心特性
- ES6--Class、Module及常用特性
- ES6新特性中的Module
- ES6新特性之模块Module用法详解
- ES6--Class、Module及常用特性
- webpack里CommonJS的require与ES6 的module.exports加载模块有何不同
- 了解注解及java提供的几个基本注解(JDK1.5的新特性)
- 10个最佳ES6特性
- ES6新特性:Function函数扩展, 扩展到看不懂
- Java9都快发布了,Java8的十大新特性你了解多少呢?
- 前端工程师不得不知道的ES6新特性(四)
- 前端工程师不得不知道的ES6新特性(二)
- ES6 函数的几个特性
- 【微信小程序+ES6新特性应用】使用解构数组优化变量格式
- require.js深入了解 require.js特性介绍
- ES6新特性
- 使用Visual Studio 2017 C++17模块(module)特性
- JavaScript ES6的新特性使用新方法定义Class
- iOS 11 将于9月19日正式发布,一文带你了解它的那些特性