当前位置：首页 > JavaScript

js实现编码

2026-03-14 10:14:33JavaScript

JavaScript 实现编码的方法

JavaScript 提供了多种编码方式，可以根据不同的需求选择合适的编码方法。以下是常见的几种编码实现方式：

URL 编码

使用 encodeURIComponent 和 encodeURI 对 URL 进行编码，避免特殊字符导致的 URL 解析问题。

const url = 'https://example.com/?name=张三&age=20';
const encodedUrl = encodeURIComponent(url);
console.log(encodedUrl); // 输出编码后的 URL

encodeURI 用于编码整个 URL，而 encodeURIComponent 用于编码 URL 的某一部分（如查询参数）。

js实现编码

Base64 编码

使用 btoa 和 atob 进行 Base64 编码和解码。

const text = 'Hello, World!';
const encodedText = btoa(text); // Base64 编码
console.log(encodedText);

const decodedText = atob(encodedText); // Base64 解码
console.log(decodedText);

HTML 实体编码

使用 textContent 或 innerText 自动处理 HTML 实体编码，避免 XSS 攻击。

js实现编码

const element = document.createElement('div');
element.textContent = '<script>alert("XSS")</script>';
console.log(element.innerHTML); // 输出编码后的 HTML 实体

自定义编码函数

可以手动实现特定需求的编码逻辑，例如替换特定字符。

function customEncode(str) {
    return str.replace(/[&<>"']/g, function(match) {
        return {
            '&': '&amp;',
            '<': '&lt;',
            '>': '&gt;',
            '"': '&quot;',
            "'": '&#39;'
        }[match];
    });
}

const encoded = customEncode('<div>Hello</div>');
console.log(encoded); // 输出 &lt;div&gt;Hello&lt;/div&gt;

使用 TextEncoder 进行 UTF-8 编码

现代浏览器支持 TextEncoder 和 TextDecoder 进行 UTF-8 编码和解码。

const encoder = new TextEncoder();
const encoded = encoder.encode('你好'); // 返回 Uint8Array
console.log(encoded);

const decoder = new TextDecoder();
const decoded = decoder.decode(encoded);
console.log(decoded); // 输出 "你好"