前端開發之ES6模組化和node.js，2020.12.09

1、node到底是什麼？

Node是一個基於Chrome V8引擎的JavaScript執行環境；
是一個讓JavaScript執行在服務端的開發平臺，它讓JavaScript成為與PHP、Python、Perl、Ruby等服務端語言平起平坐的指令碼語言。

2、node 和 java/php區別？

與java區別
1、Node.js比Java更快：
1）、node.js開發快，執行的效率也算比較高，但是如果專案大了就容易亂，而且javascript不是靜態型別的語言，要到執行時才知道型別錯誤，所以寫的多了之後免不了會出現光知道有錯但是找不到哪兒錯的情況，所以測試就得寫的更好更詳細。
2）、java開發慢，但是如果專案大、複雜的話，用java就不容易亂，管理起來比node.js省心。
2、Node.js前後端都採用Javascript，代表未來發展的趨勢，而java則是現在的最流行的伺服器端程式語言。
3、Node.js和Java EE，一種是解釋語言，一種是編譯語言。
4、Java是一種程式語言，而NodeJS是用C、C++編寫的基於Chrome V8引擎的JavaScript執行環境。
5、Java嚴格來說是一種與瀏覽器無關的伺服器端語言，而Node JS可以在客戶端和伺服器端有效地使用。

---

與php區別
1、PHP是一種程式語言，Node.js是一個基於Chrome V8引擎的JavaScript執行環境；
2、Node.js遵循事件驅動的非阻塞I/O模型，PHP遵循一個阻塞模型； 3、PHP應用程式可以在任何伺服器上執行，Node不行。

3、es6模組化(摘抄自：簡書：es6中的模組化)

ES6的模組化分為匯出（export）與匯入（import）兩個模組。

3.1、export的用法：

在ES6中每一個模組即是一個檔案，在檔案中定義的變數，函式，物件在外部是無法獲取的
如果你希望外部可以讀取模組當中的內容，就必須使用export來對其進行暴露（輸出）。
	export let myName="張三";
然後可以建立一個index.js檔案，以import的形式將這個變數進行引入:
	import {myName} from "./test.js";
	console.log(myName);//張三

如果要輸出多個變數可以將這些變數包裝成物件進行模組化輸出：

let myName="張三";
let myAge=23;
let myfn=function(){
    return "我是"+myName+"！今年"+myAge+"歲了"
}
export {
    myName,
    myAge,
    myfn
}
/******************************接收的程式碼調整為**********************/
import {myfn,myAge,myName} from "./test.js";
console.log(myfn());//我是張三！今年23歲了
console.log(myAge);//23
console.log(myName);//張三

如果你不想暴露模組當中的變數名字，可以通過as來進行操作:

let myName="張三";
let myAge=23;
let myfn=function(){
    return "我是"+myName+"！今年"+myAge+"歲了"
}
export {
    myName as name,
    myAge as age,
    myfn as fn
}
/******************************接收的程式碼調整為**********************/
import {fn,age,name} from "./test.js";
console.log(fn());//我是張三！今年23歲了
console.log(age);//23
console.log(name);//張三

也可以直接匯入整個模組，將上面的接收程式碼修改為：

import * as info from "./test.js";//通過*來批量接收，as 來指定接收的名字
console.log(info.fn());//我是張三！今年23歲了
console.log(info.age);//23
console.log(info.name);//張三

3.2、預設匯出（default export）
一個模組只能有一個預設匯出，對於預設匯出，匯入的名稱可以和匯出的名稱不一致。

/******************************匯出**********************/
export default function(){
    return "預設匯出一個方法"
}
/******************************引入**********************/
import myFn from "./test.js";//注意這裡預設匯出不需要用{}。
console.log(myFn());//預設匯出一個方法

可以將所有需要匯出的變數放入一個物件中，然後通過default export進行匯出

/******************************匯出**********************/
export default {
    myFn(){
        return "預設匯出一個方法"
    },
    myName:"張三"
}
/******************************引入**********************/
import myObj from "./test.js";
console.log(myObj.myFn(),myObj.myName);//預設匯出一個方法 張三

同樣也支援混合匯出

/******************************匯出**********************/
export default function(){
    return "預設匯出一個方法"
}
export var myName="張三";
/******************************引入**********************/
import myFn,{myName} from "./test.js";
console.log(myFn(),myName);//預設匯出一個方法 張三

3.3、重新命名export和import

//如果匯入的多個檔案中，變數名字相同，即會產生命名衝突的問題
//為了解決該問題，ES6為提供了重新命名的方法，當你在匯入名稱時可以這樣做：
/******************************test1.js**********************/
export let myName="我來自test1.js";
/******************************test2.js**********************/
export let myName="我來自test2.js";
/******************************index.js**********************/
import {myName as name1} from "./test1.js";
import {myName as name2} from "./test2.js";
console.log(name1);//我來自test1.js
console.log(name2);//我來自test1.js