新手小白VUE整理(3) —— 前端模块化,Promise,axios

VUE 2.X

1.前端模块化

在ES6模块化规范诞生之前,JavaScript社区已经尝试并提出了AMD,CMD,CommonJS等模块化规范,
但是,这些由社区提出的模块化标准,还是存在一定的差异性和局限性,并不是浏览器与服务器通用的模块化
标准,例如:
AMD和CMD适用于浏览器端的JavaScript模块化
CommonJS适用于服务器端的JavaScript模块化
太多的模块化规范给开发者增加学习难度与开发的成本.因此,大一统的ES6模块化出现了

2.什么是ES6模块化规范?

ES6 模块化规范是浏览器端与服务器端通用的模块化开发规范。它的出现极大的降低了前端开发者的模块化学
习成本，开发者不需再额外学习 AMD、CMD 或 CommonJS 等模块化规范。
ES6模块化规范中定义:
每个JS文件都是一个独立的模块
导入其他模块成员使用import关键字
向外共享模块成员使用export关键字

3. 在 node.js 中体验 ES6 模块化

node.js 中默认仅支持 CommonJS 模块化规范，若想基于 node.js 体验与学习 ES6 的模块化语法，可以按照
如下两个步骤进行配置：
① 确保安装了 v14.15.1 或更高版本的 node.js
② 在 package.json 的根节点中添加 “type”: “module” 节点

4.默认导出基础语法

export default 默认导出的成员,示例:

let n1 = 10
let n2 = 20

function show(){}

export default {
  n1,n2,show
}

5.默认导入基本语法

import 接收名词 from ‘模块名’,示例:

import m1 from './1.默认导出.js'

console.log(m1)

6.ES6模块化注意事项

• 每个模块中,默认导出,只允许使用唯一的一次 export default,多次使用会报错
• 默认导入时,接收名词可以是任意名词,只要是合法名词就行,不能以数字开头

7.按需导出

export let s1 = 'aaa'
export let s2 = 'bbb'
export function say(){}

8.按需导入

import {s1,s2,say} from '模块标识符'

9.按需导出和按需导入注意事项

• 每个模块中可以使用多次按需导出
• 按需导入的成员名词必须和按需导出的名称保持一致
• 按需导入时,可以使用as关键字进行重命名
• 按需导入可以合默认导入一起使用

10.Promise

1)Promise的基本介绍

• Promise是一个构造函数
  我们可以创建Promise的实例,const p = new Promise()
  new 出来的Promise实例对象,代表一个异步操作
• Promise.prototype上包含一个.then()方法
  每一次new Promise()构造函数得到的实例对象都可以通过原型链的方式
  访问到.then()方法,例如p.then()
• .then()方