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

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

## 语法

    new DataView(buffer [, byteOffset [, byteLength]])

### 参数

`buffer`
  一个 `ArrayBuffer` 或 `SharedArrayBuffer` 对象，`DataView` 对象的数据源。
`byteOffset` 可选
  此 `DataView` 对象的第一个字节在 buffer 中的偏移。如果不指定则默认从第一个字节开始。
`byteLength` 可选
  此 DataView 对象的字节长度。如果不指定则默认与 buffer 的长度相同。

### 返回值

一个 DataView 对象用来呈现指定的缓存区数据。

你可以认为返回的对象是一个二进制的解释器——它知道在读写的时候如何正确的转化字节码。这意味着会在字节水平处理整数和浮点转化、字节顺序等其他详情。

### 异常

``RangeError``
  如果由偏移（byteOffset）和字节长度（byteLength）计算得到的结束位置超出了 buffer 的长度，抛出此异常。

  例如，如果缓冲区是16个字节的长度。`byteOffset`是8，`byteLength` 是10，错误就会抛出，因为结果试图去呈现超出的2个字节。

## 描述

### Endianness（字节序）

需要多个字节来表示的数值，在存储时其字节在内存中的相对顺序依据平台架构的不同而不同，参照 Endianness。而使用 DataView 的访问函数时不需要考虑平台架构中所使用的是哪种字节序。

    var littleEndian = (function() {
      var buffer = new ArrayBuffer(2);
      new DataView(buffer).setInt16(0, 256, true /* 设置值时，使用小端字节序 */);
      // Int16Array 使用系统字节序（由此可以判断系统字节序是否为小端字节序）
      return new Int16Array(buffer)[0] === 256;
    })();
    console.log(littleEndian); // 返回 true 或 false

### 64-bit Integer Values（64位整数）

因为JavaScript目前不包括对64位整数值的标准支持，所以`DataView`不提供本机64位操作。作为解决方法，您可以实现自己的`getUint64()`函数，以获得精度高达`Number.MAX_SAFE_INTEGER`的值，可以满足某些特定情况的需求。

    function getUint64(dataview, byteOffset, littleEndian) {
      // split 64-bit number into two 32-bit (4-byte) parts
      const left =  dataview.getUint32(byteOffset, littleEndian);
      const right = dataview.getUint32(byteOffset+4, littleEndian);

      // combine the two 32-bit values
      const combined = littleEndian? left + 2**32*right : 2**32*left + right;

      if (!Number.isSafeInteger(combined))
        console.warn(combined, 'exceeds MAX_SAFE_INTEGER. Precision may be lost');

      return combined;
    }

或者，如果需要填满64位，可以创建一个`BigInt`。

    function getUint64BigInt(dataview, byteOffset, littleEndian) {
      // split 64-bit number into two 32-bit (4-byte) parts
      const left = dataview.getUint32(byteOffset, littleEndian);
      const right = dataview.getUint32(byteOffset + 4, littleEndian);

      // combine the two 32-bit values as their hex string representations
      const combined = littleEndian ?
        right.toString(16) + left.toString(16).padStart(8, '0') :
        left.toString(16) + right.toString(16).padStart(8, '0');

      return BigInt(`0x${combined}`);
    }

## 属性

所有 `DataView` 实例都继承自 `DataView.prototype`并且允许向 DataView 对象中添加额外属性。

`DataView.prototype.constructor`
  指定用来生成原型的构造函数.初始化值是标准内置DataView构造器.
`DataView.prototype.buffer` 只读
  被视图引入的`ArrayBuffer`.创建实例的时候已固化因此是只读的.
`DataView.prototype.byteLength` 只读
  从 `ArrayBuffer`中读取的字节长度. 创建实例的时候已固化因此是只读的.
`DataView.prototype.byteOffset` 只读
  从 `ArrayBuffer`读取时的偏移字节长度. 创建实例的时候已固化因此是只读的.

## 方法

### 读

