Javascript URLEncode - escape , encodeURI , encodeURIComponent 的差異

在使用Javascript的URL encode時，常不清楚該使用哪一種方式，
今將escape、encodeURI、encodeURIComponent三種方法得差異整理如下：

參考幾篇不錯的文章：

1. 清楚解釋各encode對中文的編碼方式：用Javascript替中文轉碼：escape, encodeURI, encodeURIComponent 的比較
2. https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI
3. https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent
4. http://blog.miniasp.com/?tag=/encodeuri
5. http://diary.tw/march/category/Javascript

並依得到的資訊，實際測試字串"A Z a z 0 1 堃 - _ . ! ~ * ' ( ) ; , / ? : @ & = + $ #"等字元，在被不同JavaScript URLEncode方法Encode後的結果，整理如下表：

文字類型

英文

數字

中文

Unescaped characters

Reserved characters

Score

原始字串

A

Z

a

z

0

1

堃

-

_

.

!

~

*

'

(

)

;

,

/

?

:

@

&

=

+

$

#

escape後

A

Z

a

z

0

1

%u5803

-

_

.

%21

%7E

*

%27

%28

%29

%3B

%2C

/

%3F

%3A

@

%26

%3D

+

%24

%23

encodeURI後

A

Z

a

z

0

1

%E5%A0%83

-

_

.

!

~

*

'

(

)

;

,

/

?

:

@

&

=

+

$

#

encodeURI Component後

A

Z

a

z

0

1

%E5%A0%83

-

_

.

!

~

*

'

(

)

%3B

%2C

%2F

%3F

%3A

%40

%26

%3D

%2B

%24

%23

ps. 上表紅色字體表示部分，是突顯各Encode方法，不會做Encode的字元!

由上方的資訊可以整理出一些結論：

1. 英文字、數字、-、_、.、* 這些字不管是哪一種Javascript URLEncode方式，都是不會被encode的!
2. 各Encode方法，都是Encode為Unicode，但escape是Encode為UTF-16、而encodeURI與encodeURIComponent則是UTF-8。
3. 因為 Javascript 都是 Encode 為 Unicode ，因此如有特殊用途須使用Big5編碼，需自行想辦法處理，例如 URI 中的 MailTo: 用法，outlook2010以前的版本，都只支援讀取Big5編碼! 但outlook 2010 卻又只支援讀取 Unicode @@。
4. 符號部分，UTF-8與UTF-16的結果相同，因此上表可看到，除了被排除不Encode的字元外，使用escape與encodeURIComponent做Encode後的結果是相同的!
5. 中文字部分，因 UTF-16 與 UTF-8 的編碼結果不同(可參考上表差異)，所以如內容有中文，則必須慎選Encode的方式，不然就要有對應的處理方式!
6. encodeURI 與 encodeURIComponent 的差異是，encodeURI 會排除對 URL 有特殊意義的字元不做編碼，因此會排除 Reserved characters 與 Score 類型的字元。
7. encodeURI 與 encodeURIComponent 均會排除 Unescaped characters 類型的字元。

所以在使用時，我認為可由兩方面去思考，判斷應使用哪一種Encode：

1. 您要Encode的內容，適合使用哪一種編碼方式?! UTF-8 還是 UTF-16 ?!
   (這點跟使用的環境支援哪一種Encode … 等會有相關。)
2. 您要Encode的內容，是否包含了於 URI 有特殊意義的字元?!

大致上這三種 javascript 的 URLEncode 方式特性整理如上。 希望下次使用時，可以清楚分辨該使用哪一種囉~~~