JavaScript uses the "shared everything" method to load code, which is the most error-prone part of this language.
Web applications have become more complex, the use of JavaScript code has also begun to grow, and variable naming is enough to make people bald.
One of the goals of ECMAScript 6 is to solve the scope problem. In order to make JavaScript applications appear orderly, modules are introduced.
Default export and default import (Note: The default export can only be one time in a module)
//导出let a =10let c =20let d =30functionshow(){
console.log('1111111111111')}exportdefault{
a,
c,
show
}//导入import m1 from'./m1.js'//导入之后m1结果{
a:10,c:20,show:[Function: show]}
On-demand export and on-demand import
//1、声明赋值的时候直接进行一个导出----------------------//导出数据exportvar color ="red"exportlet name ="fanfusuzi"exportconst num =6//导出函数exportfunctiongetSum(num1,num2){
returm num1 + num2
}//接收import m1,{
color, name as name2, num, getSum }from'./m1.js'//as是将name重新命名为name2//这个函数将是模块私有的constgetCarouselImg=()=>{
returnrequest({
method:'get',
url:'/teaHouse/banner/selectList'})}//2、先进行一个声明赋值,然后进行一个导出------------functionmultiplay(num1,num2){
return num1 * num2
}export multiply
Import and execute module code directly
//m2for(let i =0; i <3; i++){
console.log(i)}import'./m2.js'