compress.js的簡單介紹

本文目錄一覽：

• 1、壓縮的JS文件怎麼修改呢
• 2、輕鬆壓縮JS文件
• 3、node.js 基礎操作
• 4、如何壓縮js

壓縮的JS文件怎麼修改呢

1.

一般js壓縮的，都有未壓縮的文件，直接可以改未壓縮的文件，到時引入的時候，也改成那個未壓縮的js文件

2.

如果找不到未壓縮的js文件，那就只能想辦法把js壓縮的文件格式化，改起來才方便，畢竟壓縮過的就幾行代碼，不格式話下，估計都找不對位置

輕鬆壓縮JS文件

在任意文件夾下按住shift按鍵的同時，點擊滑鼠右鍵

打開powershell命令窗口

執行命令： npm install uglify-js -g

首先，打開cmd

其次，查找要壓縮的js文件，查找方法如下：

1、輸入文件所在位置

例如，我需要壓縮的文件在E盤中，就輸入  e:

2、輸入：cd + js文件所在位置

例如，我需要壓縮的js文件在：E:\electron-vue\topology\static\new_node_modules\topology-vue

就執行：cd electron-vue\topology\static\new_node_modules\topology-vue

3、輸入：uglifyjs + 要壓縮的js文件名稱 +  -o +  壓縮後js文件名稱

例如，我要將topology-vue.umd.js文件壓縮成topology-vue.umd.min.js

就執行：uglifyjs topology-vue.umd.js -o topology-vue.umd.min.js

你沒看錯！

就是這麼簡單！！

將JS文件進行壓縮，讓你的程序快馬加鞭地跑起來吧！！！

node.js 基礎操作

require 函數用來在一個模塊中引入另外一個模塊。傳入一個模塊名，返回一個模塊導出對象。用法： let cc = require(“模塊名”) ，其中模塊名可以用絕對路徑也可以用相對路徑,模塊的後綴名.js可以省略。例如：

require()函數用兩個作用：

exports 對象用來導出當前模塊的公共方法或屬性，別的模塊通過 require 函數使用當前模塊時得到的就是當前模塊的 exports 對象。用法： exports.name ,name為導出的對象名。例子：

module.exports 用來導出一個默認對象，沒有指定對象名，常見於修改模塊的原始導出對象。比如原本模塊導出的是一個對象，我們可以通過module.exports修改為導出一個函數。如下：

3.載入第三方包

Node.js中使用 CommonJs 模塊化機制，通過 npm 下載的第三方包，我們在項目中引入第三方包都是： let xx = require(‘第三方包名’) ，究竟 require 方法載入第三方包的原理機制是什麼，今天我們來探討下。

require(‘第三方包名’) 優先在載入該包的模塊的同級目錄 node_modules 中查找第三方包。

找到該第三方包中的 package.json 文件，並且找到裡面的 main 屬性對應的入口模塊，該入口模塊即為載入的第三方模塊。

如果在要載入的第三方包中沒有找到 package.json 文件或者是 package.json 文件中沒有 main 屬性，則默認載入第三方包中的 index.js 文件。

如果在載入第三方模塊的文件的同級目錄沒有找到 node_modules 文件夾，或者以上所有情況都沒有找到，則會向上一級父級目錄下查找 node_modules 文件夾，查找規則如上一致。

如果一直找到該模塊的磁碟根路徑都沒有找到，則會報錯： can not find module xxx 。

4.npm命令

npm 英文全稱： node package manager ，npm 為你和你的團隊打開了連接整個 JavaScript 天才世界的一扇大門。它是世界上最大的軟體註冊表，每星期大約有 30 億次的下載量，包含超過 600000 個 包（package） （即，代碼模塊）。來自各大洲的開源軟體開發者使用 npm 互相分享和借鑒。包的結構使您能夠輕鬆跟蹤依賴項和版本。我們平時開發項目都是需要使用npm下載依賴，常見的npm命令總結如下：

5.文件讀取

var fs = require(‘fs’)

同步：

var content = fs.readFileSync(‘hello.txt’,{flag:’r’,encoding:”utf-8″})

非同步（默認）：

flag：讀取模式

encoding：編碼格式

7.文件寫入

var fs = require(‘fs’)

格式：write=w read=r append =a

非同步：

8.文件刪除

