1. 課程介紹

◆ Buffer緩存區(qū)（了解）
◆ fs文件模塊（了解）
◆ fs讀取文件（掌握）
◆ fs寫文件（掌握）
◆ fs流讀寫方式（掌握）
◆ fs管道方式（掌握）
◆ zlib文件壓縮模塊（掌握）
◆ path路徑（掌握）
◆ url模塊（掌握）

2. Buffer緩存區(qū)

2.1. Buffer基本概念

JavaScript 語(yǔ)言自身只有字符串?dāng)?shù)據(jù)類型，沒(méi)有二進(jìn)制數(shù)據(jù)類型。二進(jìn)制可以存儲(chǔ)電腦中任何數(shù)據(jù)（比如：一段文本、一張圖片、一個(gè)硬盤，應(yīng)該說(shuō)電腦中所有的數(shù)據(jù)都是二進(jìn)制。）

緩存區(qū)就是一個(gè)臨時(shí)的內(nèi)存區(qū)域，用于存儲(chǔ)字節(jié)碼數(shù)據(jù)。

NodeJs是服務(wù)端在處理像TCP（網(wǎng)絡(luò)）流或文件流時(shí)，必須使用到二進(jìn)制數(shù)據(jù)。因此在 Node.js中，定義了一個(gè) Buffer 類，該類用來(lái)創(chuàng)建一個(gè)專門存放二進(jìn)制數(shù)據(jù)的緩存區(qū)。

2.2. Buffer創(chuàng)建

Buffer 對(duì)象可以通過(guò)多種方式來(lái)創(chuàng)建。

2.2.1. 方法 1

創(chuàng)建長(zhǎng)度為 10 字節(jié)（1kb=1024byte 1byte=8bit）的 Buffer 實(shí)例：

var buf = new Buffer(10);
注意：創(chuàng)建緩存區(qū)時(shí)必須指定大小。

2.2.2. 方法 2

通過(guò)給定的數(shù)組創(chuàng)建 Buffer 實(shí)例：

var bf2=new Buffer([97,61,62,63,122]);    97: a   122:z
console.log(bf2,bf2.toString());

注意：只能存數(shù)字，不能存字符串

2.2.3.方法 3

通過(guò)一個(gè)字符串來(lái)創(chuàng)建 Buffer 實(shí)例：
var buf = new Buffer("www.itsource.com", "utf-8");
utf-8 是默認(rèn)的編碼方式，此外它同樣支持以下編碼："ascii", "utf8", "utf16le", "ucs2", "base64" 和 "hex"。
UTF-8（8-bit Unicode Transformation Format）是一種針對(duì)Unicode的可變長(zhǎng)度字符編碼。
擴(kuò)展知識(shí)：位、字節(jié)、進(jìn)制、編碼方式（詳解文章末尾）

2.3. Buffer寫入內(nèi)容

語(yǔ)法

buf.write(string[, offset[, length]][, encoding])```

**參數(shù)描述如下：**
    ```string - 寫入緩沖區(qū)的字符串。
    offset - 緩沖區(qū)開始寫入的索引值，默認(rèn)為 0 。
    length - 寫入的字節(jié)數(shù)，默認(rèn)為 buffer.length
    encoding - 使用的編碼。默認(rèn)為 'utf8' 。

返回值
返回實(shí)際寫入的大小。如果 buffer 空間不足， 則只會(huì)寫入部分字符串。

實(shí)例：
var buf = new Buffer(256);
len = buf.write("www.itsource.com");
console.log("寫入字節(jié)數(shù) : "+  len);

2.4. Buffer讀取內(nèi)容(轉(zhuǎn)換為字符串)

語(yǔ)法：

讀取 Node 緩沖區(qū)數(shù)據(jù)的語(yǔ)法如下所示：
buf.toString([encoding[, start[, end]]])

參數(shù)描述如下：

 encoding - 使用的編碼。默認(rèn)為 'utf8' 。
 start - 指定開始讀取的索引位置，默認(rèn)為 0。
 end - 結(jié)束位置，默認(rèn)為緩沖區(qū)的末尾。

返回值：
解碼緩沖區(qū)數(shù)據(jù)并使用指定的編碼返回字符串。

var buf = new Buffer([97,98,99]);
console.log(buf.toString());

var s = “qq”;
s+=buf;//轉(zhuǎn)換為字符串
console.log(s);

2.5. Buffer拷貝

