一文详解JavaScript的转码方式

更新时间：2023年09月07日 08:32:48 作者：编程三昧

JavaScript 转码是指将 JavaScript 代码从一种编码方式转换为另一种编码方式,常见的转码方式包括 URL 编码和 Base64 编码,解码是前端比较常见的一种操作,本文就给大家讲讲JavaScript转码方式

特殊符号是否编码

escape: 不编码ASCII字母、数字、标点符号"@ * _ + - . /"，对其他所有字符进行编码。
encodeURI: 不编码ASCII字母、数字、标点符号"; / ? : @ & = + $ , #",对其他所有字符进行编码。
encodeURIComponent: 对所有字符进行编码

转码结果

escape: 输出字符的Unicode编码值
encodeURI: 输出符号的utf-8形式，并且在每个字节前加上%
encodeURIComponent: 输出符号的utf-8形式，并且在每个字节前加上%

tips:

但是我们知道，网页在提交表单的时候，如果有空格，则会被转化为+字符。服务器处理数据的时候，会把+号处理成空格。

注意点

为何解码最好解两次

例如笔者常用的解码方式

function decode(str) {
    var r = '';
    try {
        r = decodeURIComponent(decodeURIComponent(str));   
    }catch(e){
        try {
            r = decodeURIComponent(str);
        } catch(e) {
            try {
                r = unescape(str); //Unicode
            }catch(e) {
                r = str;
            }
        }
    }
    return r;
}

为什么捕抓异常: 其实decodeURIComponent是会有时候会爆异常的..这个属于bug
为什么要尝试两次编码、一次编码、和无编码: 因为防止服务端encode两次、一次、或者无编码
为什么要最后unescape,因为只有这个方法能解析Unicode编码

到此这篇关于一文详解JavaScript的转码方式的文章就介绍到这了,更多相关JavaScript转码方式内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

JsRender for index循环索引用法详解
这篇文章主要介绍了JsRender for index循环索引用法,以实例形式详细分析了JsRender中循环的用法,需要的朋友可以参考下
2014-10-10
谈谈对offsetleft兼容性的理解
offsetleft属性具有一定的兼容性问题，在IE7浏览器中，它的返回值是相对于最近的父类元素的左侧的距离，本文通过代码示例给大家介绍offsetleft兼容性问题，小伙伴们一起看看吧
2015-11-11
一文带你快速理解JavaScript中call()函数的使用
这篇文章主要为大家详细介绍了JavaScript中call()函数的使用的相关知识，文中的示例代码讲解详细，具有一定的学习价值，需要的可以参考一下
2023-03-03
javascript实现点击按钮变色
这篇文章主要为大家详细介绍了javascript实现点击按钮变色，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-07-07
JavaScript调用堆栈及setTimeout使用方法深入剖析
Javascript中会经常用到setTimeout来推迟一个函数的执行并且会在执行到这句话后延迟1秒钟来弹出alert窗口，接下来将介绍一下JavaScript调用堆栈和setTimeout用法，感兴趣的你可不要错过了哈
2013-02-02
JS动态的把左边列表添加到右边的实现代码(可上下移动)
在javascript前端开发过程中经常见到动态的把左边列表添加到右边，基于js代码怎么实现的呢？今天小编通过本文给大家介绍下js 左边列表添加到右边的实现方法，感兴趣的朋友一起看看吧
2016-11-11
js严格模式和非严格模式区别小结
JavaScript严格模式通过更严格的规则提升代码质量,禁止全局变量、重复参数名及修改只读属性,非严格模式宽容但易引发静默错误,下面就来介绍一下两者的区别,感兴趣的可以了解一下
2025-07-07
基于Layui自定义模块的使用方法详解
今天小编就为大家分享一篇基于Layui自定义模块的使用方法详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-09-09
Echarts中的clear()和dispose()用法实例
这篇文章主要给大家介绍了关于Echarts中clear()和dispose()用法的相关资料,clear和dispose是echarts提供的用于解决内存溢出的方法 ,文中介绍的非常详细,需要的朋友可以参考下
2023-10-10
js动态生成表格(节点操作)
这篇文章主要为大家详细介绍了js动态生成表格，进行节点操作，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-01-01