【js编码转换】在JavaScript开发过程中，经常会遇到字符编码转换的问题。例如，将字符串从一种编码格式（如UTF-8）转换为另一种编码格式（如GBK、Base64等）。不同的编码方式适用于不同的场景，理解它们的原理和使用方法对于前端开发者来说非常重要。
以下是对常见JS编码转换方式的总结与对比：
一、常见编码类型及用途
| 编码类型 | 说明 | 常见应用场景 |
| UTF-8 | 一种可变长度的Unicode编码，兼容ASCII | 网络传输、网页内容、国际化支持 |
| GBK | 中文编码标准，包含简体中文和繁体中文 | 国内网站、旧系统数据处理 |
| Base64 | 将二进制数据转换为ASCII字符串 | 图片嵌入、数据加密、跨平台传输 |
| URL编码 | 对URL中的特殊字符进行转义 | 表单提交、URL参数传递 |
| HTML实体 | 将特殊字符转换为HTML实体 | 防止XSS攻击、安全显示字符 |
二、JS中常用编码转换方法
1. UTF-8 转换
在JavaScript中，可以使用 `TextEncoder` 和 `TextDecoder` 进行UTF-8编码与解码。
```javascript
// UTF-8 编码
const encoder = new TextEncoder();
const encoded = encoder.encode("你好，世界");
console.log(encoded); // Uint8Array [ 228, 189, 136, 229, 165, 189, 190, 187, 130, 229, 188, 160
// UTF-8 解码
const decoder = new TextDecoder();
const decoded = decoder.decode(encoded);
console.log(decoded); // "你好，世界"
```
2. GBK 编码转换
JavaScript原生不支持GBK编码，需要借助第三方库（如 `iconv-lite`）实现。
```javascript
const iconv = require('iconv-lite');
// GBK 编码
const gbkEncoded = iconv.encode("你好，世界", 'gbk');
console.log(gbkEncoded); //
// GBK 解码
const gbkDecoded = iconv.decode(gbkEncoded, 'gbk');
console.log(gbkDecoded); // "你好，世界"
```
3. Base64 编码转换
使用 `btoa()` 和 `atob()` 实现Base64编码与解码。
```javascript
// Base64 编码
const base64 = btoa("你好，世界");
console.log(base64); // "5bCP6L+V5Y2w"
// Base64 解码
const original = atob("5bCP6L+V5Y2w");
console.log(original); // "你好，世界"
```
4. URL编码转换
使用 `encodeURIComponent()` 和 `decodeURIComponent()` 处理URL编码。
```javascript
// URL 编码
const encodedUrl = encodeURIComponent("你好？");
console.log(encodedUrl); // "%E4%BD%A0%E5%A5%BD%EF%BC%9F"
// URL 解码
const decodedUrl = decodeURIComponent("%E4%BD%A0%E5%A5%BD%EF%BC%9F");
console.log(decodedUrl); // "你好？"
```
5. HTML实体转换
可以使用 `DOMParser` 或自定义函数实现HTML实体转换。
```javascript
function htmlEncode(str) {
return str.replace(/&/g, '&')
.replace(/
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/'/g, '&39;');
}
function htmlDecode(str) {
return str.replace(/&/g, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/&39;/g, "'");
}
console.log(htmlEncode("Hello <script>test</script>"));
// 输出: "Hello <script>test</script>"
```
三、总结
在实际开发中，根据需求选择合适的编码方式至关重要。UTF-8是现代Web开发的标准编码；GBK用于国内项目；Base64常用于二进制数据的传输；URL编码用于确保URL安全性；HTML实体则用于防止恶意脚本注入。
通过合理使用这些编码转换方法，可以有效提升代码的兼容性、安全性和性能。同时，注意避免使用过时或不推荐的编码方式，以保证程序的稳定运行。