拷貝一個(gè)Buffer的某一段到操作對(duì)象中。

語(yǔ)法

源.copy(目標(biāo)緩存區(qū))
buf.copy(targetBuffer[, targetStart[, sourceStart[, sourceEnd]]])

參數(shù)
參數(shù)描述如下：
    targetBuffer - 要拷貝的 Buffer 對(duì)象。
    targetStart - 數(shù)字, 可選, 默認(rèn): 0
    sourceStart - 數(shù)字, 可選, 默認(rèn): 0
    sourceEnd - 數(shù)字, 可選, 默認(rèn): buffer.length

返回值：
沒(méi)有返回值。

實(shí)例：
var buffer1 = new Buffer('ABC');
// 拷貝一個(gè)緩沖區(qū)
var buffer2 = new Buffer(3);
buffer1.copy(buffer2);
console.log("buffer2 content: " + buffer2.toString());

3.fs文件基本操作

文件系統(tǒng)模塊fs (file system)，可以對(duì)文件和文件夾進(jìn)行讀取、寫入、刪除等操作。

3.1. fs模塊

?var fs = require("fs");//fs 系統(tǒng)文件模塊，對(duì)文件進(jìn)行操作.
Node.js 文件系統(tǒng)（fs 模塊）模塊中的方法均有異步和同步版本，例如讀取文件內(nèi)容的函數(shù)有異步的 fs.readFile() 和同步的 fs.readFileSync()。

3.2.文件讀取

var fs = require("fs");
// 異步讀取
fs.readFile('input.txt', function (err, data) {
   if (err) {
       return console.error(err);
   }
   console.log("異步讀取: " + data.toString());
});

// 同步讀取
var data = fs.readFileSync('input.txt');
console.log("同步讀取: " + data.toString());
console.log("程序執(zhí)行完畢。");

3.3.文件信息

以下為通過(guò)異步模式獲取文件信息的語(yǔ)法格式：
fs.stat(path, callback)

參數(shù)：

參數(shù)使用說(shuō)明如下：
path - 文件路徑。
callback - 回調(diào)函數(shù)，帶有兩個(gè)參數(shù)如：(err, stats), stats 是 fs.Stats 對(duì)象。
fs.stat(path)執(zhí)行后，會(huì)將stats類的實(shí)例返回給其回調(diào)函數(shù)。可以通過(guò)stats類中的

使用方法：
/*
 * 獲取文件信息：
 *      fs.stat('文件名',function(err,stats){
 *      stats ：是一個(gè)包含了文件信息的對(duì)象
 *              .size 文件大小
 *              .mtime 文件最后一次修改時(shí)間
*               .isFile()   判斷是否是一個(gè)文件
 *              .isDirectory()  判斷是否是一個(gè)文件夾
 *      })
 */

判斷是否為文件：
var fs = require('fs');
fs.stat('./my.txt', function (err, stats) {
        console.log("文件信息對(duì)象的屬性",stats);
        console.log("文件大小byte",stats.size);
        console.log("是否是文件",stats.isFile());
        console.log("是否是目錄",stats.isDirectory());
});

3.4.fs寫文件

以下為異步模式下寫入文件的語(yǔ)法格式：
fs.writeFile(filename, data[, options], callback)

如果文件存在，該方法寫入的內(nèi)容會(huì)覆蓋舊的文件內(nèi)容。

參數(shù)

參數(shù)使用說(shuō)明如下：
path - 文件路徑。
data - 要寫入文件的數(shù)據(jù)，可以是 String(字符串) 或 Buffer(流) 對(duì)象。
options - 該參數(shù)是一個(gè)對(duì)象，包含 {encoding, mode, flag}。默認(rèn)編碼為 utf8, 模式為 0666 ， flag 為 'w'
callback - 回調(diào)函數(shù)，回調(diào)函數(shù)只包含錯(cuò)誤信息參數(shù)(err)，在寫入失敗時(shí)返回。

實(shí)例
接下來(lái)我們創(chuàng)建 file.js 文件，代碼如下所示：
var fs = require("fs");
console.log("準(zhǔn)備寫入文件");
fs.writeFile('input.txt', '我是通過(guò)寫入的文件內(nèi)容！',  function(err) {
   if (err) {
       return console.error(err);
   }
   console.log("數(shù)據(jù)寫入成功！");
});