fs . unlink ( ‘lc.txt’ , function (){

9.buffer緩衝區

1、數組不能進行二進位數據的操作2、js數組不像java、python等語言效率高3、buffer內存空間開闢出固定大小的內存

let buf1 = Buffer.alloc(10)

console.log(buf1)

allocUnsafe（之前的一些內容）（效率高）

10.文件目錄

var fs = require(‘fs’)

fs.readdir(path,callback)

導入 readline 包

let readline = require(‘readline’);

實例化介面對象(process對象，stdout/in輸入輸出)

question方法 提問

close 事件監聽

11.文件流

var fs = require(‘fs’)

語法： fs.createWriteStream(文件路徑，【可選的配置操作】)

let ws = fs.createWriteStream(“hello.txt”,{flags:”w”,encoding:”utf-8″});

let ws = fs.createWriteStream(“hello.txt”,{flags:”w”,encoding:”utf-8″});

實踐

fs.createReadStream(路徑，【可選的配置項】)

文檔

let rs = fs.createReadStream(‘hello.txt’,{flags:’r’,encoding:”utf-8″})

音樂

let rs = fs.createReadStream(‘snake.mp4′,{flags:’r’})

讀取時寫入

let ws = fs.createWriteStream(‘a.txt’,{flags:”w”,encoding:”utf-8″})

createReadStream.pipe(createWriteStream)

鏈式是通過連接輸出流到另外一個流並創建多個流操作鏈的機制。鏈式流一般用於管道操作。

接下來我們就是用管道和鏈式來壓縮和解壓文件。

創建 compress.js 文件, 代碼如下：

代碼執行結果如下：

執行完以上操作後，我們可以看到當前目錄下生成了 input.txt 的壓縮文件 input.txt.gz。

接下來，讓我們來解壓該文件，創建 decompress.js 文件，代碼如下：

12.node事件

Node.js 是單進程單線程應用程序，但是因為 V8 引擎提供的非同步執行回調介面，通過這些介面可以處理大量的並發，所以性能非常高。

Node.js 幾乎每一個 API 都是支持回調函數的。

Node.js 基本上所有的事件機制都是用設計模式中觀察者模式實現。

Node.js 單線程類似進入一個while(true)的事件循環，直到沒有事件觀察者退出，每個非同步事件都生成一個事件觀察者，如果有事件發生就調用該回調函數.

沒有使用 events 包 僅使用JavaScript事件監聽進行事件驅動

Node.js 使用事件驅動模型，當web server接收到請求，就把它關閉然後進行處理，然後去服務下一個web請求。

當這個請求完成，它被放回處理隊列，當到達隊列開頭，這個結果被返回給用戶。

這個模型非常高效可擴展性非常強，因為 webserver 一直接受請求而不等待任何讀寫操作。（這也稱之為非阻塞式IO或者事件驅動IO）

在事件驅動模型中，會生成一個主循環來監聽事件，當檢測到事件時觸發回調函數。

Node.js 有多個內置的事件，我們可以通過引入 events 模塊，並通過實例化 EventEmitter 類來綁定和監聽事件，如下實例：

以下程序綁定事件處理程序：

我們可以通過程序觸發事件：

接下來讓我們執行以上代碼：

在 Node 應用程序中，執行非同步操作的函數將回調函數作為最後一個參數， 回調函數接收錯誤對象作為第一個參數。

接下來讓我們來重新看下前面的實例，創建一個 input.txt ,文件內容如下：

創建 main.js 文件，代碼如下：

以上程序中 fs.readFile() 是非同步函數用於讀取文件。如果在讀取文件過程中發生錯誤，錯誤 err 對象就會輸出錯誤信息。

如果沒發生錯誤，readFile 跳過 err 對象的輸出，文件內容就通過回調函數輸出。

執行以上代碼，執行結果如下：

接下來我們刪除 input.txt 文件，執行結果如下所示：

因為文件 input.txt 不存在，所以輸出了錯誤信息。

Node.js 所有的非同步 I/O 操作在完成時都會發送一個事件到事件隊列。

Node.js 裡面的許多對象都會分發事件：一個 net.Server 對象會在每次有新連接時觸發一個事件， 一個 fs.readStream 對象會在文件被打開的時候觸發一個事件。所有這些產生事件的對象都是 events.EventEmitter 的實例。

events 模塊只提供了一個對象：events.EventEmitter。EventEmitter 的核心就是事件觸發與事件監聽器功能的封裝。

你可以通過require(“events”);來訪問該模塊。

EventEmitter 對象如果在實例化時發生錯誤，會觸發 error 事件。當添加新的監聽器時，newListener 事件會觸發，當監聽器被移除時，removeListener 事件被觸發。

下面我們用一個簡單的例子說明 EventEmitter 的用法：

執行結果如下：

運行這段代碼，1 秒後控制台輸出了 ‘some_event 事件觸發’ 。其原理是 event 對象註冊了事件 some_event 的一個監聽器，然後我們通過 setTimeout 在 1000 毫秒以後向 event 對象發送事件 some_event，此時會調用some_event 的監聽器。

EventEmitter 的每個事件由一個事件名和若干個參數組成，事件名是一個字元串，通常表達一定的語義。對於每個事件，EventEmitter 支持 若干個事件監聽器。

當事件觸發時，註冊到這個事件的事件監聽器被依次調用，事件參數作為回調函數參數傳遞。

讓我們以下面的例子解釋這個過程：

執行以上代碼，運行的結果如下：

以上例子中，emitter 為事件 someEvent 註冊了兩個事件監聽器，然後觸發了 someEvent 事件。

運行結果中可以看到兩個事件監聽器回調函數被先後調用。這就是EventEmitter最簡單的用法。

EventEmitter 提供了多個屬性，如 on 和 emit 。 on 函數用於綁定事件函數， emit 屬性用於觸發一個事件。接下來我們來具體看下 EventEmitter 的屬性介紹。

如何壓縮js

簡單的壓縮一般是：刪除注釋和空白符，替換變數名。

更激進點的做法還包括：刪除無用代碼，內聯函數，等價語句替換等。

有些開發者出於保護代碼的原因，還可能會對代碼進行混淆處理。

通常深度壓縮JS都必須要做的一步就是盡量地縮短變數名，因為一份體積巨大的JS代碼，其中的變數名會佔去不少空間。

壓縮js必須要注意：

1、壓縮前的代碼格式要標準。因為去掉換行與空格時，所有語句就變成一行，如果你的代碼有瑕疵(比如某行少了個分號)，那就會導致整個文件報錯。當然，現在有的壓縮工具已經比較智能了。

2、備份原文件。壓縮很可能不會一次成功，一般要多試，多改。

js壓縮工具：

1. YUI Compressor

2. Google Closure Compiler