javascript读写二进制

刺骨的言语ヽ痛彻心扉 2022-06-02 05:12 177阅读 0赞

javascript里有两个内置对象，一个是ArrayBuffer；一个是DataView。

读写二进制数据都需要使用这两个对象。

ArrayBuffer：

ArrayBuffer 对象用来表示通用的、固定长度的原始二进制数据缓冲区。ArrayBuffer 不能直接操作，而是要通过类型数组对象或 DataView 对象来操作，它们会将缓冲区中的数据表示为特定的格式，并通过这些格式来读写缓冲区的内容。

DataView：

DataView视图是一个可以从ArrayBuffer对象中读写多种数值类型的底层接口，在读写时不用考虑平台字节序问题。

以上这两个定义是从api那里抄来的。

一般刚开始接触这两个对象的人都不能太明白。

那就用实例说话：

var str = "test!!"
    
    var byteArr = new ArrayBuffer(4 + 2 + 4 + 2 + str.length);   //参数是ArrayBuffer的字节大小。
    var dv = new DataView(byteArr);   //DataView有三个参数，后两个可以缺省；每一个要是ArrayBuffer对象或SharedArrayBuffer对象
    
    //下面的DataView的setUint*和getUint*方法自己去查阅。
    
    dv.setUint32(0, 234, false);   
    dv.setUint16(4, 123, false);
    dv.setFloat32(6, 55.66, false);
    
    dv.setUint16(10, str.length, false);   //这个Uint16是表示字符串的字节大小，在写入字符串的时候一定要先写一个Uint16
    for(var i = 0; i < str.length; i++) {
      dv.setUint8(12 + i, str[i].charCodeAt(0));
    }
    
    
    
    
    var dataView = new DataView(byteArr);
    var int = dataView.getInt32(0, false);
    var short = dataView.getInt16(4, false);
    var float = dataView.getFloat32(6, false);
    var len = dataView.getInt16(10, false);
    
    var str2 = "";
    for(var i = 0; i < len; i++) {
      str2 = str2 + String.fromCharCode(dv.getUint8(12 + i));
    }
    
    console.log(int, short, float, len);
    console.log("str2", str2);

注意：每个DataView的setUint\*和getUint\*方法的第一个参数都表示读写这一个数据时的offset（偏移量）。

在与服务器交互的时候，dv对象是传给服务器的；dataView对象是从服务器接收回来的。

如果还需要加上protobuf的话，需要看protobuf的一些接口，但是也是要运用到ArrayBuffer对象和DataView对象的。

[ArrayBuffer API][]

[DataView API][]

[ArrayBuffer API]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer
[DataView API]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView