為什么Nodejs成為后端開發者的新寵？
1. 認識 nodejs
nodejs 是基于 Chrome V8 引擎構建的一個開源、跨平臺的 JS 運行時環境，它允許開發者在服務器端運行 JS 代碼。
眾所周知，Chrome 瀏覽器是谷歌公司開發的一個超級好用的瀏覽器，而 V8 引擎是谷歌公司開源的一種技術，它在 Chrome 瀏覽器中主要用來提高編譯 JS 的執行速度。
nodejs 也用到了 Chrome 的 V8 引擎，也能編譯執行 JS 代碼。
那 nodejs 可以在服務器端運行 JS 代碼什么意思呢？
我們可以基于 Node 環境開發后臺項目，處理用戶在瀏覽器發起的各種請求。
圖片
2. 安裝配置 nodejs
2.1 下載安裝
https://nodejs.cn/download/
圖片
直接下一步下一步安裝即可，建議安裝在 C 盤之外的其他盤符
安裝完成之后，Win+r 輸入 cmd，然后輸入 node -v 和 npm -v 驗證安裝結果
圖片
2.2 配置
1)配置環境變量
windows系統：
系統環境變量 -> 新建：NODE_HOME，值為 node.js 的安裝目錄。path 變量新增 %NODE_HOME%
2)配置 npm 依賴位置
在 nodejs 安裝目錄下，創建 node_global 和 node_cache 兩個文件夾
圖片
設置 npm 依賴下載位置
npm config set cache "D:\Software\Node\npm_cache"
npm config set prefix "D:\Software\Node\npm_global"3)配置淘寶鏡像
npm config set registry https://registry.npmmirror.com4)驗證
npm config get registry
圖片
3. nodejs 和 npm 的關系
npm 全稱 Node Package Manager，npm 是隨著 nodejs 一起安裝的一個包管理工具，nodejs 內含 npm。
我們在開發 nodejs 應用的時候，可能需要用到很多不同的功能模塊，這些模塊由其他開發者開發并共放在一個倉庫里面。
如果我們想要使用某個第三方模塊，例如 axios ，只需要使用 npm install xxx 安裝即可，非常的方便。
圖片
npm 倉庫地址：
https://www.npmjs.com/
圖片
4. 內置模塊
學習 nodejs 主要就是學習它的一些內置 API 和一些常用的第三方 API。
接下來我們先看一些常用的內置模塊。
4.1 文件操作：fs
fs 模塊是 nodejs 官方提供的、用來操作文件的模塊。
在 nodejs 中，如果需要使用內部的模塊，我們需要通過 require 加載模塊。
4.1.1 讀文件
圖片
// 1. 加載 fs 模塊，
const fs = require('fs')
// 參數1：讀取文件的存放路徑
// 參數2：編碼格式，默認 utf8
// 參數3：回調函數
fs.readFile('./zhifou.txt', 'utf8', function (err, data) {
if (err) {
return console.log('讀取失敗！' + err.message)
}
console.log(data)
})
圖片
4.1.2 寫文件
// 1. 加載 fs 模塊，
const fs = require('fs')
// 參數1：文件路徑
// 參數2：寫入的內容
// 參數3：回調函數
fs.writeFile('./hello.txt', '鋤禾日當午，汗滴禾下土', function (err) {
if (err) {
return console.log('寫入失敗！' + err.message)
}
console.log('寫入成功！')
})
圖片
__dirname 表示當前文件所處的目錄，可以用來解決路徑動拼接的問題
// 1. 加載 fs 模塊，
const fs = require('fs')
// 參數1：文件路徑
// 參數2：寫入的內容
// 參數3：回調函數
console.log(__dirname)
fs.writeFile(__dirname + '/hello.txt', '鋤禾日當午，汗滴禾下土', function (err) {
if (err) {
return console.log('寫入失敗！' + err.message)
}
console.log('寫入成功！')
})
圖片
如果寫入同一個文件，新寫入的內容會覆蓋之前的舊內容
4.2 路徑操作:path
path 模塊是 nodejs 官方提供的、用來處理路徑的模塊。
4.2.1 join
const path = require('path');
let pathA = "/a";
let pathB = "/b";
let pathC = "/c";
let finalPath = path.join(pathA, pathB, pathC);
console.log(finalPath);
圖片
4.2.2 basename
path.basename(path,ext) 可以獲取路徑中的最后一部分，經常通過這個方法獲取路徑中的文件名
- path 必選參數，表示一個路徑的字符串
- ext 可選參數，表示文件擴展名
const path = require('path');
const fpath = '/a/b/zhifou.js'
const fullName = path.basename(fpath)
console.log("name1:", fullName)
const fileName = path.basename(fpath, '.js')
console.log("namew:", fileName)
圖片
4.2.3 extname
path.extname(path) 可以獲取路徑中的擴展名
const path = require('path');
const filePath = '/a/b/zhifou.js'
const name = path.extname(filePath)
console.log("name:", name)
4.3 http
http 模塊是 Node.js 官方提供的用來創建 web 服務器的模塊
通過 http 模塊提供的 http.createServer() 方法，就能方便的把一臺普通的電腦，變成一臺 Web 服務器，從而對外提供 Web 資源服務。
// 1. 導入 http 模塊
const http = require('http')
// 2. 創建 web 服務實例
const server = http.createServer()
// 3. 為服務器實例綁定 request 事件，監聽客戶端的請求
server.on('request', (req, res) => {
// req.url 是客戶端請求的 URL 地址
const url = req.url
// 調用 res.setHeader() 方法，設置 Content-Type 響應頭，解決中文亂碼的問題
res.setHeader('Content-Type', 'text/html; charset=utf-8')
// req.method 是客戶端請求的 method 類型
const method = req.method
const str = `請求的的 url 是 ${url}, 請求的方法類型是 ${method}`
console.log(str)
// 響應數據
res.end(str)
})
// 4. 啟動服務器
server.listen(8081, function () {
console.log('server running at http://127.0.0.1:8081')
})
圖片
5. 模塊化
5.1 nodejs 模塊化
我們說的前端模塊化，其實就是 JS 模塊化。模塊化是前端指定的一種開發規范。
在實際項目開發中，我們將常用的一些變量或者方法放到一個 js 文件中，然后暴露出來，一個 js 文件可以看做一個功能模塊。如果想要使用該模塊，只需要導入即可。
剛開始 JS 沒有模塊系統、標準庫較少、缺乏包管理工具。后來 CommonJS 橫空出世。
CommonJS 的模塊規范：
一個文件就是一個模塊，擁有單獨的作用域。普通方式定義的變量、函數、對象都屬于該模塊內。
- 通過 require 來加載模塊。
- 通過 exports 和 module.exports 來暴露模塊中的內容
nodejs 遵循了 CommonJS 模塊化規范。
nodejs 模塊化案例：
導出：
module.exports
圖片
exports:
圖片
導入：
const math = require('./math');
const testPrint = require('./print');
console.log(math.add(100, 200));
console.log(testPrint.print('知否技術'));
圖片
5.2 ES6 模塊化
目前大家最常用的就是 ES6 的模塊化，因為 ES6 模塊化將更好地與其他前端技術棧(如React、Vue等)進行整合。
ES6 模塊化語法：
- 使用 import 關鍵字導入其他 js 文件
- 使用 export 關鍵字向外共享 js 文件
5.2.1 搭建 node 環境
我們在 node 環境下體驗 ES6 模塊化。
首先在項目終端輸入以下命令初始化項目：
npm init -y這時會立即生成 package.json 文件，然后配置 "type":"module" ，這樣我們就可以在 node 環境下體驗 ES6 模塊化了。
圖片
5.2.2 導出方式
1)默認導出：export default
let name = "知否君";
let age = 23;
function desc() {
console.log("公眾號：知否技術");
}
export default {
name, age, desc
}export default {
name: "知否君",
age: 23,
desc: function () {
console.log("公眾號：知否技術");
}
}2)統一導出：export
let name = "知否君";
let age = 23;
function desc() {
console.log("公眾號：知否技術");
}
export {
name, age, desc
}3)分別導出
export let name = "知否君";
export let age = 23;
export function desc() {
console.log("公眾號：知否技術");
}5.2.3 導入方式
1)默認導入
import common from './common.js'
console.log(common);2)解構賦值導入
注意：解構賦值導入其實就是分別導入，只適用于統一導出和分別導出。
import { name, age } from './common.js'
console.log(name);
console.log(age);6. 第三方 API
第三方 API 太多了，例如 axios、pinia、vuex、myqsql、express 等，這里不再詳細介紹。
大家根據學習和工作需要，去 npm 倉庫或者網上單獨查找學習即可。
圖片
7.node 常見問題
1)npm 是什么？
npm 就好比是一個前端的插件商店，里面有各種開發者寫的包，你需要的時候就從命令行安裝就可以了。2)node 和 vue 有什么聯系
vue 的開發本身是不依賴 node 的，不過 vue 的腳手架 vue-cli 里面集成的 webpack 是基于 node 開發出來的，因此只能說 webpack 是依賴 node 的。3)vite 和 node 什么關系
Vite 是一個前端構建工具，它需要 nodejs 環境來運行，因為它的命令行工具和構建腳本都是基于 nodejs 的。4)node 和 npm 什么關系
npm 是 nodejs 的包管理器（package manager）。我們在 nodejs 上開發時，會用到很多別人已經寫好的 JS 代碼，
如果每當我們需要別人的代碼時，都根據名字搜索一下，下載源碼，解壓，再使用，會非常麻煩。于是就出現了包管理器 npm 。
大家把自己寫好的源碼上傳到 npm 官網上，如果要用某個插件，直接通過 npm 安裝就可以了，不用管那個源碼在哪里。
并且如果我們要使用模塊 A ，而模塊 A 又依賴模塊 B ，模塊 B 又依賴模塊 C 和 D，此時 npm 會根據依賴關系，把所有依賴的包都下載下來并且管理起來。5)npm run dev 的本質
通常，當你在項目中執行 “npm run dev” 時，它會啟動一個開發服務器。這個服務器的主要目的是在開發過程中為你的前端應用提供服務。
例如，在一個 Vue 項目中，這個開發服務器可能是由 vite 提供的。它會監聽項目中的文件變化，當你修改了代碼后，服務器會自動重新加載頁面，讓你能夠立即看到修改后的效果，而無需手動刷新頁面。這樣可以大大提高開發效率，讓你能夠快速迭代和調試代碼。- 依賴管理
在執行 “npm run dev” 之前，你的項目通常會有一個 “package.json” 文件，其中列出了項目所需的各種依賴包。當你運行這個命令時，npm 會首先檢查這些依賴包是否已經安裝。如果沒有安裝，它會自動從 npm 倉庫中下載并安裝這些依賴包。
這些依賴包可能包括前端框架本身（如 Vue 或 React）、各種插件、庫以及開發工具等。
- 構建過程
對于一些復雜的項目，“npm run dev” 可能還會執行一系列的構建任務。例如，在 Vue 項目中，它可能會使用 Webpack 或 Vite 等構建工具對項目進行打包和優化。
這個構建過程可能包括將 ES6+ 的代碼轉換為瀏覽器可以理解的 ES5 代碼、合并多個 CSS 文件和 JavaScript 文件、對圖片和字體等資源進行優化處理等。
