對于JS 中編碼(encode)和解碼(decode)的三種方法

JS對文字進(jìn)行編碼涉及3個函數(shù):escape,encodeURI,encodeURIComponent恍飘,相應(yīng)3個解碼函數(shù):unescape,decodeURI,decodeURIComponent


下面簡單介紹一下它們的區(qū)別

1 escape()函數(shù)

定義和用法?

escape() 函數(shù)可對字符串進(jìn)行編碼章母,這樣就可以在所有的計算機(jī)上讀取該字符串。

語法?

escape(string)

參數(shù)? 描述?

string? 必需彩郊。要被轉(zhuǎn)義或編碼的字符串蚪缀。

返回值?

已編碼的 string 的副本。其中某些字符被替換成了十六進(jìn)制的轉(zhuǎn)義序列筷登。

說明?

該方法不會對 ASCII 字母和數(shù)字進(jìn)行編碼哩盲,也不會對下面這些 ASCII 標(biāo)點符號進(jìn)行編碼: - _ . ! ~ * ' ( ) 廉油。其他所有的字符都會被轉(zhuǎn)義序列替換。


2 encodeURI()函數(shù)?

定義和用法?

encodeURI() 函數(shù)可把字符串作為 URI 進(jìn)行編碼班巩。

語法?

encodeURI(URIstring)

參數(shù)? 描述?

URIstring? 必需嘶炭。一個字符串,含有 URI 或其他要編碼的文本抑进。

返回值?

URIstring 的副本睡陪,其中的某些字符將被十六進(jìn)制的轉(zhuǎn)義序列進(jìn)行替換。

說明?

該方法不會對 ASCII 字母和數(shù)字進(jìn)行編碼信殊,也不會對這些 ASCII 標(biāo)點符號進(jìn)行編碼: - _ . ! ~ * ' ( ) 涡拘。

該方法的目的是對 URI 進(jìn)行完整的編碼,因此對以下在 URI 中具有特殊含義的 ASCII 標(biāo)點符號跷车,encodeURI() 函數(shù)是不會進(jìn)行轉(zhuǎn)義的:;/?:@&=+$,#


3 encodeURIComponent() 函數(shù)

定義和用法?

encodeURIComponent() 函數(shù)可把字符串作為 URI 組件進(jìn)行編碼汞窗。

語法?

encodeURIComponent(URIstring)

參數(shù)? 描述?

URIstring? 必需仲吏。一個字符串蝌焚,含有 URI 組件或其他要編碼的文本。

返回值?

URIstring 的副本许帐,其中的某些字符將被十六進(jìn)制的轉(zhuǎn)義序列進(jìn)行替換毕谴。

說明?

該方法不會對 ASCII 字母和數(shù)字進(jìn)行編碼涝开,也不會對這些 ASCII 標(biāo)點符號進(jìn)行編碼: - _ . ! ~ * ' ( ) 。

