escape 和 encodeURI 和 encodeURIComponent 区别?
在日常开发中,我们经常会用到 escape 和 encodeURI 和 encodeURIComponent 这三个方法对 url 或某些字符串进行转义,那这三个方法有什么区别呢?
escape
官方文档:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/escape
反转义方法:unescape
官方说明 escape 已弃用: 不再推荐使用该特性。建议使用后两者
escape 生成新的由十六进制转义序列替换的字符串
escape
函数是全局对象的属性。特色字符如:@*_+-./
被排除在外。
字符的 16 进制格式值,当该值小于等于 0xFF 时,用一个 2 位转义序列:%xx
表示。大于的话则使用 4 位序列:%uxxxx 表示。
escape("abc123"); // "abc123" escape("äöü"); // "%E4%F6%FC" escape("ć"); // "%u0107" // special characters escape("@*_+-./"); // "@*_+-./" escape("https://www.test.com/s/1Txqs9Syi75OfeR5ly03rXw?a=12312312312sfsafa") // 'https%3A//www.test.com/s/1Txqs9Syi75OfeR5ly03rXw%3Fa%3D12312312312sfsafa'
encodeURI
官方文档:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/encodeURI
反转义方法:decodeURI
encodeURI
会替换所有的字符,但不包括以下字符,即使它们具有适当的 UTF-8 转义序列:
类型 | 包含 |
---|---|
保留字符 | ; , / ? : @ & = + $ |
非转义的字符 | 字母 数字 - _ . ! ~ * ' ( ) |
数字符号 | # |
encodeURI
自身无法产生能适用于 HTTP GET 或 POST 请求的 URI,例如对于 XMLHTTPRequests,因为 "&", "+", 和 "=" 不会被编码,然而在 GET 和 POST 请求中它们是特殊字符。然而encodeURIComponent
这个方法会对这些字符编码。
encodeURI("abc123"); // "abc123" encodeURI("äöü"); // '%C3%A4%C3%B6%C3%BC' encodeURI("ć"); // '%C4%87' // special characters encodeURI("@*_+-./"); // "@*_+-./" encodeURI("https://www.test.com/s/1Txqs9Syi75OfeR5ly03rXw?a=12312312312sfsafa") // https://www.test.com/s/1Txqs9Syi75OfeR5ly03rXw?a=12312312312sfsafa'
encodeURIComponent
官方文档:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
反转义方法:decodeURIComponent
与 encodeURI()
相比,此函数会编码更多的字符,包括 URI 语法的一部分。【推荐使用】
encodeURIComponent
转义除了如下所示外的所有字符:
// 不转义的字符: // A-Z a-z 0-9 - _ . ! ~ * ' ( )
encodeURIComponent("abc123"); // "abc123" encodeURIComponent("äöü"); // '%C3%A4%C3%B6%C3%BC' encodeURIComponent("ć"); // '%C4%87' // special characters encodeURIComponent("@*_+-./"); // '%40*_%2B-.%2F' encodeURIComponent("https://www.test.com/s/1Txqs9Syi75OfeR5ly03rXw?a=12312312312sfsafa") // 'https%3A%2F%2Fwww.test.com%2Fs%2F1Txqs9Syi75OfeR5ly03rXw%3Fa%3D12312312312sfsafa'
注意,编码和解码都要使用成对的方案,否则可能会报错。