js 字符串与ArrayBuffer互转

1.情景展示

在js当中，如何将字符串转成ArrayBuffer？

如何将ArrayBuffer转成字符串？

2.ArrayBuffer转字符串

/**
 *将类型化数组转字符串
 Int8Array：8位有符号整数，长度1个字节。
 Uint8Array：8位无符号整数，长度1个字节。
 Int16Array：16位有符号整数，长度2个字节。
 Uint16Array：16位无符号整数，长度2个字节。
 Int32Array：32位有符号整数，长度4个字节。
 Uint32Array：32位无符号整数，长度4个字节。
 Float32Array：32位浮点数，长度4个字节。
 Float64Array：64位浮点数，长度8个字节。
 *我们可以根据自己的实际情况选用对应的数组
 */
function ab2str(arrayBuffer) {
    return String.fromCharCode.apply(null, new Uint8Array(arrayBuffer));
}

 

3.字符串转ArrayBuffer

/**
 * 将字符串转类型化数组
 */
function str2ab(str) {
    var buf = new ArrayBuffer(str.length * 2); // 每个字符占用2个字节
    var bufView = new Uint8Array(buf);// Uint8Array可换成其它
    for (var i=0, strLen=str.length; i<strLen; i++) {
         bufView[i] = str.charCodeAt(i);
    }
    return buf;
}

4.拓展

ArrayBuffer 类型化数组，类型化数组是JavaScript操作二进制数据的一个接口；

最初为了满足JavaScript与显卡之间大量的、实时的数据交换，它们之间的数据通信必须是二进制的，而不能是传统的文本格式的背景下诞生的；

类型化数组是建立在ArrayBuffer对象的基础上的。它的作用是，分配一段可以存放数据的连续内存区域；

ArrayBuffer对象有一个slice方法，允许将内存区域的一部分，拷贝生成一个新的ArrayBuffer对象；

除了slice方法，ArrayBuffer对象不提供任何直接读写内存的方法，只允许在其上方建立视图，然后通过视图读写。

ArrayBuffer作为内存区域，可以存放多种类型的数据。不同数据有不同的存储方式，这就叫做“视图”。目前，JavaScript提供以下类型的视图：

Int8Array：8位有符号整数，长度1个字节。  表示使用 8 bits 表示一个有符号整型 (-128 ~ 127)
Uint8Array：8位无符号整数，长度1个字节。  把 ArrayBuffer 的每个 byte(8-bit) 当作一个单独的无符号整型数字 (0 - 255)
Int16Array：16位有符号整数，长度2个字节。
Uint16Array：16位无符号整数，长度2个字节。
Int32Array：32位有符号整数，长度4个字节。
Uint32Array：32位无符号整数，长度4个字节。
Float32Array：32位浮点数，长度4个字节。  表示使用 32 bits 表示一个浮点数
Float64Array：64位浮点数，长度8个字节。

Unit7ClampedArray：在 0 ～ 255 范围内和 Unit8Array 是一样的，对超出范围的处理有所不同，和图像处理相关（一般像素范围也是 0 ～ 255）

 

写在最后

　　哪位大佬如若发现文章存在纰漏之处或需要补充更多内容，欢迎留言！！！

 相关推荐：

• 个人主页
• JavaScript 之 ArrayBuffer