Javascript中encodeURI和encodeURIComponent两个方法都是encode URI的，但是究竟有什么区别，下面将详细说明区别及使用场景。

差异

encodeURI

encode所有的字符，除了下面的字符

A-Za-z0-9;,/?:@&=+$-_.!~*‘( ) #

encodeURIComponent

encode所有字符。除了下面的字符

A-Za-z0-9-_.!~*‘( )

两者差异

encodeURIComponent encode的字符多于encodeURI的字符

; , / ? : @ & = + $#

使用场景

encodeURIComponent

当encode内容作为 URI 的参数值时，使用encodeURIComponent

1
2
3
4
5

var uri = "https://binbean.github.io/q=" + encodeURIComponent("苹果")
//encode后的内容  https://binbean.github.io/q=%E8%8B%B9%E6%9E%9C

var deepUri = "app://webview?url=" + encodeURIComponent("https://binbean.github.io/?q=%E8%8B%B9%E6%9E%9C&from=direct")
//encode后的内容  app://webview?url=https%3A%2F%2Fbinbean.github.io%2F%3Fq%3D%25E8%258B%25B9%25E6%259E%259C%26from%3Ddirect

encodeURI

当encode的内容是独立的URI，不作为其他URI附属时，使用encodeURI

1
2

var uri = encodeURI("https://binbean.github.io/q=苹果")
//encode后的内容 https://binbean.github.io/q=%E8%8B%B9%E6%9E%9C