//先讀取并保留，然后加入新的數(shù)據(jù)
fs.readFile("02fileTest.txt",function(err,data){
    if(err){
        throw err;
    }
    else{
        var oldContent=data;
        fs.writeFile("02fileTest.txt",oldContent+",此消息不真實(shí)，是假的?。。?！",function(err){
            if(err){
                throw err;
            }
            else{
                console.log("文件追加寫入成功！??！");
            }
        });
    }
});

3.5.fs刪除文件

語(yǔ)法

以下為刪除文件的語(yǔ)法格式：
fs.unlink(path, callback)

參數(shù)

參數(shù)使用說(shuō)明如下：
path - 文件路徑。
callback - 回調(diào)函數(shù)，沒(méi)有參數(shù)。

實(shí)例
var fs = require("fs");

console.log("準(zhǔn)備刪除文件！");
fs.unlink('./my.txt', function(err) {
   if (err) {
       return ;
   }
   console.log("文件刪除成功！");
});

3.6.    fs獲取目錄中的文件
//獲取當(dāng)前目錄下面所有的文件及文件夾（列表--數(shù)組）
fs.readdir(".",function(err,files){
    console.log(files);
});

fs.readdir("..",function(err,files){
    console.log(files);
});

3.7.fs創(chuàng)建文件夾

語(yǔ)法

以下為創(chuàng)建文件夾的語(yǔ)法格式：
fs.mkdir(path, callback)

參數(shù)

參數(shù)使用說(shuō)明如下：
path - 文件夾路徑。
callback - 回調(diào)函數(shù)，沒(méi)有參數(shù)。

var fs = require(“fs”);
fs.mkdir('./aaa', function(err) {
   if (err) {
       return ;
   }
   console.log("文件夾創(chuàng)建成功！");
});

3.8.    fs刪除空文件夾
語(yǔ)法
以下為刪除文件的語(yǔ)法格式：
fs.rmdir(path, callback)
參數(shù)
參數(shù)使用說(shuō)明如下：
path - 文件夾路徑。
callback - 回調(diào)函數(shù)，沒(méi)有參數(shù)。

var fs = require(“fs”);
fs.rmdir('./aaa', function(err) {
   if (err) {
       return ;
   }
   console.log("文件夾刪除成功！");
});

4. fs流讀寫方式

前面我們已經(jīng)學(xué)習(xí)了如何使用fs模塊中的readFile方法、readFileSync方法讀取文件中內(nèi)容，及如何使用fs模塊中的writeFile方法、writeFileSync方法向一個(gè)文件寫入內(nèi)容。

用readFile方法或readFileSync方法讀取文件內(nèi)容時(shí)，Node.js首將文件內(nèi)容完整地讀入緩存區(qū)，再?gòu)脑摼彺鎱^(qū)中讀取文件內(nèi)容。在使用writeFile方法或writeFileSync方法寫入文件內(nèi)容時(shí)，Node.js首先將該文件內(nèi)容完整地讀人緩存區(qū)，然后再一次性的將緩存區(qū)中內(nèi)容寫入到文件中。

無(wú)論是read和write都是把文件視為一個(gè)整體，也就是說(shuō)，NodeJs需要在內(nèi)存中開辟與文件相等大小的空間來(lái)緩沖內(nèi)容，如果文件比較小，這的確沒(méi)有什么問(wèn)題，但是如果是一個(gè)非常大的（10G）文件會(huì)怎樣？?jī)?nèi)存就可能會(huì)溢出。

4.1. Stream流介紹

應(yīng)用程序中，流是一組有序的、有起點(diǎn)和終點(diǎn)的字節(jié)數(shù)據(jù)的傳輸方式。在應(yīng)用程序中各種對(duì)象之間交換與傳輸數(shù)據(jù)的時(shí)候，總是先將該對(duì)象中所包含的數(shù)據(jù)轉(zhuǎn)換為各種形式的流數(shù)據(jù)（即字節(jié)數(shù)據(jù)），再通過(guò)流的傳輸，到達(dá)目的對(duì)象后再將流數(shù)據(jù)轉(zhuǎn)換為該對(duì)象中可以使用的數(shù)據(jù)。

4.2. Stream流讀取

