如果你正在编码一个字符串以放入URL组件(一个querystring参数)，你应该调用encodeURIComponent。

如果你正在编码一个现有的URL，调用encodeURI。

这取决于你真正想做什么。

encodeURI假设输入是一个完整的URI，其中可能包含一些需要编码的字符。

encodeURIComponent将编码具有特殊含义的所有内容，因此您可以将它用于uri的组件，例如

var world = "A string with symbols & characters that have special meaning?";
var uri = 'http://example.com/foo?hello=' + encodeURIComponent(world);

xkr.us有一个很好的讨论，有例子。引用他们的总结:

escape()方法不对+字符进行编码 解释为服务器端的空间，以及由 在他们的领域中有空间的形式。由于这一缺点和 事实上，这个函数无法处理非ascii字符 正确地，应该尽可能避免使用escape()。的 最好的替代方法通常是encodeURIComponent().

Escape()不会编码:@*/+

encodeURI()方法的使用比escape()更专门一些 因为它为uri编码，而不是为查询字符串编码 URL的一部分。当需要将字符串编码为时，使用此方法 用于任何使用uri并需要特定字符的资源 保持un-encoded。请注意，此方法不编码'

.字符，因为它是uri中的有效字符

encodeURI()不会编码:~!@#$&*()=:/，;?+ '

最后，encodeURIComponent()方法应该在大多数情况下使用 当对URI的单个组件进行编码时。这个方法会进行编码 某些字符通常被认为是特殊字符 uri，这样可以包括许多组件。注意这个方法 没有编码'字符，因为它是一个有效的字符 uri。< / p >

encodeURIComponent()不会编码:~!*()'

encodeURIComponent():假设它的参数是一个部分(如协议、主机名、路径或查询字符串) URI的。因此，它转义了用于分隔URI部分的标点符号

encodeURI():用于对已有url进行编码

encodeURI和encodeURIComponent的区别:

encodeURIComponent(value)主要用于编码queryString参数值，它编码value中每个适用的字符。encodeURI忽略协议前缀(http://)和域名。

function fixedEncodeURIComponent(str) {
return encodeURIComponent(str).replace(/[!*]/g, function(c) {
return '%' + c.charCodeAt(0).toString(16);
});
}

(源)

作为一般规则使用encodeURIComponent。不要害怕长名字，认为它的用途更具体，对我来说，这是更常用的方法。也不要因为你测试了它，它似乎编码正确而被误导使用encodeURI，它可能不是你想要使用的，即使你在名字字段中使用“Fred”的简单测试有效，你会发现以后当你使用更高级的文本，如添加一个和号或标签时，它会失败。你可以看看其他的答案。

其他答案描述了目的。下面是每个函数会进行转换的字符:

control = '\x00\x01\x02\x03\x04\x05\x06\x07\x08\x09\x0A\x0B\x0C\x0D\x0E\x0F'
+ '\x10\x11\x12\x13\x14\X15\x16\x17\x18\x19\x1A\x1B\x1C\x1D\x1E\x1F'
+ '\x7F'
encodeURI         (control + ' "%<>[\\]^`{|}'                             )
encodeURIComponent(control + ' "%<>[\\]^`{|}' + '#$&,:;=?' + '+/@'        )
escape            (control + ' "%<>[\\]^`{|}' + '#$&,:;=?' +       "!'()~")

以上所有字符都转换为百分制16进制代码。空格到%20，百分数到%25，等等。下面的字符没有改变。

下面是函数不会转换的字符:

pass_thru = '*-._0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'


encodeURI         (pass_thru + '#$&,:;=?' + '+/@' + "!'()~")
encodeURIComponent(pass_thru +                      "!'()~")
escape            (pass_thru +              '+/@'          )

以下是摘要。

1. escape()将不编码@ * _ + -。/

   不要使用它。

2. encodeURI()不会编码A-Z A-Z 0-9;， / ?: @ &= + $ - _。！ ~ * ' () #

   当你的输入是一个完整的URL，如“https://searchexample.com/search?q=wiki”时使用它

3. encodeURIComponent()将不编码A-Z A-Z 0-9 - _。！ ~ * ' ()

   当你的输入是一个完整URL的一部分时使用它 如 const queryStr = encodeURIComponent(someString) < / p >

encodeURI和encodeURIComponent用于不同的目的。
其中一些差异是

1. encodeURI用于编码一个完整的URL，而encodeURIComponent用于对URI组件进行编码，例如查询字符串。

11个字符不是由encodeURI编码的，而是由encodeURIComponent编码的。 列表:< / p >