三种编码方式有什么区别
URL 只允许 ASCII 字母、数字和少数符号，其他字符必须按 UTF-8 拆成字节，每个字节写成“% + 两位十六进制”，这叫百分号编码。一个汉字在 UTF-8 里占 3 个字节，所以“北京”会变成 %E5%8C%97%E4%BA%AC，长度增加到 9 倍。
encodeURIComponent 编码最彻底，只保留字母、数字和 - _ . ! ~ * ' ( )，连 / ? & = # : 都会被编码，适合处理单个参数值，例如把用户输入拼进 ?q= 后面，否则输入中的 & 会把参数截断。encodeURI 用于整条网址，它额外保留 ; / ? : @ & = + $ , # 这些 URL 结构字符，只编码空格、中文和引号等，保证网址结构不变。decodeURIComponent 把百分号序列还原成原文，遇到 %E5 这种不完整或非法的序列会抛出 URIError。
+ 号与 %20 的问题
空格有两种写法：标准百分号编码是 %20；而 HTML 表单以 application/x-www-form-urlencoded 提交时，空格会被写成 +，加号本身则编码成 %2B。JavaScript 的 encodeURIComponent 只输出 %20，不会生成 +；decodeURIComponent 也不会把 + 还原成空格。如果你解码表单数据或某些搜索链接时发现空格变成了加号，勾选“空格与 + 互转”即可。反过来，如果参数值本身含有加号（如手机号 +86），必须编码为 %2B，否则服务端会解析成空格。
使用时的两个常见坑：一是重复编码，已经编码过的 %E5 再编码一次会变成 %25E5，解码一次不够；二是在浏览器地址栏复制的网址通常已被自动编码，粘贴到聊天软件时又被显示成中文，两种形式在服务器看来是同一个地址。