/*

* 讀取流

 *   var stream=fs.createReadStream('文件路徑'); //創(chuàng)建可以讀取的流

 *   stream.on(); //然后綁定事件

*    data 事件： 讀取數(shù)據(jù)事件，讀取到數(shù)據(jù)時(shí)就觸發(fā)。 默認(rèn)每次讀取數(shù)據(jù)大?。?4Kb

*    end 事件： 數(shù)據(jù)讀取結(jié)束事件，數(shù)據(jù)讀取結(jié)束時(shí)觸發(fā)。

 *    error事件： 錯(cuò)誤事件，讀取出錯(cuò)時(shí)觸發(fā)。

 */

var fs = require("fs");

var rs=fs.createReadStream("04fileTest111.txt");

// 設(shè)置編碼為 utf8。

rs.setEncoding("utf-8");

//存儲(chǔ)每次讀取的數(shù)據(jù)，統(tǒng)計(jì)讀取的次數(shù)

var dataAll="",count=0;

//綁定data事件，當(dāng)讀取到數(shù)據(jù)時(shí)執(zhí)行，每讀取64kb就執(zhí)行一次

rs.on("data",function(data){

 dataAll+=data;

 count++;

 console.log("讀取次數(shù): ",count);

});

rs.on("end",function(){

 //console.log("讀取完畢",dataAll.toString());

 console.log("讀取完畢");

});

rs.on("error",function(err){

 console.error("讀取錯(cuò)誤",err.message);

});

console.log("程序執(zhí)行完畢");

4.3. Stream流寫入

/*

* 寫入流：

 *   var stream=fs.createWriteStream('文件路徑'); //創(chuàng)建寫入流

 *   stream.write('要寫入的內(nèi)容，可以多次寫入');

 *   stream.end(); //結(jié)束標(biāo)記，因?yàn)橐粤鞯姆绞娇梢远啻螌懭?，所以必須要有一個(gè)明確結(jié)束標(biāo)記。

 *

* 事件：

*    finish 完成事件

*    error 錯(cuò)誤事件

 */

var fs = require("fs");

//如果文件不存在則會(huì)自動(dòng)創(chuàng)建文件

var ws=fs.createWriteStream("04fileTest22.txt");

for(var i=1;i<=100;i++){

 ws.write(i+"寫入流WriteStream\n");

}

//很重要：以流方式寫入數(shù)據(jù)，因?yàn)榭梢远啻螌懭耄孕枰粋€(gè)明確的結(jié)束標(biāo)記。

ws.end();

//綁定finish事件，在寫入完成時(shí)觸發(fā)。告訴用戶寫入成功了。

ws.on("finish",function(){

 console.log("流寫入完成！?。?);

});

ws.on("error",function(err){

 throw err;

});

console.log("程序執(zhí)行完畢");

5. fs管道方式

管道(pipe)提供了一個(gè)輸出流到輸入流的機(jī)制。通常我們用于從一個(gè)流中獲取數(shù)據(jù)并將數(shù)據(jù)傳遞到另外一個(gè)流中。

如上面的圖片所示，我們把文件比作裝水的桶，而水就是文件里的內(nèi)容，我們用一根管子(pipe)連接兩個(gè)桶使得水從一個(gè)桶流入另一個(gè)桶，這樣就慢慢的實(shí)現(xiàn)了大文件的復(fù)制過(guò)程。

/*

* 管道 pipe：

 *    管道(pipe)提供了一個(gè)輸出流到輸入流的機(jī)制。通常我們用于從一個(gè)流中獲取數(shù)據(jù)并將數(shù)據(jù)傳遞到另外一個(gè)流中。

* 語(yǔ)法：

* 讀取流.pipe(寫入流);

 */

//需求：使用流實(shí)現(xiàn)大文件的復(fù)制

var fs = require("fs");

// 創(chuàng)建一個(gè)可讀流

var readerStream = fs.createReadStream('input.txt');

// 創(chuàng)建一個(gè)可寫流

var writerStream = fs.createWriteStream('output.txt');

// 管道讀寫操作

// 讀取 input.txt 文件內(nèi)容，并將內(nèi)容寫入到 output.txt 文件中

readerStream.pipe(writerStream);

6. 鏈?zhǔn)搅?/h1>

鏈?zhǔn)绞峭ㄟ^(guò)連接輸出流到另外一個(gè)流并創(chuàng)建多個(gè)對(duì)個(gè)流操作鏈的機(jī)制。鏈?zhǔn)搅饕话阌糜诠艿啦僮鳌?/p>

