node.js

一、瀏覽器

1、瀏覽器的組成

人機交互部分 - UI
網絡請求部分 - socket
JavaScript引擎部分 - 解析執行js
渲染引擎部分 - 渲染 HTML、CSS等
數據存儲部分 - cookie、HTML5中的本地存儲LocalStorage、SessionStorage

2、主流渲染引擎

1、介紹

渲染引擎，又叫排版引擎 或 瀏覽器內核

2、主流的渲染引擎

Chrome瀏覽器：Blink引擎(Webkit的一個分支)
Safari瀏覽器：Webkit引擎windows版本2008年3月18推出正式版，但蘋果已于2012年7月25停止開發Windows版的Safari
FireFox瀏覽器：Gecko引擎
Opera瀏覽器：Blink引擎(早期使用Presto引擎)
Internet Explorer瀏覽器：Trident引擎
Microsoft Edge瀏覽器：EdgeHTML引擎(Trident的一個分支)

3、工作原理

解析HTML構建DOM樹(Document Object Model，文檔對象模型)，DOM是W3C組織推薦的處理可擴展置標語言的標準編程接口

構建渲染樹并不等同于DOM樹，因為像head標簽 或 display:none 這樣的元素就沒有必要放到渲染樹中，但是它們在DOM樹中。

對渲染樹進行布局，定位坐標和大小、確定是否換行、確定position、overflow、z-index等等，這個過程叫"layout" 或"reflow"

繪制渲染樹，調用操作系統底層的API進行繪圖操作

二、web開發的本質

1、三點

請求，客戶端發起請求
發出，服務器處理請求
相應，服務器將處理結果發送給客戶端

三、node.js介紹

1、node.js是什么？

node.js是一個開發平臺，就像java開發平臺、.Net開發平臺、PHP開發平臺、Apple開發平臺一樣。

何為開發平臺？有對應的編程語言、有語言運行時、有能實現特定功能的API（SDK：Software Development Kit）

該平臺使用的編程語言是 JavaScript 語言

node.js 平臺基于 Chrome V8 JavaScript 引擎構造

基于 node.js 可以開發控制臺程序(命令行程序、CLI程序)、桌面應用程序(GUI)(借助 node-webkit、electron等框架實現)、Web應用程序(網站)

PHP 開發技術棧：LAMP - Linux Apache Mysql PHP

node.js 全棧開發技術棧：MEAN - MongoDB Express Angular Node.js

2、特點

事件驅動(當事件被觸發時，執行傳遞過去的回調函數)
非阻塞 I/O 模型(當執行 I/O 操作時，不會阻塞線程)
單線程
擁有世界最大的開源庫生態系統 - npm

3、網站

node.js官網

node.js中文網

node.js中文社區

4、下載

當前版本

歷史版本

注：通過nvm(liunx、mac)或nvm-windows管理一臺計算機上多個版本的 node.js

四、編寫程序

1、REPL介紹

1、全稱

Read-Eval-Print-Loop（交互式解釋器）

R(讀取)：讀取用戶輸入，解析輸入了JavaScript 數據結構并存儲在內存中
E(執行)：執行輸入的數據結構
P(打印)：輸出結果
L(循環)：循環操作以上步驟直到用戶兩次按下ctrl-C按鈕退出

2、編寫程序

控制臺

在REPL中編寫程序(類似于瀏覽器開發人員工具中的控制臺功能)，直接在控制臺輸入node命令進入REPL環境

按兩次Control + C 退出REPL界面 或者 輸入 .exit退出REPL界面

JavaScript

分全局模塊 和 部分模塊。可從文檔Globe查看全局模塊

官方文檔中：Stability 。0：過時，1：正在開發測試，2：穩定。

五、第一個程序

// hello-world-01.js
var m = 100;
var n = 100;

function add(x,y){
	return x + y;
}

var result = add(m,n);

console.log('返回的結果是：'+result);

# 執行hello-world-01.js
node hello-world-01.js

六、fs模塊(文件操作)

1、讀取操作

var fs = require('fs');

fs.readFile(
  './hello.txt',
  function(err,data){
    if(err){
	  throw err;
	}
	// 把Buffer轉String，調用toString。toString()參數默認 utf8
	console.log(data);
	console.log(data.toString('utf8'));
  }
);