其他字符(比如 :;/?:@&=+$,# 這些用于分隔 URI 組件的標(biāo)點符號)拄养,都是由一個或多個十六進(jìn)制的轉(zhuǎn)義序列替換的银舱。

提示和注釋?

提示:請注意 encodeURIComponent() 函數(shù) 與 encodeURI() 函數(shù)的區(qū)別之處,前者假定它的參數(shù)是 URI 的一部分(比如協(xié)議棋弥、主機(jī)名诚欠、路徑或查詢字符串)。因此 encodeURIComponent() 函數(shù)將轉(zhuǎn)義用于分隔 URI 各個部分的標(biāo)點符號家乘。


4 總結(jié):

?通過對三個函數(shù)的分析仁锯,我們可以知道:escape()除了 ASCII 字母、數(shù)字和特定的符號外野芒,對傳進(jìn)來的字符串全部進(jìn)行轉(zhuǎn)義編碼双炕,因此如果想對URL編碼,最好不要使用此方法摇锋。而encodeURI() 用于編碼整個URI,因為URI中的合法字符都不會被編碼轉(zhuǎn)換站超。encodeURIComponent方法在編碼單個URIComponent(指請求參數(shù))應(yīng)當(dāng)是最常用的死相,它可以講參數(shù)中的中文、特殊字符進(jìn)行轉(zhuǎn)義生宛,而不會影響整個URL肮柜。


1、?? 傳遞參數(shù)時需要使用encodeURIComponent蔑赘,這樣組合的url才不會被#等特殊字符截斷缩赛。?

例如:document.write('退出

2撰糠、?? 進(jìn)行url跳轉(zhuǎn)時可以整體使用encodeURI

例如:Location.href=encodeURI("http://cang.baidu.com/do/s?word=百度&ct=21");

3、?? js使用數(shù)據(jù)時可以使用escape

例如:搜藏中history紀(jì)錄旨袒。

4砚尽、?? escape對0-255以外的unicode值進(jìn)行編碼時輸出%u****格式,其它情況下escape猾骡,encodeURI敷搪,encodeURIComponent編碼結(jié)果相同。

最多使用的應(yīng)為encodeURIComponent嫂便,它是將中文闸与、韓文等特殊字符轉(zhuǎn)換成utf-8格式的url編碼几迄,所以如果給后臺傳遞參數(shù)需要使用encodeURIComponent時需要后臺解碼對utf-8支持(form中的編碼方式和當(dāng)前頁面編碼方式相同)

escape不編碼字符有69個:*冰评,+甲雅,-,.弛姜,/妖枚,@绝页,_,0-9莱没,a-z酷鸦,A-Z

encodeURI不編碼字符有82個:!牙咏,#妄壶,$寄狼,&例嘱,',(奢浑,)腋腮,*,+徊哑,,莺丑,-墩蔓,.,/昏名,:轻局,;样刷,=,?夫壁,@,_沃疮,~盒让,0-9梅肤,a-z,A-Z

encodeURIComponent不編碼字符有71個:!邑茄, '姨蝴,(,)肺缕,*左医,-,.同木,_,~彤路,0-9秕硝,a-z,A-Z

示例(摘自W3School):

1 escape()

document.write(escape("Visit W3School!") + "
")

document.write(escape("?!=()#%&"))

輸出結(jié)果:

Visit%20W3School%21

%3F%21%3D%28%29%23%25%26

2 encodeURI()

document.write(encodeURI("http://www.w3school.com.cn")+ "
")

document.write(encodeURI("http://www.w3school.com.cn/My first/")+ "
")

document.write(encodeURI(",/?:@&=+$#"))

輸出結(jié)果:

http://www.w3school.com.cn

http://www.w3school.com.cn/My%20first/

,/?:@&=+$#

對整個URL進(jìn)行編碼洲尊,而URL的特定標(biāo)識符不會被轉(zhuǎn)碼远豺。

3? encodeURIComponent()

例1:

document.write(encodeURIComponent("http://www.w3school.com.cn"))

document.write("
")

document.write(encodeURIComponent("http://www.w3school.com.cn/p 1/"))

document.write("
")

document.write(encodeURIComponent(",/?:@&=+$#"))

輸出結(jié)果:

http%3A%2F%2Fwww.w3school.com.cn

http%3A%2F%2Fwww.w3school.com.cn%2Fp%201%2F

%2C%2F%3F%3A%40%26%3D%2B%24%23

對URL中的參數(shù)進(jìn)行編碼,因為參數(shù)也是一個URL坞嘀,如果不編碼會影響整個URL的跳轉(zhuǎn)躯护。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市丽涩,隨后出現(xiàn)的幾起案子棺滞,更是在濱河造成了極大的恐慌,老刑警劉巖内狸,帶你破解...
    沈念sama閱讀 211,194評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件检眯,死亡現(xiàn)場離奇詭異厘擂,居然都是意外死亡昆淡,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,058評論 2 385
  • 文/潘曉璐 我一進(jìn)店門刽严,熙熙樓的掌柜王于貴愁眉苦臉地迎上來昂灵,“玉大人,你說我怎么就攤上這事舞萄≌2梗” “怎么了?”我有些...
    開封第一講書人閱讀 156,780評論 0 346
  • 文/不壞的土叔 我叫張陵倒脓,是天一觀的道長撑螺。 經(jīng)常有香客問我,道長崎弃,這世上最難降的妖魔是什么甘晤? 我笑而不...
    開封第一講書人閱讀 56,388評論 1 283
  • 正文 為了忘掉前任含潘,我火速辦了婚禮,結(jié)果婚禮上线婚,老公的妹妹穿的比我還像新娘遏弱。我一直安慰自己,他們只是感情好塞弊,可當(dāng)我...
    茶點故事閱讀 65,430評論 5 384
  • 文/花漫 我一把揭開白布漱逸。 她就那樣靜靜地躺著,像睡著了一般游沿。 火紅的嫁衣襯著肌膚如雪饰抒。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,764評論 1 290
  • 那天诀黍,我揣著相機(jī)與錄音循集,去河邊找鬼。 笑死蔗草,一個胖子當(dāng)著我的面吹牛咒彤,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播咒精,決...
    沈念sama閱讀 38,907評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼镶柱,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了模叙?” 一聲冷哼從身側(cè)響起歇拆,我...
    開封第一講書人閱讀 37,679評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎范咨,沒想到半個月后故觅,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,122評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡渠啊,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,459評論 2 325
  • 正文 我和宋清朗相戀三年输吏,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片替蛉。...
    茶點故事閱讀 38,605評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡贯溅,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出躲查,到底是詐尸還是另有隱情它浅,我是刑警寧澤,帶...
    沈念sama閱讀 34,270評論 4 329
  • 正文 年R本政府宣布镣煮,位于F島的核電站姐霍,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜镊折,卻給世界環(huán)境...
    茶點故事閱讀 39,867評論 3 312
  • 文/蒙蒙 一黔衡、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧腌乡,春花似錦盟劫、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,734評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至急迂,卻和暖如春影所,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背僚碎。 一陣腳步聲響...
    開封第一講書人閱讀 31,961評論 1 265
  • 我被黑心中介騙來泰國打工猴娩, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人勺阐。 一個月前我還...
    沈念sama閱讀 46,297評論 2 360
  • 正文 我出身青樓卷中,卻偏偏與公主長得像,于是被迫代替她去往敵國和親渊抽。 傳聞我的和親對象是個殘疾皇子蟆豫,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,472評論 2 348

推薦閱讀更多精彩內(nèi)容

  • 直接上代碼看一下,看出區(qū)別了剩下就不用看了 第一個方法好像棄用了 JavaScript中有三個可以對字符串編碼的函...
    蔣昉霖閱讀 767評論 0 0
  • 一愤估、定義和用法 encodeURI() 函數(shù)可把字符串作為 URI 進(jìn)行編碼帮辟。 語法 encodeURI(URIs...
    程序猿吳彥祖閱讀 1,695評論 0 1
  • 終于忙完一天的工作由驹,計劃中的,計劃外的震捣,對于習(xí)慣早睡的我荔棉,此刻已盡臨近深夜。 我很困蒿赢,但我睡不著。雖然知道只要閉上...
    Cathy1001閱讀 1,448評論 2 2
  • 想去找你 想和你一起過日子 但是又很擔(dān)憂 害怕失去自由 可其實這根本都不能算是問題 因為你根本不限制我 而我也不想...
    素靨閱讀 136評論 0 0
  • 那年冬天,天氣很冷嗅钻,教室里面只有寥寥可數(shù)的幾個人皂冰,因為連續(xù)的補(bǔ)課和低溫店展,很多同學(xué)對于寒冷都無力抵抗,我也是一樣秃流。 ...
    草瓣閱讀 502評論 1 1