在 JavaScript 中，btoa 和 atob 是两个全局函数，用于编码和解码 Base64 字符串。它们在客户端开发中非常有用，尤其是在处理二进制数据时，例如在 Web 应用中传输图像、音频文件等。
btoa 函数
btoa 函数的全称是 “binary to ASCII”，其作用是将字符串（以 UTF-16 格式表示的字符）编码为 Base64 字符串。此函数的参数是一个字符串，返回一个 Base64 编码的字符串。
使用示例
以下是 btoa 的基本用法示例：
// 定义一个需要编码的字符串
const originalString = "Hello, World!";
console.log("原始字符串:", originalString);
// 使用 btoa 进行编码
const encodedString = btoa(originalString);
console.log("Base64 编码后的字符串:", encodedString);
运行上述代码，输出结果如下：
原始字符串: Hello, World!
Base64 编码后的字符串: SGVsbG8sIFdvcmxkIQ==
atob 函数
与 btoa 相对应，atob 函数的全称是 “ASCII to binary”，其作用是将 Base64 编码的字符串解码回原始字符串。此函数的参数是一个 Base64 编码的字符串，返回解码后的 UTF-16 字符串。
使用示例
以下是 atob 的基本用法示例：
// 定义一个 Base64 编码的字符串
const encodedString = "SGVsbG8sIFdvcmxkIQ==";
console.log("Base64 编码的字符串:", encodedString);
// 使用 atob 进行解码
const decodedString = atob(encodedString);
console.log("解码后的字符串:", decodedString);
运行上述代码，输出结果如下：
Base64 编码的字符串: SGVsbG8sIFdvcmxkIQ==
解码后的字符串: Hello, World!
注意事项
- 字符集限制：
btoa和atob只支持以 Latin1 字符（ISO-8859-1）为基础的字符集。在处理 UTF-8 编码的字符时，可能会出现问题。因此，如果需要编码包含非 Latin1 字符的字符串，可以先将其转换为 UTF-8 格式。
以下是处理 UTF-8 字符串的示例：
// 将 UTF-8 字符串编码为 Base64
function encodeUtf8(str) {
return btoa(unescape(encodeURIComponent(str)));
}
// 将 Base64 编码的字符串解码为 UTF-8
function decodeUtf8(str) {
return decodeURIComponent(escape(atob(str)));
}
const originalString = "你好，世界！";
const encodedString = encodeUtf8(originalString);
console.log("UTF-8 编码后的 Base64 字符串:", encodedString);
const decodedString = decodeUtf8(encodedString);
console.log("解码后的字符串:", decodedString);
运行上述代码，输出如下：
UTF-8 编码后的 Base64 字符串: 5LiA5rKp5Yiw55Sx5LqO
解码后的字符串: 你好，世界！
结论
在 JavaScript 中，btoa 和 atob 函数提供了简单的方法来处理 Base64 编码和解码。虽然它们在处理 ASCII 字符串时非常方便，但在处理 UTF-8 字符时需要额外注意字符集的问题。通过将字符串转换为 UTF-8 编码，我们可以确保这两个函数能够正确处理各种字符。使用这些函数能够极大地方便我们在 Web 应用中处理数据的传输与存储。
