Javascript模块化编程

1.简介：

     Javascript模块化编程，只需实现核心业务逻辑，其余都加载已写好模块

2.模块化规范：

  （1）CommonJS模块化规范（基于ES6语法之前）

  （2）ES6模块化规范（使用ES6语法）

3.ES6模块化规范：

  （1）导出模块：创建js文件

   export default{
      list(){
        console.log("list()...")
      },
      save(){ 
        console.log("save()...")
      }
   }

  （2）导入模块：

   import user from './01.js' //引入
   //调用
   user.list()
   user.save()

  （3）运行程序：

           打开cmd窗口：node 文件名.js

           注意：因ES6（模块化）无法在Node.js中执行，需用（Babel）编辑成ES5后再执行

           如图：运行错误

 

4.Babel转码：

    将ES6代码转为ES5代码

  （1）安装：npm install -g babel-cli

            babel --version //查看是否安装成功

  （2）初始化项目：npm init -y

  （3）配置.babelrc文件：无后缀

  {
    "presets": ["es2015"],  //设定转码规则
    "plugins": []
  }

  （4）安装转码器：npm install -D babel-preset-es2015

  （5）转码：babel src -d dist（dist指定输出目录）

  （6）运行程序：node dist/文件名.js

  （7）其它方式：常见写法

  export function list() {
     console.log('list()...')
  }
  export function save() {
     console.log('save()...')
  }

  import {getList, save} from"./文件名.js"
  getList()
  save()