// 文件路徑
// __dirname:當前執行的js文件的完整目錄路徑
// __filename:當前執行的js文件的完整文件路徑
// __ 是兩個下劃線

2、讀取操作

// 執行文件操作

// ---  實現文件寫入操作  ---
// 1、加載文件操作模塊 fs模塊
var fs = require('fs');

// 2、實現文件寫入操作
var msg = 'Hello World，你好世界！';

// 調用fs.writhFile() 進行文件寫入
// 異步執行
fs.writeFile(
  './hello.txt',
  msg,
  'utf8',
  function(err){
	  if(err === null){
		  console.log('文件寫入成功！');
	  }else {
		  console.log('文件寫入失敗！具體錯誤：' + err);
	  }
  }
);

七、HTTP模塊

1、http服務簡單搭建

// 創建一個簡單的http服務器程序

// 1、加載http模塊
var http = require('http');

// 2、創建一個http服務對象
var server = http.createServer();

// 3、監聽用戶的請求事件(request事件)
// request對象包含用戶請求報文中的所有內容，通過request對象可以獲取所有用戶提交過來的數據
// response對象用來向用戶響應一些數據，當服務器要向客戶端響應數據時，必須使用reponse對象
// 有了request對象和reponse對象，就既可以獲取用戶提交的數據，也可以向用戶響應數據了
server.on('request',function(req,res){
    // 亂碼解決思路：
    // 在res.write('中文')時，響應在客戶端的內容如果編碼不一致，會導致亂碼
    // 服務器通過設置http響應報文頭，指定客戶端采用響應編碼解析網頁

    /** 響應報文頭還可設置其他信息。參考地址：開源中國 -- 在線工具 -- HTTP Mime-type **/
    /** 第三方模塊：mime，來判斷不同類型 **/

    res.setHeader('Content-Type','text/plain;charset=utf-8');
    res.write('Hello World');
    // 對于每一個請求，服務器必須結束響應，否則客戶端(瀏覽器)會一直等待服務器的響應
    res.end();
})

// 4、啟動服務 -- 命令  node hello.js
server.listen(3000,function(){
   console.log('服務已啟動，，，'); 
});

2、不同請求，不同響應內容

// 根據用戶不同請求，服務器做出不同響應
// 響應內容為文本

var http = require('http');

http.createServer(function(req,res){
    // 獲取用戶請求路徑 req.url
    if(req.url === '/' || req.url === '/index'){
        res.end('index');
    }else if(req.url === '/a'){
        res.end('a'); 
    }else{
        res.end('404 Not Found');
    }
}).listen(3000,function(){
   console.log('服務已啟動，，，'); 
});

// 根據用戶不同請求，服務器做出不同響應
// 響應內容為頁面

var http = require('http');
var fs = require('fs');	// 文件
var path = require('path');	// 拼接路徑

http.createServer(function(req,res){
    // 獲取用戶請求路徑 req.url
    if(req.url === '/' || req.url === '/index'){
        // path.join()：拼接路徑
        // __dirname:當前執行的js文件的完整目錄路徑
        fs.readFile(path.join(__dirname,'htmls','index.html'),function(err,data){
           if(err){
               throw err;
           }
           // 把讀取到的頁面中的內容直接發送給服務器
           res.end(data);
        });
    }else if(req.url === '/a'){
        fs.readFile(path.join(__dirname,'htmls','a.html'),function(err,data){
           if(err){
               throw err;
           }
           res.end(data);
        }); 
    }else{
        fs.readFile(path.join(__dirname,'htmls','notFound.html'),function(err,data){
           if(err){
               throw err;
           }
           res.end(data);
        });
    }
}).listen(3000,function(){
   console.log('服務已啟動，，，'); 
});

3、request

http.IncomingMessage

服務器解析用戶提交的http請求報文，將結果解析到request對象中。

凡是要獲取和用戶請求相關的數據都可以通過request對象獲取。

4、reponse

http.ServerResponse

在服務器端用來向用戶做出響應的對象。

凡是需要向用戶(客戶端)響應的操作，都需要通過response對象進行

八、try-catch

同步操作異常

可以捕獲

異步操作異常

無法捕獲
只能通過判斷錯誤號(err.code)操作

總結

以上是生活随笔為你收集整理的nodejs基础(1)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。