/*

* 鏈?zhǔn)搅鳎?
* 從輸出流到輸入流，中間可以由多個(gè)中轉(zhuǎn)流組成，形成一個(gè)完整的鏈?zhǔn)襟w系。

* 語(yǔ)法：

* 輸出流.pipe(中轉(zhuǎn)流).pipe(輸入流);

 */

接下來(lái)我們就是用管道和鏈?zhǔn)絹?lái)壓縮和解壓文件。

創(chuàng)建 compress.js 文件, 代碼如下：

**讀取文件****--****壓縮****--****寫入文件**

//引入文件系統(tǒng)

var fs=require("fs");

//引入壓縮模塊

var zip=require("zlib");

//讀取文件--壓縮--寫入文件

//創(chuàng)建讀取流

var rs=fs.createReadStream("04fileTest2.txt");

//鏈?zhǔn)搅鲏嚎s文件

var gzip=zip.createGzip();

//創(chuàng)建寫入流（要保留原來(lái)的擴(kuò)展名.txt）

var ws=fs.createWriteStream("04fileTest2.txt.zip");

//讀取的文件流利用管道壓縮后，在通過(guò)管道流入寫入文件流

rs.pipe(gzip).pipe(ws);

console.log("文件壓縮成功！");

7.path路徑

NodeJs中，提供了一個(gè)path模塊，在這個(gè)模塊中，提供了許多實(shí)用的、可被用來(lái)處理與轉(zhuǎn)換文件路徑的方法及屬性。

/*
 * path模塊：用來(lái)處理與轉(zhuǎn)換文件路徑的方法及屬性。
 
 path.normalize(p)  規(guī)范化路徑
 path.join([path1][, path2][, ...])  用于連接路徑

 path.dirname(p)  返回路徑中代表文件夾
 path.basename(p[, ext]) 返回路徑中的文件名稱
 path.extname(p) 返回路徑中文件的后綴名

 path.parse()   返回一個(gè)對(duì)象包含路徑中的每一個(gè)部分
 *              .dir    返回路徑中的目錄路徑
 *              .base   返回含擴(kuò)展名的文件名
 *              .ext    返回?cái)U(kuò)展名
 *              .name   返回文件名
 */

7.1API方法和屬性

方法：

方法 & 描述
path.normalize(p)
規(guī)范化路徑，注意'..' 和 '.'。
path.join([path1][, path2][, ...])
用于連接路徑。該方法的主要用途在于，會(huì)正確使用當(dāng)前系統(tǒng)的路徑分隔符，Unix系統(tǒng)是"/"，Windows系統(tǒng)是"\"。
path.resolve([from ...], to)
將 to 參數(shù)解析為絕對(duì)路徑。
path.isAbsolute(path)
判斷參數(shù) path 是否是絕對(duì)路徑。
path.relative(from, to)
用于將路徑轉(zhuǎn)為相對(duì)路徑。
path.dirname(p)
返回路徑中代表文件夾的部分，同 Unix 的dirname 命令類似。
path.basename(p[, ext])
返回路徑中的最后一部分。同 Unix 命令 bashname 類似。
path.extname(p)
返回路徑中文件的后綴名，即路徑中最后一個(gè)'.'之后的部分。如果一個(gè)路徑中并不包含'.'或該路徑只包含一個(gè)'.' 且這個(gè)'.'為路徑的第一個(gè)字符，則此命令返回空字符串。
path.parse(pathString)
返回路徑字符串的對(duì)象。
path.format(pathObject)
從對(duì)象中返回路徑字符串，和 path.parse 相反。

屬性：
path.sep
平臺(tái)的文件路徑分隔符，'\\' 或 '/'。
path.delimiter
平臺(tái)的分隔符, ; or ':'.
path.posix
提供上述 path 的方法，不過(guò)總是以 posix 兼容的方式交互。
path.win32
提供上述 path 的方法，不過(guò)總是以 win32 兼容的方式交互。

7.2Path的使用

var path = require("path");
//路徑的規(guī)范
var testURL=".././test/././demo.mp4";
var commonURL=path.normalize(testURL);
console.log("不規(guī)范: ",testURL,"規(guī)范: ",commonURL);

//連接路徑
var myPath="itsource/h5/";
var joinPath=path.join(myPath,commonURL);
console.log("鏈接后: ",joinPath); //itsource/test/demo.mp4

//目錄名
var dirname=path.dirname(joinPath);
console.log("目錄名",dirname,"目錄名2",path.parse(joinPath).dir);

