学习目标:
1.在node.js 中体验es6的模块化语法
- 检查node.js的版本 要求至少14.1以上
- 在package.json 中添加 type:module
导出语法
let n1=1;
let n2=2;
function show(){
console.log(123);
}
export default{
n1,
n2,
show
}
导入语法:
import m1 from './'
注意事项 只能导出一次 命名合法
按需导出
export let m1=1
export let m2=2
export function show(){
console.log('123');
}
按需导入
import {m1,m2 as n1,show} from './index.js'
console.log(m1);
console.log(n1);
console.log(show());
注意事项 按需导入和默认导入可以配合使用 可以使用as对导入成员进行命名
2.Promise
npm install then-fs
2.1then-fs的使用方法
import thenfs from 'then-fs'
thenfs.readFile('./text1','utf8').then((r1)=>{console.log(r1);})
thenfs.readFile('./text2','utf8').then((r1)=>{console.log(r1);})
此方法不能保证文件读取顺序,需要进行改进
promise 支持链式调用,来解决回调地狱问题
import thenfs from 'then-fs'
// thenfs.readFile('./text1','utf8').then((r1)=>{console.log(r1);})
// thenfs.readFile('./text2','utf8').then((r1)=>{console.log(r1);})
thenfs.readFile('./text1', 'utf8').then((r1) => {
console.log(r1);
return thenfs.readFile('./text2', 'utf8')
}).then((r2) => {
console.log(r2);
return thenfs.readFile('./text3', 'utf8')
}).then((r3)=>{
console.log(r3);
})
使用catch
可以捕获后面的错误
如果不希望chtch错误影响整个代码,我们可以把catch往前提
thenfs.readFile('./text13', 'utf8').catch((err) => {
// 返回错误信息
console.log(err);
}).then((r1) => {
console.log(r1);
return thenfs.readFile('./text2', 'utf8')
}).then((r2) => {
console.log(r2);
return thenfs.readFile('./text3', 'utf8')
}).then((r3) => {
console.log(r3);
})
2.2.promise中all()方法
promise中all()方法会发起并行的Promise异步操作,等所有的异步操作全部结束后才会执行下一步 .then操作(等待机制)
const PromiseisArr=[
thenfs.readFile('./text1','utf8'),
thenfs.readFile('./text2','utf8'),
thenfs.readFile('./text3','utf8'),
]
Promise.all(PromiseisArr).then((r1)=>{
r1.forEach((item)=>{
console.log(item);
})
}).catch(err=>{console.log(err);})
等数组中的操作全部执行完后,才会执行下一步操作
2.3Promise中race()方法
Promise中race()方法 , 只要以一个异步操作完成,就会立即执行下一个异步操作
const PromiseisArr=[
thenfs.readFile('./text1','utf8'),
thenfs.readFile('./text2','utf8'),
thenfs.readFile('./text3','utf8'),
]
Promise.race(PromiseisArr).then((r1)=>{
console.log(r1);
}).catch(err=>{console.log(err);})
2.4基于Promise创建一个异步操作
import fs from 'fs'
function getFile(fpath){
return new Promise(function(){
fs.readFile(fpath,'utf8',(err,data)=>{
console.log(data);
})
})
}
getFile('./text3')
基于Promise异步读取文件方法
// 基于Promise创建一个异步操作
import fs from 'fs'
function getFile(fpath){
return new Promise(function(resolve,reject){
fs.readFile(fpath,'utf8',(err,data)=>{
if(err){
reject(err)
}else{
resolve(data)
}
})
})
}
getFile('./text3').then((res)=>{
console.log(res);
},(reson)=>{
console.log(reson);
})
// 基于Promise创建一个异步操作
import fs from 'fs'
function getFile(fpath){
return new Promise(function(resolve,reject){
fs.readFile(fpath,'utf8',(err,data)=>{
if(err){
reject(err)
}else{
resolve(data)
}
})
})
}
getFile('./text3').then((res)=>{
console.log(res);
}).catch(err=>{
console.log(err);
})
3.什么是async和await
用来简化Promise代码
1.1async和await的基本使用
import thenfs from 'then-fs'
async function getdata () {
let f1 =await thenfs.readFile('./text1', 'utf8')
console.log(f1);
let f2 =await thenfs.readFile('./text2','utf8')
console.log(f2);
}
getdata()
注意事项:
在function中使用async,function里面必须有await修饰
在async方法中,第一个await之前的代码会同步执行,await之后的代码会异步执行
4.Eventloop同步任务和异步任务
1.JavaScript是一个单线程任务,一次只能执行一个任务 前一个任务执行完才能执行后一个任务
JavaScript把执行的任务分为同步任务和异步任务
同步任务与异步任务执行过程
- 同步任务由JavaScript主线程执行
- 异步任务委托给宿主环境执行
- 已完成的异步任务对应回调函数,会被加入到任务队列中
- JavaScript主线程执行栈清空后,会读取任务队列中的回调函数,依序执行
- JavaScript主线程不断重复上面第四步
eventloop执行过程概念
eventloop经典面试题
AD属于同步任务 按照次序执行
BC属于异步任务,被委托到宿主环境中 因为C只需要0 所以C先执行
5.宏任务与微任务
1.什么是宏任务,微任务
JavaScript把异步任务分为宏任务与微任务
2.宏任务和微任务执行顺序
先执行宏任务,执行完成后检查是否有微任务,如果有则执行所有微任务,如果没有继续执行宏任务 重复上述步骤
注:Promise本身是同步任务 里面的then()和catch ()是微任务
试题1,2
2431
script本身属于宏任务。所以执行完script脚本,会清空这一次添加的微任务。
后面就是 宏-微-宏-微 了。
试题3
6.API接口案例
1.搭建项目的基本结构
1.链接数据库
import mysql from 'mysql'
const pool=mysql.createPool({
host:'127.0.0.1',
port:3306,
database:'root',
password:'123456'
})
export default pool.promise()
2.创建express服务器
//1.导入express
import express from 'express'
//2.创建web服务器
const app = express()
//3.启动web服务器
app.listen(80, () => {
console.log('express server running at http://127.0.0.1')
})
3.查询mysql数据
import db from '../db/mysql'
function getAlluser(req,res){
const [rows] = db.query('select id from ev_users')
console.log(rows);
}
getAlluser()
目录: