JS ArrayBuffer
2018-06-02 本文已影响0人
田文健
在写JS时,主要用到的数据类型以 Number,String, bool为主,这几种已经能满足常规前端编程的需要了,但在处理一些二进制数据时,这些类型就无能为力。JS提供了ArrayBuffer 来处理二进制数据。ArrayBuffer
对象用来表示通用的、固定长度的原始二进制数据缓冲区。ArrayBuffer
不能直接操作,而是要通过类型数组对象或/DataView( "DataView 视图是一个可以从 ArrayBuffer 对象中读写多种数值类型的底层接口,在读写时不用考虑平台字节序问题。") 对象来操作,它们会将缓冲区中的数据表示为特定的格式,并通过这些格式来读写缓冲区的内容。
下面介绍几种读写数据的方式:
1.字符串转为ArrayBuffer
// 字符串转为ArrayBuffer对象,参数为字符串
const str2ab = function(str) {
var buf = new ArrayBuffer(str.length * 2); // 每个字符占用2个字节
var bufView = new Uint16Array(buf);
for (var i = 0, strLen = str.length; i < strLen; i++) {
bufView[i] = str.charCodeAt(i);
}
return buf;
}
2.ArrayBuffer转字符串
// ArrayBuffer转为字符串,参数为ArrayBuffer对象, 字符串编码为一个字节
const ab2str = function (buf) {
return String.fromCharCode.apply(null, new Uint8Array(buf)); //apply将数组参数传给方法作为分开的实参,见apply的用法
}
// ArrayBuffer转为字符串,参数为ArrayBuffer对象字符串编码为js默认编码
const ab2strU16 = function (buf) {
return String.fromCharCode.apply(null, new Uint16Array(buf));
}
注意:如果是UTF8这种变长编码,就会麻烦一些,当然网络上也有很多方法。
Stack Overflow上的方法;
function uintToString(uintArray) {
var encodedString = String.fromCharCode.apply(null, uintArray),
decodedString = decodeURIComponent(escape(encodedString));
return decodedString;
}
3.ArrayBuffer与十六进制的互相转换
/**
* 十六进制转 bytearray
*/
var hex2ab = function(hex){
var typedArray = new Uint8Array(hex.match(/[\da-f]{2}/gi).map(function (h) {
return parseInt(h, 16)
}))
var buffer = typedArray.buffer
return buffer
}
// ArrayBuffer转16进度字符串示例
const ab2hex = function (buffer) {
var hexArr = Array.prototype.map.call(
new Uint8Array(buffer),
function (bit) {
return ('00' + bit.toString(16)).slice(-2)
}
)
return hexArr.join('');
}