//文件名
var filename=path.basename(joinPath);
console.log("文件名",filename,"文件名2",path.parse(joinPath).base,"文件名3",path.parse(joinPath).name);

//擴(kuò)展名
var extname=path.extname(joinPath);
console.log("擴(kuò)展名",extname,"擴(kuò)展名2",path.parse(joinPath).ext);

8. url模塊（重點(diǎn)）

url 模塊提供了一些實(shí)用函數(shù)，用于 URL 處理與解析。 url模塊提供了兩套API來(lái)處理：一個(gè)是Node.js遺留的API，另一個(gè)則是通常使用在web瀏覽器中 實(shí)現(xiàn)了WHATWG URL Standard的API。

8.1. 什么是URL？（重點(diǎn)中的重點(diǎn)）

/*

 * URL模塊：

*  1\. 什么是URL？

 *   url全球統(tǒng)一資源定位符，對(duì)網(wǎng)站資源的一種簡(jiǎn)潔表達(dá)形式，也稱為網(wǎng)址。

 *

 *  2\. URL的構(gòu)成

 *   //完整結(jié)構(gòu)

* 協(xié)議://用戶名:密碼@主機(jī)名.名.域:端口號(hào)/目錄名/文件名.擴(kuò)展名?參數(shù)名=參數(shù)值&參數(shù)名2=參數(shù)值2#hash

 *

 *   //http協(xié)議的URL常見結(jié)構(gòu)：

* 協(xié)議://主機(jī)名.名.域:端口/目錄名/文件名.擴(kuò)展名?參數(shù)名=參數(shù)值&參數(shù)名2=參數(shù)值2#hash

 *

 *  https://www.baidu.com:443/img/bd_logo1.png

 *  http://music.163.com:80/#/discover/playlist

 *

 *  3. node.js的URL模塊

* 在node.js中提供了兩套對(duì)于url進(jìn)行處理的API功能。

*   1) 老的node.js url模塊

*   2) 新的url模塊（WHATWG URL標(biāo)準(zhǔn)模塊）

 */

一個(gè) URL 字符串是一個(gè)結(jié)構(gòu)化的字符串，它包含多個(gè)有意義的組成部分。 當(dāng)被解析時(shí)，會(huì)返回一個(gè) URL 對(duì)象，它包含每個(gè)組成部分作為屬性。

8.2. API方法和屬性

方法：

**方法 & 描述**

**Class: URL(****網(wǎng)址)** WHATWG URL標(biāo)準(zhǔn)的實(shí)現(xiàn)

屬性：

**url.hash**  獲取及設(shè)置URL的分段(hash)部分。

**url.host**  獲取及設(shè)置URL的主機(jī)(host)部分。

**url.hostname**  獲取及設(shè)置URL的主機(jī)名(hostname)部分。


**url.href**  獲取及設(shè)置序列化的URL。


**url.origin**

獲取只讀序列化的URL origin部分。

**url.pathname**

獲取及設(shè)置URL的路徑(path)部分。


**url.search**

獲取及設(shè)置URL的序列化查詢(query)部分。
...

var url=require("url");

var imgUrl="http://www.uml.org.cn/DevProcess/images/20076614557200.jpg";

//1\. 老的node.js 的url模塊

var oldUrl=url.parse(imgUrl);

console.log("老的URL中的各個(gè)部分",oldUrl);

/*

 Url {

 protocol: 'http:',

 slashes: true,

 auth: null,

 host: 'www.uml.org.cn',

 port: null,

 hostname: 'www.uml.org.cn',

 hash: null,

 search: null,

 query: null,

 pathname: '/DevProcess/images/20076614557200.jpg',

 path: '/DevProcess/images/20076614557200.jpg',

 href: 'http://www.uml.org.cn/DevProcess/images/20076614557200.jpg' }

*/

//2\. 新的url模塊(符合WHATWG標(biāo)準(zhǔn))

var newUrl=new url.Url (imgUrl);

console.log("新的URL中的各個(gè)部分",newUrl);

/*

 URL {

 href: 'http://www.uml.org.cn/DevProcess/images/20076614557200.jpg',

 origin: 'http://www.uml.org.cn',

 protocol: 'http:',

 username: '',

 password: '',

 host: 'www.uml.org.cn',

 hostname: 'www.uml.org.cn',

 port: '',

 pathname: '/DevProcess/images/20076614557200.jpg',

 search: '',

 searchParams: URLSearchParams {},

 hash: '' }

*/