`DataView.prototype.getInt8()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个8-bit数(一个字节).
`DataView.prototype.getUint8()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个8-bit数(无符号字节).
`DataView.prototype.getInt16()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个16-bit数(短整型).
`DataView.prototype.getUint16()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个16-bit数(无符号短整型).
`DataView.prototype.getInt32()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个32-bit数(长整型).
`DataView.prototype.getUint32()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个32-bit数(无符号长整型).
`DataView.prototype.getFloat32()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个32-bit数(浮点型).
`DataView.prototype.getFloat64()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处获取一个64-bit数(双精度浮点型).

### 写

`DataView.prototype.setInt8()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个8-bit数(一个字节).
`DataView.prototype.setUint8()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个8-bit数(无符号字节).
`DataView.prototype.setInt16()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个16-bit数(短整型).
`DataView.prototype.setUint16()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个16-bit数(无符号短整型).
`DataView.prototype.setInt32()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(长整型).
`DataView.prototype.setUint32()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(无符号长整型).
`DataView.prototype.setFloat32()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(浮点型).
`DataView.prototype.setFloat64()`
  `从` `DataView`起始位置以byte为计数的指定偏移量(byteOffset)处储存一个64-bit数(双精度浮点型).

## 示例

    var buffer = new ArrayBuffer(16);
    var dv = new DataView(buffer, 0);

    dv.setInt16(1, 42);
    dv.getInt16(1); //42

## 规范

规范名称 | 状态 | 注释
--- | --- | ---
Typed Array Specification | Obsolete | 已被 ECMAScript 6 取代
ECMAScript 2015 (6th Edition, ECMA-262) DataView | Standard | ECMA 标准中的初始版本
ECMAScript Latest Draft (ECMA-262) DataView | Draft |

## 浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

| Desktop | Mobile | Server
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | Safari on iOS | Samsung Internet | Node.js
`DataView` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`DataView()` without `new` throws | Chrome Full support Yes | Edge Full support 13 | Firefox Full support 40 | IE No support No | Opera Full support Yes | Safari ? | WebView Android ? | Chrome Android ? | Edge Mobile ? | Firefox Android Full support 40 | Opera Android ? | Safari iOS ? | Samsung Internet Android ? | nodejs Full support 0.12
`SharedArrayBuffer` accepted as buffer | Chrome Full support 60 | Edge No support No | Firefox Full support 55 | IE ? | Opera ? | Safari ? | WebView Android ? | Chrome Android ? | Edge Mobile ? | Firefox Android Full support 55 | Opera Android ? | Safari iOS ? | Samsung Internet Android ? | nodejs ?
`buffer` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`byteLength` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`byteOffset` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getFloat32` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getFloat64` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getInt16` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getInt32` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getInt8` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getUint16` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getUint32` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`getUint8` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setFloat32` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setFloat64` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setInt16` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setInt32` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setInt8` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setUint16` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setUint32` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`setUint8` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes
`prototype` | Chrome Full support 9 | Edge Full support 12 | Firefox Full support 15 | IE Full support 10 | Opera Full support 12.1 | Safari Full support 5.1 | WebView Android Full support 4 | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 15 | Opera Android Full support 12 | Safari iOS Full support 4.2 | Samsung Internet Android Full support Yes | nodejs Full support Yes

### Legend

Full support
  Full support
No support
  No support
Compatibility unknown
  Compatibility unknown

## 兼容性提示

从 FireFox 40 开始， DataView 对象需要通过 `new` 操作符来构造。如果不使用 `new` 而是直接将 `DataView()` 作为函数调用的话会抛出 `TypeError` 异常。

    var dv = DataView(buffer, 0);
    // 抛出异常，错误信息为：禁止不用new直接调用DataView的构造函数。
    // TypeError: calling a builtin DataView constructor without new is forbidden

    var dv = new DataView(buffer, 0);

## 相关链接

- jDataView：DataView 的垫片（polyfill）库，使其能够用于所有浏览器及 Node.js 环境。同时，该库还对 DataView 进行了一些扩展。
- `ArrayBuffer`
- `SharedArrayBuffer`