Compare escape, encodeURI, encodeURIComponent

It is estimated that many front-end engineers do not know the difference between Escape,encodeuri, encodeURIComponent, or when to use which method, and why these methods should be used, and I will mainly explain the differences and usage of these three methods.
Escape Method:

Reference MSDN JScript:
The Escape method returns a string value (in Unicode format) that contains the contents of [the argument]. All spaces, punctuation, accented characters, and any other non-ascii characters is replaced with%XX encoding, where xx is equivalent to the hexadecimal number representing the character. For example, a space is returned as "%20."

The Escape method returns a string value that contains the Unicode format for the contents of the parameter. All "spaces", "punctuation", "accented characters", and any non-ASCII characters will be replaced with%XX encoding, where xx is a 16-digit number representing the original character. For example, a space will be replaced by%20

Description of the Mozilla Developer Core Javascript Guide
The Escape and unescape functions let you encode and decode strings. The escape function returns the hexadecimal encoding of a argument in the ISO Latin character set. The Unescape function returns the ASCII string for the specified hexadecimal encoding value.

The Escape and Unescape methods allow you to encode and decode strings. The escape call method returns a 16-based encoding of the ISO latin character parameter, and the Unescape method returns the ASCII character for the specified 16 binary encoding.
Look at the example.

JavaScript code

1. Escape (' [email protected]#$%^&* () {}[]=:/,;? +\ ' \ \ ')
2. %7e%[email protected]%23%24%25%5e%26*%28%29%7b%7d%5b%5d%3d%3a/%2c%3b%3f+%27%22%5c

Encode method:

Reference MSDN JScript:
The encodeURI method returns an encoded URI. If you pass the result of the decodeURI, the original string is returned. The encodeURI method does not encode the following characters: ":", "/", ";", and "?". Use encodeURIComponent to encode these characters.

The encodeURI method returns an encoded URI, and encodeURI does not encode the following characters:
":", "/", ";", and "?" and you can encode these characters with encodeURIComponent
Here's some more detail.

Quote Mozilla Developer Core Javascript Guide:
Encodes a Uniform Resource Identifier (URI) by replacing each instance of certain characters by one, both, or three escape Sequences representing the UTF-8 encoding of the character.

The URI is encoded by replacing each character instance into one or two or three encoded UTF-8 characters.
Example:

JavaScript code

1. encodeURI (' [email protected]#$%^&* () {}[]=:/,;? +\ ' \ \ ')
2. [Email protected]#$%25%5e&* ()%7b%7d%5b%5d=:/,;? + '%22%5c

encodeURIComponent Method:

Reference MSDN JScript Reference:
The encodeURIComponent method returns an encoded URI. If you pass the result of the decodeURIComponent, the original string is returned. Because the encodeURIComponent method encodes all characters, be careful if the string represents a path such as/folder1/ Folder2/default.html. The slash characters would be encoded and would is not being valid if sent as a request to a Web server. Use the encodeURI method if the string contains more than a single URI component.

encodeURIComponent will encode more characters, including the "/" that represents the path, so be cautious when using

Quote Mozilla Developer Core Javascript Guide:
Encodes a Uniform Resource Identifier (URI) component by replacing each instance of certain characters by one, both, or THR EE escape sequences representing the UTF-8 encoding of the character.

This explanation is the same as encode, in fact the difference between encodeURI and encodeURIComponent is that one is to encode more characters, and the other is to encode the URI part.
Examples of the same string:

Java code

1. Escape (' [email protected]#$%^&* () {}[]=:/,;? +\ ' \ \ ')
2. %7e%[email protected]%23%24%25%5e%26*%28%29%7b%7d%5b%5d%3d%3a/%2c%3b%3f+%27%22%5c
3. encodeURI (' [email protected]#$%^&* () {}[]=:/,;?  +\ ' \ \ ');
4. [Email protected]#$%25%5e&* ()%7b%7d%5b%5d=:/,;? + '%22%5c
5. encodeURIComponent (' [email protected]#$%^&* () {}[]=:/,;?  +\ ' \ \ ');
6. ~!%40%23%24%25%5e%26* ()%7b%7d%5b%5d%3d%3a%2f%2c%3b%3f%2b '%22%5c

Summary:
How to use it?

Escape
Escape does not encode the character: @*/+
The escape method does not return the encoding + character, and the + character is interpreted as a space on the server side, as is the case with the expression submission.
Since escape has such a disadvantage, and it does not properly handle non-ASCII characters correctly, we should try to avoid (to URIs) using escape, the best way is encodeuricomponent.

encodeURI:
encodeURI will not encode a lot of characters, there are: [email protected]#$&* () =:/,;? +
The encodeURI method is more specialized than the escape method for a URI encoding. You can use this method when you need to encode an entire URI, because the legitimate characters in the URI are not converted by encoding. It is important to note that the character ' is also a valid character in the URI, so it is not converted by encoding.

encodeURIComponent:
encodeURIComponent characters that are not encoded: ~!* () '
The encodeURIComponent method should be most commonly used to encode a single uricomponent (referred to as request parameters). It is important to note that the character ' is also a valid character in the URI, so it is not converted by encoding.


My Summary:
In fact, the most common front-end is encodeuricomponent, because this method will be in the URI of the querystring in the illegal character encoding, so that through the GET request to the server side to pass parameters without error.
Escape in the backend and the front end of the interface specification will often encounter, but generally do not need the front end in the local escape, usually the back-end interface to spit out the data after the escape, the front unescape.
This article is for translation

Original: Http://xkr.us/articles/javascript/encode-compare/
About Url,uri not quite understand the classmate can see http://www.ibm.com/developerworks/cn/xml/x-urlni.html
This article

Compare escape, encodeURI, encodeURIComponent