ES6介绍以及基本用法

1.模块化

  • 模块化是指解决一个复杂问题时,自顶向下逐层把系统划分秤 若干模块的过程。对于整个系统来说,模块是可组合、分解和更换的单元。
1.1 CommonJS:node.js中模块化的实现
  • CommonJS规定了模块的特性和各模块之间如何相互依赖
    • 每个模块内部,module变量代表当前模块。
    • module变量是一个对象,它的exports属性(即module.exports)是对外的接口
    • 加载某个模块,其实是加载该模块的module.exports属性。require()方法用于加载模块

2.ES6

  • ES6模块化规范是浏览器端与服务器端通用的模块化开发规范。
  • 它的出现极大的降低了前端开发者的模块化学习成本,开发者不需再额外学习AMD、CMD或者CommonJS等模块化规范。
  • ES6模块化规范中定义:
    • 每个js文件都是一个独立的模块
    • 导入其他模块成员使用import关键字
    • 向外共享模块成员使用export关键字
2.1 体验ES6模块化
  • node.js中默认仅支持CommonJS模块化规范,若想基于node.js体验与学习es6的模块化语法,可以按照如下两个步骤进行配置
    • 确保安装了v14.15.1或更高版本的node.js
    • 在package.json的根节点中添加"type":"module"节点
  • 在文件夹下执行npm init -y 命令进行初始化
  • 在 package.json文件中添加"type":“module”
    在这里插入图片描述

3.ES6基本语法

3.1默认导出与默认导入
  • 默认导出的语法:export default 默认导出的成员
  • 注意:每个模块中,只允许使用唯一的一次export default
    在这里插入图片描述
  • 默认导入的语法:import 接收名称 from ‘模块标识符’
  • 注意:默认导入时的接收名称可以任意名称,只要是合法的成员名称即可
    在这里插入图片描述
3.2 按需导出与按需导入
  • 按需导出的语法:export 按需导出的成员
    在这里插入图片描述
  • 按需导入的语法:import{s1} from ‘模块标识符’
    在这里插入图片描述
  • 注意事项
    • 每个模块中可以使用多次按需导出
    • 按需导入的成员名称必须和按需导出的名称保持一致
    • 按需导入时,可以使用as关键字进行重命名
    • 按需导入可以和默认导入一起使用
3.3 直接导入并执行模块中的代码
  • 只想单纯地执行某个模块中的代码,并不需要得到模块中向外共享的成员。此时,可以直接导入并执行模块代码。
    在这里插入图片描述
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值