Skip to content

Commit c3a8c93

Browse files
authored
Resolve conflicts + Update article
1 parent e7dee39 commit c3a8c93

File tree

1 file changed

+11
-15
lines changed

1 file changed

+11
-15
lines changed

4-binary/01-arraybuffer-binary-arrays/article.md

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ Although, there's a bit of confusion, because there are many classes. To name a
99

1010
Binary data in JavaScript is implemented in a non-standard way, compared to other languages. But when we sort things out, everything becomes fairly simple.
1111

12-
**The basic binary object is `ArrayBuffer` -- a reference to a fixed-length contiguos memory area.**
12+
**The basic binary object is `ArrayBuffer` -- a reference to a fixed-length contiguous memory area.**
1313

1414
We create it like this:
1515
```js run
@@ -102,17 +102,17 @@ new TypedArray();
102102
*!*
103103
let arr = new Uint8Array([0, 1, 2, 3]);
104104
*/!*
105-
alert( arr.length ); // 4
106-
alert( arr[1] ); // 1
105+
alert( arr.length ); // 4, created binary array of the same length
106+
alert( arr[1] ); // 1, filled with 4 bytes (unsigned 8-bit integers) with given values
107107
```
108-
3. If another `TypedArray` is supplied, it does the same: creates a typed array of the same length and copies values. Values are converted to the new type in the process.
108+
3. If another `TypedArray` is supplied, it does the same: creates a typed array of the same length and copies values. Values are converted to the new type in the process, if needed.
109109
```js run
110110
let arr16 = new Uint16Array([1, 1000]);
111111
*!*
112112
let arr8 = new Uint8Array(arr16);
113113
*/!*
114114
alert( arr8[0] ); // 1
115-
alert( arr8[1] ); // 232 (tried to copy 1000, but can't fit 1000 into 8 bits)
115+
alert( arr8[1] ); // 232, tried to copy 1000, but can't fit 1000 into 8 bits (explanations below)
116116
```
117117

118118
4. For a numeric argument `length` -- creates the typed array to contain that many elements. Its byte length will be `length` multiplied by the number of bytes in a single item `TypedArray.BYTES_PER_ELEMENT`:
@@ -212,7 +212,7 @@ These methods allow us to copy typed arrays, mix them, create new arrays from ex
212212
[DataView](mdn:/JavaScript/Reference/Global_Objects/DataView) is a special super-flexible "untyped" view over `ArrayBuffer`. It allows to access the data on any offset in any format.
213213

214214
- For typed arrays, the constructor dictates what the format is. The whole array is supposed to be uniform. The i-th number is `arr[i]`.
215-
- With `DataView` we access the data with methods like `.getUint8(i)` or `.gteUint16(i)`. We choose the format at method call time instead of the construction time.
215+
- With `DataView` we access the data with methods like `.getUint8(i)` or `.getUint16(i)`. We choose the format at method call time instead of the construction time.
216216

217217
The syntax:
218218

@@ -227,24 +227,21 @@ new DataView(buffer, [byteOffset], [byteLength])
227227
For instance, here we extract numbers in different formats from the same buffer:
228228

229229
```js run
230+
// binary array of 4 bytes, all have the maximal value 255
230231
let buffer = new Uint8Array([255, 255, 255, 255]).buffer;
231232

232233
let dataView = new DataView(buffer);
233234

234235
// get 8-bit number at offset 0
235236
alert( dataView.getUint8(0) ); // 255
236237

237-
<<<<<<< HEAD
238-
// now get 16-bit number at offset 0, that's 2 bytes, both with max value
239-
=======
240238
// now get 16-bit number at offset 0, it consists of 2 bytes, together interpreted as 65535
241-
>>>>>>> e074a5f825a3d10b0c1e5e82561162f75516d7e3
242239
alert( dataView.getUint16(0) ); // 65535 (biggest 16-bit unsigned int)
243240

244241
// get 32-bit number at offset 0
245242
alert( dataView.getUint32(0) ); // 4294967295 (biggest 32-bit unsigned int)
246243

247-
dataView.setUint32(0, 0); // set 4-byte number to zero
244+
dataView.setUint32(0, 0); // set 4-byte number to zero, thus setting all bytes to 0
248245
```
249246

250247
`DataView` is great when we store mixed-format data in the same buffer. For example, when we store a sequence of pairs (16-bit integer, 32-bit float), `DataView` allows to access them easily.
@@ -256,20 +253,19 @@ dataView.setUint32(0, 0); // set 4-byte number to zero
256253
To do almost any operation on `ArrayBuffer`, we need a view.
257254

258255
- It can be a `TypedArray`:
259-
- `Uint8Array`, `Uint16Array`, `Uint32Array` -- for integer numbers of 8, 16 and 32 bits.
256+
- `Uint8Array`, `Uint16Array`, `Uint32Array` -- for unsigned integers of 8, 16, and 32 bits.
260257
- `Uint8ClampedArray` -- for 8-bit integers, "clamps" them on assignment.
261258
- `Int8Array`, `Int16Array`, `Int32Array` -- for signed integer numbers (can be negative).
262259
- `Float32Array`, `Float64Array` -- for signed floating-point numbers of 32 and 64 bits.
263260
- Or a `DataView` -- the view that uses methods to specify a format, e.g. `getUint8(offset)`.
264261

265262
In most cases we create and operate directly on typed arrays, leaving `ArrayBuffer` under cover, as a "common discriminator". We can access it as `.buffer` and make another view if needed.
266263

267-
There are also two additional terms:
264+
There are also two additional terms, that are used in descriptions of methods that operate on binary data:
268265
- `ArrayBufferView` is an umbrella term for all these kinds of views.
269266
- `BufferSource` is an umbrella term for `ArrayBuffer` or `ArrayBufferView`.
270267

271-
These are used in descriptions of methods that operate on binary data. `BufferSource` is one of the most common teerms, as it means "any kind of binary data" -- an `ArrayBuffer` or a view over it.
272-
268+
We'll see these terms in the next chapters. `BufferSource` is one of the most common terms, as it means "any kind of binary data" -- an `ArrayBuffer` or a view over it.
273269

274270
Here's a cheatsheet:
275271

0 commit comments

Comments
 (0)