Uint8ClampedArray in Javascript

The Uint8ClampedArray typed array represents an array of 8-bit unsigned integers clamped to 0-255. If the specified a value is not in the range of [0, 255], it sets 0 or 255. if the specified value is non-integer, the nearest integer will be set. It initialize with 0 and elements in the array can be accessed either by using instance methods or using standard array index syntax (bracket notation). If control over byte order is needed, use DataView instead.

Uint8ClampedArray constructor

 1 new Uint8ClampedArray()
 2 new Uint8ClampedArray(<length>)
 3 new Uint8ClampedArray(<typedArray>)
 4 new Uint8ClampedArray(<object>)
 5 
 6 new Uint8ClampedArray(<buffer>)
 7 new Uint8ClampedArray(<buffer>, <byteOffset>)
 8 new Uint8ClampedArray(<buffer>, <byteOffset>, <length>)

The Uint8ClampedArray is derived class from TypedArray which inherits constructor, properties and methods from the parent class.

⇢ TypedArray in Javascript

Uint8ClampedArray

 1 // From a length
 2 const ia = new Uint8ClampedArray(2);
 3 ia[0] = 100;
 4 console.log(ia[0]); // prints 100
 5 console.log(ia.length); // prints 2
 6 console.log(ia.BYTES_PER_ELEMENT); // prints 1
 7 
 8 // from an array
 9 const ia1 = new Uint8ClampedArray([10, 20]);
 10 console.log(ia1[1]); // prints 10
 11 
 12 // from another Uint8ClampedArray
 13 const ia2 = new Uint8ClampedArray(ia1);
 14 console.log(ia2[0]); // prints 10
 15 
 16 // from an ArrayBuffer
 17 const buffer = new ArrayBuffer(8);
 18 const ia3 = new Uint8ClampedArray(buffer, 1, 4);
 19 console.log(ia3.byteOffset); // prints 1
 20 
 21 // from an iterable
 22 const iterable = (function* () {
 23   yield* [10, 20, 30];
 24 })();
 25 const ia4 = new Uint8ClampedArray(iterable);
 26 console.log(ia4); // prints Int8Array [10, 20, 30]

Create array by specifying a length

 1 // From a length
 2 const ia = new Uint8ClampedArray(2);
 3 ia[0] = 100;
 4 
 5 // access element
 6 let ele = ia[0];
 7 console.log("Element value :", ele);
 8 
 9 // length of array
 10 console.log("A length of array is :", ia.length);
 11 console.log("An byte per element :", ia.BYTES_PER_ELEMENT);

In the above example, an array created using constructor method by specifying a length 2. A value assigned to at index position 0, an element is access by specifying a index position. A length and bytes allocated per element is access using properties length and BYTES_PER_ELEMENT.

Output

 1 Element value : 100
 2 A length of array is : 2
 3 An byte per element : 1

Create array by specifying an array

 1 // From a length
 2 const ia = new Uint8ClampedArray([10, 20]);
 3 
 4 // access element
 5 let ele = ia[0];
 6 console.log("Element value :", ele);
 7 
 8 // length of array
 9 console.log("A length of array is :", ia.length);
 10 console.log("An byte per element :", ia.BYTES_PER_ELEMENT);

In the above example, an array created by specifying an array that includes two elements. A value assigned to at index position 0, an element is access by specifying a index position. A length and bytes allocated per element is access using properties length and BYTES_PER_ELEMENT.

Output

 1 Element value : 10
 2 A length of array is : 2
 3 An byte per element : 1

Create array by specifying a buffer

 1 // from an ArrayBuffer
 2 const buffer = new ArrayBuffer(8);
 3 const ia = new Uint8ClampedArray(buffer, 2, 3);
 4 
 5 // access element
 6 let ele = ia[0];
 7 console.log("Element value :", ele);
 8 
 9 console.log("An array starts from offset :", ia.byteOffset);
 10 // length of array
 11 console.log("A length of array is :", ia.length);
 12 console.log("An byte per element :", ia.BYTES_PER_ELEMENT);

In the above example, an array created by specifying a buffer, offset and length of allocated bytes. An array created from byte 2 till 3 elements. A value at index position 0 accessed by specifying a index position. A property byteOffset specifies a starting position of buffer allocated to an array. A length and bytes allocated per element is access using properties length and BYTES_PER_ELEMENT.

Output

 1 Element value : 0
 2 An array starts from offset : 2
 3 A length of array is : 3
 4 An byte per element : 1

Create array from iterable

 1 // from an iterable
 2 const iterable = (function* () {
 3   yield* [11, 21, 31];
 4 })();
 5 
 6 const ia = new Uint8ClampedArray(iterable);
 7 console.log(ia);

In the above example, a generator function define that yields three values. A iterable specified in the constructor that creates an array with three elements and print.

Output

 1 Uint8ClampedArray(3) [ 11, 21, 31 ]

Disclaimer

About us