Node.js 路由，前端異步流程工具

時間 2019-11-16

標籤 node.js node 路由前端異步流程工具欄目 Node.js 简体版

原文原文鏈接

自定義包上傳npm.js

注意：記住要發送郵箱激活注意：切換你的npm源 nrm 注意：你的包的名稱不要和別人的重複步驟： 1.登陸npm帳號 npm adduserjavascript

上傳html
```
npm publish
```

node後端路由基本原理

經過htpp模塊來作。其實後端路由就是web服務器前端

路由的產生：java

*在以前，是多頁面的，點一個連接開一個新網頁。node

*如今流行的是單頁面，只有一個index，使用模板替換裏面的內容。git

const http = require('http')

const host = 'localhost'

const fs = require('fs')

const port = 6868;

http.createServer((req, res) => {
        res.writeHead(200, {
            'Content-type': 'text/html;charset=utf8'
        })
        switch (req.url) {
            case '/home':
                res.write('home')
                res.end()

                break;
            case '/shopcar':
                fs.readFile('./static/shopcar.html', 'utf8', (error, docs) => {
                    res.write(docs)
                    res.end()
                })
                break;
            case '/1.jpg':
                fs.readFile('./static/1.jpg', (error, docs) => {

                    res.writeHead(200, { 'Content-Type': 'image/jpeg' }); //輸出類型
                    // 圖片是以二進制傳輸的

                    res.write(docs, 'binary')
                    res.end()
                })
                break;
            case '/index.js':
                fs.readFile('./static/js/index.js', (error, docs) => {
                    // 圖片是以二進制傳輸的
                    res.write(docs)
                    res.end()
                })
                break;
            default:
                break;
        }

    })
    .listen(port, host, () => {
        console.log(`服務器運行在：http://${ host }:${ port }`)
    })

npm腳本

概念： npm腳本指的是package.json中的scripts字段es6

認識package.jsongithub

package.json 是記錄項目依賴包信息和npm腳本命令的一個配置文件web

項目依賴包信息： npm

*dependencies 生產環境的依賴包

*devDependencies 開發環境使用的依賴包
腳本命令：

*npm init -y 初始化

*npm run dev & npm run app 所有執行完命令，最後輸出結果

*npm run dev && npm run app 依次執行

 1 //分別建立case.js與case2.兩個文件
 2 
 3 {
 4     "name": "3-jiaoben",
 5     "version": "1.0.0",
 6     "description": "",
 7     "main": "case.js",
 8     "scripts": {
 9         "test": "echo \"Error: no test specified\" && exit 1",
10         "dev": "node case.js",
11         "app": "node case2.js"
12 
13     },
14     "keywords": [],
15     "author": "",
16     "license": "ISC"
17 }

前端異步流程工具

javascript是單線程，依次執行一個任務，想要讓任務可以順利執行，就須要使用異步。將任務放入異步隊列中，在主線程執行結束以後再去執行隊列的任務

前端異步的操做方式

1:傳統方式：回調函數，事件

2:前端異步流程工具（封裝出來的函數，庫）：

es6 Promise

es6 Generator

es6-es8 async 函數

Node中的異步處理工具--> nextTi , steImmediate

第三方類庫-->async.js

Pormise

 1 const pse1 = new Promise((resolve, reject) => { //resolve 將未完成變爲成功,reject將未完成變爲失敗
 2         resolve('任務一')
 3     }).then(data => {
 4         console.log(data);
 5 
 6     })
 7     .catch(error => {
 8         if (error) throw error; //拋出一個錯誤，這個時候進程會被中斷
 9     })
10 
11 
12 const pse2 = new Promise((resolve, reject) => {
13         setTimeout(() => {
14             resolve('任務二')
15         }, 2000)
16     }).then(data => {
17         console.log(data);
18 
19     })
20     .catch(error => {
21         if (error) throw error;
22     })
23 
24 //promise 提供的兩個核心方法
25 //Promise.all([promise實例1, promise實例2])
26 //Promise.race([promise實例1, promise實例2])
27 
28 
29 // Promise
30 //     .all([pse1, pse2]) //執行全部任務
31 //     .then(() => { //(data)=>{}  沒有值能夠不給
32 //         console.log('任務三');
33 //     })
34 //console.log('主線程');
35 //此時輸出：主線程，任務一，任務二，任務三
36 
37 Promise
38     .race([pse1, pse2])
39     .then(() => {
40         console.log('任務三');
41 
42     })
43 console.log('主線程');
44 //此時輸出：主線程，任務一，任務三，任務二
45 
46 //all 依次執行任務，即便有延時任務，也必須等延時任務介紹才能執行後續任務
47 //race 誰快誰先執行![1563348372761](C:\Users\Administrator\AppData\Roaming\Typora\typora-user-images\1563348372761.png)