一、这四个方法的用处

1、用来编码和解码URI的

统一资源标识符,或叫做 URI,是用来标识互联网上的资源(例如,网页或文件)和怎样访问这些资源的传输协议(例如,HTTP 或 FTP)的字符串。除了encodeURI、encodeURIComponent、decodeURI、decodeURIComponent四个用来编码和解码 URI 的函数之外 ECMAScript 语言自身不提供任何使用 URL 的支持。

2、URI组成形式
一个 URI 是由组件分隔符分割的组件序列组成。其一般形式是:

Scheme : First / Second ; Third ? Fourth

其中斜体的名字代表组件;“:”, “/”, “;”,“?”是当作分隔符的保留字符

3、有和不同?

encodeURI 和 decodeURI 函数操作的是完整的 URI;这俩函数假定 URI 中的任何保留字符都有特殊意义,所有不会编码它们。

encodeURIComponent 和 decodeURIComponent 函数操作的是组成 URI 的个别组件;这俩函数假定任何保留字符都代表普通文本,所以必须编码它们,所以它们(保留字符)出现在一个完整 URI 的组件里面时不会被解释成保留字符了。

以上说明摘自ECMAScript标准,为了容易读懂做了点编辑加工。

4、图解四个函数的不同:

ECMA对这四个函数还做了详细解释,可能是为了写的更逻辑化一些,采用了类似变量配合逻辑的写法来说明,但是让初学者看得云里雾里的特别绕,所以有必要把它写得更像是人读的东西……

当 URI 里包含一个没在上面列出的字符或有时不想让给定的保留字符有特殊意义,那么必须编码这个字符。字符被转换成 UTF-8 编码,首先从 UT​​F-16 转换成相应的代码点值的替代。然后返回的字节序列转换为一个字符串,每个字节用一个“%xx”形式的转移序列表示。(具体转换规则可以参考抽象操作EncodeDecode的说明

一张图看懂encodeURI、encodeURIComponent、decodeURI、decodeURIComponent的区别的更多相关文章

  1. 一张图看懂360°全景和VR的区别

    2016年开始,Facebook.谷歌.腾讯.阿里等互联网巨头都已开始抢食VR(虚拟现实)这块的大蛋糕,虚拟现实发展速度惊人.在这样强势发展的背景下,一些产品也开始打着VR的幌子,挂着VR的噱头卖起来 ...

  2. 一张图看懂normal,static,sealed,abstract 的 区别

    +-------------------------+---+--------+--------+--------+----------+ | Class Type | | normal | stat ...

  3. 【Network】一张图看懂 Reactor 与 Proactor 模型的区别

    首先来看看Reactor模式,Reactor模式应用于同步I/O的场景.我们以读操作为例来看看Reactor中的具体步骤:读取操作:1. 应用程序注册读就需事件和相关联的事件处理器2. 事件分离器等待 ...

  4. 一张图看懂offsetX, clientX, pageX, screenX的区别

    1.具体含义见下图1 2.浏览器的兼任情况

  5. 一张图看懂IaaS, PaaS和SaaS的区别

    转至:https://blog.csdn.net/liujg79/article/details/84453736 编译:老夫子 原文:https://www.bmc.com/blogs/saas-v ...

  6. 一张图看懂ANSYS17.0 流体 新功能与改进

    一张图看懂ANSYS17.0 流体 新功能与改进   提交 我的留言 加载中 已留言   一张图看懂ANSYS17.0 流体 新功能与改进 原创2016-02-03ANSYS模拟在线模拟在线 模拟在线 ...

  7. 一张图看懂开源许可协议,开源许可证GPL、BSD、MIT、Mozilla、Apache和LGPL的区别

    一张图看懂开源许可协议,开源许可证GPL.BSD.MIT.Mozilla.Apache和LGPL的区别 首先借用有心人士的一张相当直观清晰的图来划分各种协议:开源许可证GPL.BSD.MIT.Mozi ...

  8. FUNMVP:几张图看懂区块链技术到底是什么?(转载)

    几张图看懂区块链技术到底是什么? 本文转载自:http://www.cnblogs.com/behindman/p/8873191.html “区块链”的概念可以说是异常火爆,好像互联网金融峰会上没人 ...

  9. 4张图看懂delphi 10生成ipa和在iPhone虚拟器上调试(教程)

    4张图看懂delphi 10生成ipa和在iPhone虚拟器上调试(教程) (2016-02-01 03:21:06) 转载▼ 标签: delphi ios delphi10 教程 编程 分类: 编程 ...

随机推荐

  1. [CQOI2009] 中位数

    不错的思维题 传送门:$>here<$ 题意:给出一个N的排列,求出其中有多少个连续子段的中位数是b 数据范围:$N \leq 100000$ $Solution$ 先考虑中位数的意义:一 ...

  2. 科学地增加postgresql最大连接数

    PG配置文件路径 /etc/postgresql/9.3/main/postgresql.conf 首先如何查看最大连接数 This SQL will help you select max_conn ...

  3. Linux-文件管理

    文件管理 创建.复制.删除.移动.查看.编辑.压缩.查找 Linux目录结构 Windows: 以多根的方式组织文件 C:\ D:\ E:\Linux: 以单根的方式组织文件 / /目录结构: FSH ...

  4. pwn-ROP

    首先对目标文件checksec,提示NX  enabled,看看其解释 NX/DEP(堆栈不可执行) NX即No-eXecute(不可执行)的意思,NX(DEP)的基本原理是将数据所在内存页标识为不可 ...

  5. CentOS部署yapi

    转载自 https://www.linuxidc.com/Linux/2018-01/150513.htm 在mongoDB添加yum源时,源路径有修改,原文中的路径404不可用 一.准备工作 1.1 ...

  6. (Python)自动生成代码(方法一)

    在写某个平台的自动化脚本时,笔者把全部的操作都封装到了两个类中,page.py和commonpage.py: page.py部分代码: class BasePage(object): ''' 页面基础 ...

  7. 自定义element-ui中的图标

    element-ui图标库图标较少,比如有关于登录页面输入框里的用户名和密码的小图标就没有,这个时候可以自定义图标. <el-input v-model="loginForm.user ...

  8. Zabbix 添加端口监控链接

    zabbix 添加端口监控 连接数: zabbix  配置  添加 监控项: 其他检测 方式也是 示例: zabbix 客户端配置文件添加: 编辑 zabbix_agentd.conf  添加  端口 ...

  9. 手写代码 - java.util.List 相关

    1-ArrayList 访问元素,不能使用ArrayList[0]形式!!!! 必须使用ArrayList.get(0);

  10. 【codechef】FN/Fibonacci Number

    题意 给出 c 和 P ,求最小的非负整数 n 使得 \(Fib(n)=c(mod~ P)\) 其中 P 是质数且 模 10 等于一个完全平方数(也就是说 P 的末位是个完全平方数,那么只能是 1 或 ...