前端js编码
1、首先是encodeURI和encodeURIComponent;
从名字可以清晰的看出他两都是主要用于url编码的,那之间有什么区别呢?唯一区别就是编码的字符范围,其中
encodeURI方法不会对下列字符编码 ASCII字母、数字、~!@#$&*()=:/,;?+';
encodeURIComponent方法不会对下列字符编码 ASCII字母、数字、~!*()';
很明显encodeURIComponent要比encodeURI编码更多东西,也就是更加严格
var url="https://www.baidu.com?name=123sex=man";
var test2=encodeURI(url);
var test=encodeURIComponent(url);
console.log(test2)
console.log(test)
上面简单的例子也很明显。他两相对应的解码为decodeURI()、decodeURIComponent()
2、btoa与atob
WindowOrWorkerGlobalScope.btoa() 从 String
对象中创建一个 base-64 编码的 ASCII 字符串,其中字符串中的每个字符都被视为一个二进制数据字节。简单来说就是base64编码。
var url="https://www.baidu.com";
var test2=window.btoa(url);
console.log(test2) //aHR0cHM6Ly93d3cuYmFpZHUuY29t
从上面的例子可以看出已经被编码成base64格式,但当我们采用中文时会发现报错,
var url="深圳南山";
var test2=window.btoa(url);
console.log(test2)
我们运行后会发现报错如下图
这是为什么呢?由于这个函数将每个字符视为二进制数据的字节,而不管实际组成字符的字节数是多少,所以如果任何字符的码位超出 0x00 ~ 0xFF 范围,则会引发 InvalidCharacterError
异常。请参阅 Unicode_字符串 ,该示例演示如何编码字符数超出 0x00 ~ 0xFF 范围的字符串,我们通过以下方式完成编码
var url="深圳南山";
function utf8_to_b64( str ) {
return window.btoa(unescape(encodeURIComponent( str )));
}
function b64_to_utf8( str ) {
return decodeURIComponent(escape(window.atob( str )));
}
console.log(utf8_to_b64(url)) //5rex5Zyz5Y2X5bGx
console.log(b64_to_utf8(utf8_to_b64(url))) //深圳南山
在js引擎内部,encodeURIComponent(str)相当于escape(unicodeToUTF8(str))所以可以推导出unicodeToUTF8(str)等同于unescape(encodeURIComponent(str))
3、escape()
escape() 函数可对字符串进行编码,该方法不会对 ASCII 字母和数字进行编码,也不会对下面这些 ASCII 标点符号进行编码: * @ - _ + . / 。其他所有的字符都会被转义序列替换。
var url="深圳南山/&@3232";
var test=escape(url)
console.log(test) //%u6DF1%u5733%u5357%u5C71/%26@3232
unescape() 函数可对通过 escape() 编码的字符串进行解码。不过ECMAScript v3 已从标准中删除了 unescape() 函数,并反对使用它,因此应该用 decodeURI() 和 decodeURIComponent() 取而代之。
最新文章
- 对一致性Hash算法,Java代码实现的深入研究
- Yii2.x 互斥锁Mutex-类图
- Android中基于CGroup的memory子系统HAL层分析-lmkd
- Java实现冒泡排序
- C语言学习020:可变参数函数
- poj-1410 Intersection
- xenserver+starwind架构布署
- java HastTable实现
- kbengine新手教程
- Redis 的安装与使用
- NancyFX 第七章 模型绑定和验证
- C++语言之类class
- zTree 3-- jQuery 树插件笔记
- rpm 包的安装:
- php的register_long_arrays可以关闭以提高性能
- webstorm ps
- [Win] Win8权限机制导致R安装包失败
- [JetBrains注册] 利用教育邮箱注册JetBrains产品(pycharm、idea等)的方法
- directive例子2
- Linux 内核中断内幕【转】