différents types d'array - javascript

publicité
D i f f é r e n t s T y p e s d ' a r r ays
( objets semblables aux tableaux )
J AVA S C R I P T (Programmation Internet) V O L . X X I I
Po u r D é b u t a n t
J.B. Dadet DIASOLUKA Luyalu Nzoyifuanga
+243 - 851278216 - 899508675 - 995624714 - 902263541 - 813572818
diasfb@mail2world.com
Qu’est-ce qui se passe quand vous appliquez un « OR binaire » par
exemple au nombre « 3000000000.1 » comme ceci :
3000000000.1 | 0
?
Ça donnera
3000000000.1 | 0 = -1294967296
Vous y comprenez quelque chose ? Le code ci-après vous l’explique très
facilement grâce aux UintXArray, IntXArray, FloatXArray bref ce qui
est convenu d’appeler Typed Array.
Il existe en effet deux types fondamentaux d’Arrays : les Arrays ordinaires
et les ainsi dits « Typed Arrays » qui se rapportent aux nombres typés
dont BigInt et float32 selon le navigateur.
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
LES « TYPED ARRAYS » :
D’abord il faut savoir que « TypedArray » n’est pas un type de données ou
un objet défini, mais une appellation générique.
Les Typed Arrays (Arrays typés) traitent tous leurs éléments constitutifs
comme étant de leur propre type donc d’un même type, contrairement aux
Arrays ordinaires qui peuvent regrouper toute sorte de types. Les deux
groupes principaux d’Arrays typées sont :
I.
Pour les entiers (« int ») :
1. Les Arrays Signées ([Signed] Integer Arrays) dont les éléments
sont traités comme des nombres signés (le bit d’extrême gauche
étant considéré comme étant le flag du signe) : les IntXArray
2. Les Arrays Non Signées (Unsigned Integer Arrays) dont tous les
bits sont considérés comme pondérant le nombre : les UintXArray.
Dans les deux cas ci-dessus, « X » peut avoir l’une des valeurs suivantes :
8, 16, 32.
Dans le deuxième type (Arrays Non Signées [Unsigned Integer Arrays])
existe en outre un Typed Array « Uint8ClampedArray » dont les éléments sont considérés comme étant des « entiers 8bits non signés » (de la
taille d’un octet) et dont la valeur est plafonnée à 255 : toute valeur
d’élément supérieur à 255 est automatiquement ramenée à 255.
Il n’existe pas encore le Int64Array ni le Uint64Array, mais certains
browsers comme le Yandex Version 18.9.1.954 proposent les types BigInt64Array et BigUint64Array, qui n’existent pas dans Firefox Quantum
57.0.
II.
Pour les rationnels (« float ») il existe :
Différents types d’Arrays
- 2/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
« Float32Array » et « Float64Array ».
<script type="text/javascript"> "use strict";
// let bI = BigInt(-1)
// Pour FIREFOX : ReferenceError:
// BigInt is not defined
test.html:6:7
// console.log("BigInt(-1) =",bI);
// let f32 = float32(-1)
// Pour FIREFOX : ReferenceError:
// float32 is not defined
// console.log("float32(-1) =",f32);
console.log(".!. ATTENTION .!.")
let m=3000000000.1
console.log(m+" | 0 = ", m | 0);
(function(){
let b=null;
console.log("Parce que En DOUBLE-WORD (32 bits) : ")
console.log(m +"d = "+ (b=m.toString(2))+"b");
console.log("10110010110100000101111000000000b =");
console.log(
"1011'0010''1101'0000'''0101'1110''0000'0000b = ",
m|0 + "d");
console.log(
"Notez le bit (ou flag) du signe qui est à 1.");
}
)();
console.log("".padEnd(3,"\n"));
console.log("ES10 n'utilise pas encore le 64 bits : ")
m=new Uint8Array ([3000000000.1])
console.log("Uint8Array ([30000000000.1]) = "+m.toString());
m=new Uint16Array ([3000000000.1])
console.log(
"Uint16Array ([30000000000.1]) = "+m.toString());
Différents types d’Arrays
- 3/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
m=new Uint32Array ([3000000000.1])
console.log(
"Uint32Array ([30000000000.1]) = "+m.toString());
console.log("");
m=new Uint8ClampedArray ([3000000000.1])
console.log(
"Uint8ClampedArray ([30000000000.1]) = "+m.toString());
console.log("");
m=new Int8Array ([3000000000.1])
console.log("Int8Array ([30000000000.1]) = "+m.toString());
m=new Int16Array ([3000000000.1])
console.log("Int16Array ([30000000000.1]) = "+m.toString());
m=new Int32Array ([3000000000.1])
console.log("Int32Array ([30000000000.1]) = "+m.toString());
console.log("");
m=new Float32Array ([3000000000.1])
console.log(
"Float32Array ([30000000000.1]) = "+m.toString());
m=new Float64Array ([3000000000.1])
console.log(
"Float64Array ([30000000000.1]) = "+m.toString());
console.log("");
//
m=new BigInt64Array ([3000000000])
// Pour FIREFOX : ReferenceError:
// BigInt64Array is not defined
//
console.log("BigInt64Array ([30000000000]) = "+m.toStrin
g());
//
m=new BigUint64Array ([3000000000])
// Pour FIREFOX :ReferenceError:
// BigUint64Array is not defined
Différents types d’Arrays
- 4/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
//
console.log("BigUint64Array ([30000000000]) = "+m.toStri
ng());
</script>
Exécution avec YANDEX :
test.html:5
BigInt(-1) = -1n
test.html:12 .!. ATTENTION .!.
test.html:14 3000000000.1 | 0 =
-1294967296
test.html:18 Parce que En DOUBLE-WORD (32 bits) :
test.html:19 3000000000.1d =
10110010110100000101111000000000.000110011001100110011b
test.html:20 10110010110100000101111000000000b =
test.html:21
1011'0010''1101'0000'''0101'1110''0000'0000b =
-1294967296
test.html:24 Notez le bit (ou flag) du signe qui est à 1.
test.html:30
test.html:31
test.html:34
test.html:37
test.html:40
test.html:42
test.html:45
test.html:47
test.html:50
test.html:53
test.html:56
test.html:58
test.html:61
test.html:64
ES10 n'utilise pas encore le 64
Uint8Array ([30000000000.1]) =
Uint16Array ([30000000000.1]) =
Uint32Array ([30000000000.1]) =
bits :
0
24064
3000000000
Uint8ClampedArray ([30000000000.1]) = 255
Int8Array ([30000000000.1]) = 0
Int16Array ([30000000000.1]) = 24064
Int32Array ([30000000000.1]) = -1294967296
Float32Array ([30000000000.1]) = 3000000000
Float64Array ([30000000000.1]) = 3000000000.1
Différents types d’Arrays
- 5/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Exécution avec FIREFOX :
.!. ATTENTION .!.
3000000000.1 | 0 =
test.html:12:3
-1294967296
test.html:14:3
Parce que En DOUBLE-WORD (32 bits) :
test.html:18:8
3000000000.1d =
10110010110100000101111000000000.000110011001100110011b
10110010110100000101111000000000b =
1011'0010''1101'0000'''0101'1110''0000'0000b =
-1294967296
Notez le bit (ou flag) du signe qui est à 1.
test.html:21:8
ES10 n'utilise pas encore le 64 bits :
test.html:31:4
Uint8Array ([30000000000.1]) = 0
Uint16Array ([30000000000.1]) = 24064
Uint32Array ([30000000000.1]) = 3000000000
test.html:34:4
test.html:37:4
test.html:40:4
Uint8ClampedArray ([30000000000.1]) = 255
test.html:45:4
Int8Array ([30000000000.1]) = 0
Int16Array ([30000000000.1]) = 24064
Int32Array ([30000000000.1]) = -1294967296
test.html:50:4
test.html:53:4
test.html:56:4
Float32Array ([30000000000.1]) = 3000000000 test.html:61:4
Float64Array ([30000000000.1]) = 3000000000.1
test.html:64:4
Les UintxArray et IntxArray sont des exemples d’Arrays qui signifient en
l’occurrence « Unsigned Integer xBytes Array » ou « Array d’entiers
Non-Signés à x Bytes », et « [Signed] Integer xBytes Array » ou « Array
d’entiers Signés à x Bytes », x étant un nombre parmi ceux-ci : 8 , 16 ou 32.
Différents types d’Arrays
- 6/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
TypedArray objects
Value
Range
Type
JavaScript Tome-XXII
Size
in
byte
s
Description
Web IDL
type
Equivalent C
type
byte
int8_t
Int8Array
-128 to
127
1
8-bit two's
complement
signed
integer
Uint8Array
0 to 255
1
8-bit unsigned
integer
octet
uint8_t
1
8-bit unsigned
integer
(clamped)
octet
uint8_t
short
int16_t
Uint8ClampedAr
ray
0 to 255
Int16Array
-32768 to
32767
2
16-bit
two's
complement
signed
integer
Uint16Array
0 to 65535
2
16-bit
unsigned
integer
unsigned
short
uint16_
t
Int32Array
21474836
48 to
21474836
47
4
32-bit
two's
complement
signed
integer
long
int32_t
Uint32Array
0 to
42949672
4
32-bit
unsigned
unsigned
long
uint32_
t
Différents types d’Arrays
- 7/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
Float32Array
Float64Array
JavaScript Tome-XXII
95
integer
1.2x1038 to
3.4x1038
4
32-bit
IEEE floati
ng point
number ( 7
significant
digits e.g.
1.1234567
)
unrestricted
float
float
8
64-bit
IEEE floating point
number
(16 significant digits
e.g.
1.123...15)
unrestricted
double
double
5.0x10324 to
1.8x10308
Pour connaître la taille en bytes d’une « TypedArray » il suffit d’utiliser la
propriété BYTES_PER_ELEMENT. Cette taille en bytes détermine la valeur du
plus grand nombre stockable dans chacun des éléments de l’Array (signé ou
pas) :
<script type="text/javascript"> "use strict";
console.log("Int8Array.BYTES_PER_ELEMENT ="+
Int8Array.BYTES_PER_ELEMENT);
console.log("Uint8Array.BYTES_PER_ELEMENT ="+
Uint8Array.BYTES_PER_ELEMENT);
console.log("Uint8ClampedArray.BYTES_PER_ELEMENT ="+
Uint8ClampedArray.BYTES_PER_ELEMENT);
console.log("Int16Array.BYTES_PER_ELEMENT ="+
Int16Array.BYTES_PER_ELEMENT);
console.log("Uint16Array.BYTES_PER_ELEMENT ="+
Uint16Array.BYTES_PER_ELEMENT);
console.log("Int32Array.BYTES_PER_ELEMENT ="+
Int32Array.BYTES_PER_ELEMENT);
console.log("Uint32Array.BYTES_PER_ELEMENT ="+
Uint32Array.BYTES_PER_ELEMENT);
console.log("Float32Array.BYTES_PER_ELEMENT ="+
Différents types d’Arrays
- 8/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Float32Array.BYTES_PER_ELEMENT);
console.log("Float64Array.BYTES_PER_ELEMENT ="+
Float64Array.BYTES_PER_ELEMENT);
</script>
Int8Array.BYTES_PER_ELEMENT =1
Uint8Array.BYTES_PER_ELEMENT =1
Uint8ClampedArray.BYTES_PER_ELEMENT =1
Int16Array.BYTES_PER_ELEMENT =2
Uint16Array.BYTES_PER_ELEMENT =2
Int32Array.BYTES_PER_ELEMENT =4
Uint32Array.BYTES_PER_ELEMENT =4
Float32Array.BYTES_PER_ELEMENT =4
Float64Array.BYTES_PER_ELEMENT =8
test.html:2:5
test.html:4:5
test.html:6:5
test.html:8:5
test.html:10:5
test.html:12:5
test.html:14:5
test.html:16:5
test.html:18:5
MAXINT dans chaque taille de registre ou de la variable :
<script type="text/javascript"> "use strict";
console.log(
"1 Byte (BYTE)
: 0xF = 8 Bits) = ",
0xF.toString());
console.log(
"2 Byte (WORD)
: 0xFF = 16 Bits) = ",
0xFF.toString());
console.log(
"4 Byte (DBLE WORD): 0xFFFF = 32 Bits) = ",
0xFFFF.toString());
console.log(
"4 Byte (QUAD WORD): 0xFFFFFFFF = 64 Bits) = ",
0xFFFFFFFF.toString())
</script>
Différents types d’Arrays
- 9/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Différence entre
<script type="text/javascript"> "use strict";
let arr =
new Int32Array([91,68,44,43,61,75,16,89,65,96]);
console.log("arr.BYTES_PER_ELEMENT=" ,
arr.BYTES_PER_ELEMENT);
console.log("arr.length =" ,
arr.length);
console.log("arr.byteLength =" ,
arr.byteLength);
</script>
arr.BYTES_PER_ELEMENT= 4
arr.length = 10
arr.byteLength = 40
test.html:5:3
test.html:8:3
test.html:11:3
Comment accéder individuellement aux éléments d’un Typed Array ?
Tout bonnement, exactement comme avec les Arrays ordinaires.
Mais les Typed Arrays sont des objets itérables, c’est-à-dire qu’on peut
aussi les parcourir avec la méthode « .next » de leur itérateur.
L’itérateur est retourné par les méthodes
« arr.entries() »
pour parcourir toutes les entries (labels ET valeurs) ou
« arr.keys() »
pour parcourir toutes les entries (labels) ou
« arr.values() »
pour parcourir seulement les valeurs (values).
Différents types d’Arrays
- 10/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
<script type="text/javascript"> "use strict";
let t;
var arr = new Int32Array([
58,75,42,32,92,79,35,84,18,11
]);
console.log("Nos « entries » :");
var iterator = arr.entries();
t="";
for(let i=0; i<arr.length; i++){
t += iterator.next().value + " | ";
}
console.log(t);
console.log("".padEnd(25,"="));
console.log("Nos « keys » :");
var iterator = arr.keys();
t="";
for(let i=0; i<arr.length; i++){
t += iterator.next().value + " | ";
}
console.log(t);
console.log("".padEnd(25,"="));
console.log("Nos « values » :");
var iterator = arr.values();
t="";
Différents types d’Arrays
- 11/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
for(let i=0; i<arr.length; i++){
t += iterator.next().value + " | ";
}
console.log(t);
console.log("".padEnd(25,"="));
t="";
for(let k=0,l=arr.length ; k<l ; k++){
t+="arr["+k+"] =" + arr[k] + " | ";
}
console.log(t);
</script>
Nos « entries » :
test.html:9:4
0,58 | 1,75 | 2,42 | 3,32 | 4,92 |
5,79 | 6,35 | 7,84 | 8,18 | 9,11 |
test.html:16:4
========================= test.html:19:1
Nos « keys » :
test.html:22:4
0 | 1 | 2 | 3 | 4 |
5 | 6 | 7 | 8 | 9 |
test.html:29:4
========================= test.html:32:1
Nos « values » :
test.html:35:4
58 | 75 | 42 | 32 | 92 |
79 | 35 | 84 | 18 | 11 |
test.html:42:4
========================= test.html:45:1
arr[0] =58 | arr[1] =75 | arr[2] =42 |
arr[3] =32 | arr[4] =92 | arr[5] =79 |
Différents types d’Arrays
- 12/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
arr[6] =35 | arr[7] =84 | arr[8] =18 |
arr[9] =11 |
JavaScript Tome-XXII
test.html:52:4
Un autre exemple :
<script type="text/javascript"> "use strict";
let it;
const arr = new Int32Array([65,48,91]);
console.log("Notre Array: arr =" ,
arr);
console.log("Notre Array: arr.toString() =" ,
arr.toString());
console.log("\n\nAvec la Boucle FOR :");
for(var i=0 , l=arr.length ; i<l ; i++){
console.log(arr[i]);
}
console.log("Hors liste :",arr[i]);
// Hors liste !
console.log("");
// Itérateurs d'un Typed Array
console.log("arr.entries() =", arr.entries());
console.log(
"arr.keys() =", arr.keys());
console.log( "arr.values() =", arr.values());
console.log("\n\narr.entries()");
it = arr.entries(); // Itérateur lié aux entries.
console.log(it);
for(i=0; i<arr.length; i++){
console.log("it.next().value=" ,
it.next().value);
}
console.log("Hors liste :",it.next().value);
// Hors liste !
Différents types d’Arrays
- 13/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
console.log("\n\narr.keys()");
it = arr.entries(); // Itérateur lié aux entries.
console.log(it);
for(i=0; i<arr.length; i++){
console.log("it.next().value=" ,
it.next().value);
}
console.log("Hors liste :",it.next().value);
// Hors liste !
console.log("\n\narr.values()");
it = arr.values(); // Itérateur lié aux values.
console.log(it);
for(i=0; i<arr.length; i++){
console.log("it.next().value=" ,
it.next().value);
}
console.log("Hors liste :",it.next().value);
// Hors liste !
</script>
Notez la différence entre « arr.values() » qui donne accès à l’itérateur connecté aux « values » des éléments du typed Array, et « it.next().value »
qui donne accès à une « value » précise.
Notez aussi que déclarer une Array « const » n’empêche pas de « jouer »
librement avec tous ses éléments.
Exécution du code ci-dessus :
Notre Array: arr = Int32Array(3) [ 65, 48, 91 ]
test.html:4:4
0: 65
1: 48
2: 91
buffer: ArrayBuffer { byteLength: 12 }
byteLength: 12
<prototype>: ArrayBufferPrototype { … }
byteLength: 12
Différents types d’Arrays
- 14/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
byteOffset: 0
length: 3
<prototype>: Int32ArrayPrototype { … }
byteLength: Getter
constructor: function ArrayBuffer()
isView: function isView()
length: 1
name: "ArrayBuffer"
prototype: ArrayBufferPrototype { … }
byteLength: Getter
constructor: function ArrayBuffer()
slice: function slice()
Symbol(Symbol.toStringTag):
"ArrayBuffer"
<prototype>: Object { … }
__defineGetter__:
function __defineGetter__()
__defineSetter__:
function __defineSetter__()
__lookupGetter__:
function __lookupGetter__()
__lookupSetter__:
function __lookupSetter__()
constructor: function Object()
hasOwnProperty:
function hasOwnProperty()
isPrototypeOf:
function isPrototypeOf()
propertyIsEnumerable:
function propertyIsEnumerable()
toLocaleString:
function toLocaleString()
toSource: function toSource()
toString: function toString()
valueOf: function valueOf()
Symbol(Symbol.species): Getter
<prototype>: function ()
apply: function apply()
arguments: null
bind: function bind()
call: function call()
caller: null
constructor: function Function()
Différents types d’Arrays
- 15/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
length: 0
name: ""
toSource: function toSource()
toString: function toString()
Symbol(Symbol.hasInstance):
function Symbol.hasInstance()
<prototype>: Object { … }
__defineGetter__:
function __defineGetter__()
__defineSetter__:
function __defineSetter__()
__lookupGetter__:
function __lookupGetter__()
__lookupSetter__:
function __lookupSetter__()
constructor: function Object()
hasOwnProperty:
function hasOwnProperty()
isPrototypeOf:
function isPrototypeOf()
propertyIsEnumerable:
function propertyIsEnumerable()
toLocaleString:
function toLocaleString()
toSource: function toSource()
toString: function toString()
valueOf: function valueOf()
slice: function slice()
Symbol(Symbol.toStringTag): "ArrayBuffer"
<prototype>: Object { … }
byteLength: 12
Différents types d’Arrays
- 16/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
byteOffset: 0
length: 3
<prototype>: Int32ArrayPrototype { … }
BYTES_PER_ELEMENT: 4
constructor: function Int32Array()
<prototype>: ??? { … }
buffer: Getter
byteLength: Getter
byteOffset: Getter
constructor: function TypedArray()
copyWithin: function copyWithin()
entries: function entries()
every: function every()
fill: function fill()
filter: function filter()
find: function find()
findIndex: function findIndex()
forEach: function forEach()
includes: function includes()
indexOf: function indexOf()
join: function join()
keys: function keys()
lastIndexOf: function lastIndexOf()
length: Getter
map: function map()
reduce: function reduce()
reduceRight: function reduceRight()
reverse: function reverse()
set: function set()
slice: function slice()
some: function some()
sort: function sort()
subarray: function subarray()
toLocaleString:
function toLocaleString()
toString: function toString()
values: function values()
Symbol(Symbol.iterator):
function values()
Symbol(Symbol.toStringTag): Getter
<prototype>: Object { … }
Différents types d’Arrays
- 17/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Notre Array: arr.toString() = 65,48,91
test.html:7:4
Avec la Boucle FOR :
65
48
91
Hors liste : undefined
test.html:10:4
test.html:12:7
test.html:12:7
test.html:12:7
test.html:14:4
arr.entries() = Array Iterator { }
test.html:20:4
<prototype>: Array Iterator
next: function next()
Symbol(Symbol.toStringTag): "Array Iterator"
<prototype>: Object { … }
Symbol(Symbol.iterator):
function Symbol.iterator()
<prototype>: Object { … }
arr.keys() = Array Iterator { }
test.html:21:4
<prototype>: Array Iterator
next: function next()
Symbol(Symbol.toStringTag): "Array Iterator"
<prototype>: Object { … }
Symbol(Symbol.iterator):
function Symbol.iterator()
<prototype>: Object { … }
arr.values() = Array Iterator { }
test.html:22:4
<prototype>: Array Iterator
next: function next()
Symbol(Symbol.toStringTag): "Array Iterator"
<prototype>: Object { … }
Symbol(Symbol.iterator):
function Symbol.iterator()
<prototype>: Object { … }
Différents types d’Arrays
- 18/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
arr.entries()
Array Iterator { }
test.html:25:4
test.html:27:4
it.next().value= Array [ 0, 65 ]
(2) […]
0: 0
1: 65
length: 2
<prototype>: Array []
test.html:30:7
it.next().value= Array [ 1, 48 ]
it.next().value= Array [ 2, 91 ]
Hors liste : undefined
test.html:30:7
test.html:30:7
test.html:33:4
arr.keys()
Array Iterator { }
it.next().value= Array [ 0, 65 ]
it.next().value= Array [ 1, 48 ]
it.next().value= Array [ 2, 91 ]
Hors liste : undefined
test.html:37:4
test.html:39:4
test.html:42:7
test.html:42:7
test.html:42:7
test.html:45:4
arr.values()
Array Iterator { }
it.next().value= 65
it.next().value= 48
it.next().value= 91
Hors liste : undefined
test.html:49:4
test.html:51:4
test.html:54:7
test.html:54:7
test.html:54:7
test.html:57:4
Combien de fois un élément se retrouve dans une Typed Array ?
La solution, avec une fonction CALLBACK, en l’occurrence
« r = Array . filter ( fc ); »
<script type="text/javascript"> "use strict";
Différents types d’Arrays
- 19/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
let Max=0, r, ref, eg=[] , c=[], n=0, tot=0;
const ar = new Int32Array([
15,17,12,10,14,15,12,11,10,16,
20,11,14,20,17,19,13,11,19,20,
15,17,18,17,18,17,15,13,15,15,
11,13,16,17,16,20,14,10,20,14,
20,16,17,14,15,18,13,20,18,18
]);
for(let k=0,l=ar.length ; k<l ; k++){
Max = Math.max (Max, ar[k]);
c[k]=0;
}
console.log("TypedArray initiale: "+ar);
console.log("");
let fc = (element, index, array) =>
element==ref;
console.log("Les éléments égaux : ");
for(let k=0,l=ar.length ; k<l ; k++){
ref = ar[k];
r = ar.filter(fc);
console.log(
String(k).padStart(3," ") ,
" : " , r);
eg[r[0]]=r[0];c[r[0]]+=1;
}
let t="";
for(let k=0,l=ar.length ; k<=Max ; k++){
if(eg[k]) {
t+=eg[k]+" ["+c[k]+"×] | ";
n++; tot+=c[k]
Différents types d’Arrays
- 20/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
}
}
console.log(t);
console.log("Un Total de",tot,"nombres,");
console.log("dont",n,"différents.");
</script>
TypedArray initiale:
15,17,12,10,14,15,12,11,10,16,20,11,14,20,17,19,13,11,19,20,15,
17,18,17,18,17,15,13,15,15,11,13,16,17,16,20,14,10,20,14,20,16,
17,14,15,18,13,20,18,18
test.html:16:4
Les éléments égaux :
0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
:
test.html:23:4
Int32Array(7) [ 15, 15, 15, 15, 15, 15, 15 ]
Int32Array(7) [ 17, 17, 17, 17, 17, 17, 17 ]
Int32Array
[ 12, 12 ]
Int32Array(3) [ 10, 10, 10 ]
Int32Array(5) [ 14, 14, 14, 14, 14 ]
Int32Array(7) [ 15, 15, 15, 15, 15, 15, 15 ]
Int32Array
[ 12, 12 ]
Int32Array(4) [ 11, 11, 11, 11 ]
Int32Array(3) [ 10, 10, 10 ]
Int32Array(4) [ 16, 16, 16, 16 ]
Int32Array(7) [ 20, 20, 20, 20, 20, 20, 20 ]
Int32Array(4) [ 11, 11, 11, 11 ]
Int32Array(5) [ 14, 14, 14, 14, 14 ]
Int32Array(7) [ 20, 20, 20, 20, 20, 20, 20 ]
Int32Array(7) [ 17, 17, 17, 17, 17, 17, 17 ]
Int32Array
[ 19, 19 ]
Int32Array(4) [ 13, 13, 13, 13 ]
Int32Array(4) [ 11, 11, 11, 11 ]
Int32Array
[ 19, 19 ]
Int32Array(7) [ 20, 20, 20, 20, 20, 20, 20 ]
Int32Array(7) [ 15, 15, 15, 15, 15, 15, 15 ]
Int32Array(7) [ 17, 17, 17, 17, 17, 17, 17 ]
Int32Array(5) [ 18, 18, 18, 18, 18 ]
Int32Array(7) [ 17, 17, 17, 17, 17, 17, 17 ]
Int32Array(5) [ 18, 18, 18, 18, 18 ]
Int32Array(7) [ 17, 17, 17, 17, 17, 17, 17 ]
Différents types d’Arrays - 21/76 - samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
26 : Int32Array(7) [ 15, 15,
27 : Int32Array(4) [ 13, 13,
28 : Int32Array(7) [ 15, 15,
29 : Int32Array(7) [ 15, 15,
30 : Int32Array(4) [ 11, 11,
31 : Int32Array(4) [ 13, 13,
32 : Int32Array(4) [ 16, 16,
33 : Int32Array(7) [ 17, 17,
34 : Int32Array(4) [ 16, 16,
35 : Int32Array(7) [ 20, 20,
36 : Int32Array(5) [ 14, 14,
37 : Int32Array(3) [ 10, 10,
38 : Int32Array(7) [ 20, 20,
39 : Int32Array(5) [ 14, 14,
40 : Int32Array(7) [ 20, 20,
41 : Int32Array(4) [ 16, 16,
42 : Int32Array(7) [ 17, 17,
43 : Int32Array(5) [ 14, 14,
44 : Int32Array(7) [ 15, 15,
45 : Int32Array(5) [ 18, 18,
46 : Int32Array(4) [ 13, 13,
47 : Int32Array(7) [ 20, 20,
48 : Int32Array(5) [ 18, 18,
49 : Int32Array(5) [ 18, 18,
JavaScript Tome-XXII
15, 15, 15, 15, 15 ]
13, 13 ]
15, 15, 15, 15, 15 ]
15, 15, 15, 15, 15 ]
11, 11 ]
13, 13 ]
16, 16 ]
17, 17, 17, 17, 17 ]
16, 16 ]
20, 20, 20, 20, 20 ]
14, 14, 14 ]
10 ]
20, 20, 20, 20, 20 ]
14, 14, 14 ]
20, 20, 20, 20, 20 ]
16, 16 ]
17, 17, 17, 17, 17 ]
14, 14, 14 ]
15, 15, 15, 15, 15 ]
18, 18, 18 ]
13, 13 ]
20, 20, 20, 20, 20 ]
18, 18, 18 ]
18, 18, 18 ]
10 [3×] | 11 [4×] | 12 [2×] | 13 [4×] |
14 [5×] | 15 [7×] | 16 [4×] | 17 [7×] |
18 [5×] | 19 [2×] | 20 [7×] |
test.html:43:4
Un Total de 50 nombres,
dont 11 différents.
test.html:44:4
test.html:45:4
Les Arrays typées peuvent être parcourues soit avec une boucle ordinaire
( for... el [ idx ] ) soit avec une itérateur :
<script type="text/javascript">
let t;
"use strict";
var ar = new Uint32Array(
Différents types d’Arrays
- 22/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
[30, 38, 95, 66, 69, 15, 76, 10, 92, 99 ]
);
console.log(ar);
console.log("".padEnd(25,"="));
t="";
for(let i=0 ; i < ar.length ; i++){
t += ar[i]+" | "
}
console.log(t);
console.log("".padEnd(25,"="));
var s = ar.subarray(3, 8);
console.log("La Nouvelle Uint32Array : ");
console.log(s);
console.log("".padEnd(25,"="));
t="";
var iterator = s.values();
for(let i=0 ; i < s.length ; i++){
t += iterator.next().value + " | ";
}
console.log(t);
</script>
Uint32Array(10) [ 30, 38, 95, 66, 69, 15, 76, 10, 92, 99 ]
test.html:7:5
Différents types d’Arrays
- 23/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
=========================
test.html:10:1
30 | 38 | 95 | 66 | 69 | 15 | 76 | 10 | 92 | 99 |
test.html:17:5
=========================
test.html:21:1
La Nouvelle Uint32Array :
test.html:25:5
Uint32Array(5) [ 66, 69, 15, 76, 10 ]
test.html:26:5
=========================
test.html:30:1
66 | 69 | 15 | 76 | 10 |
test.html:38:5
La méthode « typedArray1 . set ( typedArray2 , pos ) » remplace les éléments de la TypedArray1 par ceux de la TypedArray2 à partir de la positon « p » dans la TypedArray1. Cette méthode n’est pas disponible avec
l’objet Array.
<script type="text/javascript">
const ar1 =
new Uint16Array([77,33,44,88,11,55,66,22,00,99 ]);
console.log("Array initiale:\n"+ar1);
console.log("Initial length ="+ar1.length);
console.log("");
const ar2 =
new Uint32Array([600,680,650 ]);
console.log("Ar1:\n"+ar1);
console.log("Ar2:\n"+ar2);
ar1.set(ar2, 3);
console.log("ar1.set(ar2, 3) =\n"+ar1);
console.log("Final length ="+ar1.length);
console.log("");
Différents types d’Arrays
- 24/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
console.log("");
const ar3 =
new Uint8ClampedArray([20,50,30 ]);
console.log("Ar1:\n"+ar1);
console.log("Ar3:\n"+ar3);
ar1.set(ar3, 5);
console.log("ar1.set(ar3, 5) =\n"+ar1);
console.log("Final length ="+ar1.length);
console.log("");
const ar4 =
new Uint8ClampedArray([700,750,720 ]);
console.log("Ar1:\n"+ar1);
console.log("Ar4:\n"+ar4);
ar1.set(ar4, 6);
console.log("ar1.set(ar4, 6) =\n"+ar1);
console.log("Final length ="+ar1.length);
</script>
Array initiale: 77,33,44,88,11,55,66,22,0,99 test.html:4:3
Initial length =10
test.html:5:3
Ar1: 77,33,44,88,11,55,66,22,0,99
test.html:11:3
Ar2: 600,680,650
test.html:12:3
ar1.set(ar2, 3) = 77,33,44,600,680,650,66,22,0,99
Final length =10
test.html:15:3
Ar1: 77,33,44,600,680,650,66,22,0,99
test.html:22:3
Ar3: 20,50,30
test.html:23:3
ar1.set(ar3, 5) = 77,33,44,600,680,20,50,30,0,99 test.html:25:3
Final length =10
test.html:26:3
Ar1: 77,33,44,600,680,20,50,30,0,99
Ar4: 255,255,255
Différents types d’Arrays
- 25/76 -
test.html:32:3
test.html:33:3
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
ar1.set(ar4, 6) = 77,33,44,600,680,20,255,255,255,99
Final length =10
test.html:36:3
Remarquez ci-dessous que le nombre contenu dans un élément d’un typedArray ne peut pas dépasser la valeur maximale autorisée pour la taille en
bits de ce type.
Ici const
ar1 = new Uint8Array([77,33,44,88,11,55,66,22,00,99 ]);
L’Array ar1 ne peut contenir que des entiers 8 bits non signés, donc sa valeur maximale = 255. Tous les bits de gauche au-delà de la 8è case ou position en comptant de la droite vers la gauche, sont ignorés.
Idem pour les autres tailles 16 bits et 32 bits (jusqu’aujourd’hui =samedi 17
novembre 2018 - 9:39:05 AM=, pas encore de 64 bits même avec le ES10
ou Ecmascript 2019 [de l’année prochaine]).
Quant au Uint8ClampedArray
Ce sont des entiers non signés inférieurs à 255 et les valeurs supérieures à
255 sont automatiquement ramenées à 255.
Il convient donc dès le départ de bien savoir avec quelles valeurs on aura à
travailler.
Voici comment le même programme que ci-dessus affiche avec
const ar1 = new Uint8Array
<script type="text/javascript">
const ar1 =
new Uint8Array([77,33,44,88,11,55,66,22,00,99 ]);
console.log("Array initiale:\n"+ar1);
console.log("Initial length ="+ar1.length);
console.log("");
Différents types d’Arrays
- 26/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
const ar2 =
new Uint32Array([600,680,650 ]);
console.log("Ar1:\n"+ar1);
console.log("Ar2:\n"+ar2);
ar1.set(ar2, 3);
console.log("ar1.set(ar2, 3) =\n"+ar1);
console.log("Final length ="+ar1.length);
console.log("");
console.log("");
const ar3 =
new Uint8ClampedArray([20,50,30 ]);
console.log("Ar1:\n"+ar1);
console.log("Ar3:\n"+ar3);
ar1.set(ar3, 5);
console.log("ar1.set(ar3, 5) =\n"+ar1);
console.log("Final length ="+ar1.length);
console.log("");
const ar4 =
new Uint8ClampedArray([700,750,720 ]);
console.log("Ar1:\n"+ar1);
console.log("Ar4:\n"+ar4);
ar1.set(ar4, 6);
console.log("ar1.set(ar4, 6) =\n"+ar1);
console.log("Final length ="+ar1.length);
</script>
Array initiale: 77,33,44,88,11,55,66,22,0,99 test.html:4:3
Initial length =10
test.html:5:3
Ar1: 77,33,44,88,11,55,66,22,0,99
test.html:11:3
Ar2: 600,680,650
test.html:12:3
ar1.set(ar2, 3) = 77,33,44,88,168,138,66,22,0,99 test.html:14:3
Final length =10
test.html:15:3
Différents types d’Arrays
- 27/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Ar1: 77,33,44,88,168,138,66,22,0,99
test.html:22:3
Ar3: 20,50,30
test.html:23:3
ar1.set(ar3, 5) = 77,33,44,88,168,20,50,30,0,99 test.html:25:3
Final length =10
test.html:26:3
Ar1: 77,33,44,88,168,20,50,30,0,99
test.html:32:3
Ar4: 255,255,255
test.html:33:3
ar1.set(ar4, 6) = 77,33,44,88,168,20,255,255,255,99
Final length =10
test.html:36:3
La méthode « . slice ( 2 , 7 ) » avec les arrays typées :
Retourne une Array copie de l’Array source à partir de l’indice 2 inclus
jusqu’à 7 exclu (à compter de zéro) [ 2 – 7 [ sans modifier l’Array initiale.
<script type="text/javascript">
var arr1 = new Int32Array([44,16,38,28,40,21,75,77,28,87]);
console.log("Array initiale arr1 = ",arr1);
console.log("");
console.log("arr1.slice(2, 7) = ",arr1.slice(2, 7));
console.log("arr1 = ",arr1);
</script>
Array initiale arr1 =
Int32Array(10) [ 44, 16, 38, 28, 40, 21, 75, 77, 28, 87 ]
test.html:3:4
arr1.slice(2, 7) =
Int32Array(5) [ 38, 28, 40, 21, 75 ]
test.html:5:4
arr1 =
Int32Array(10) [ 44, 16, 38, 28, 40, 21, 75, 77, 28, 87 ]
test.html:6:4
Différents types d’Arrays
- 28/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Pour accéder à un élément de l’Array à partir de la fin, on utilise des index
négatifs comme premier argument de « .slice ».
« .slice » retournant une Array, on peut facilement accéder aux premiers et
derniers éléments d’une quelconque Array par indexage des éléments d’une
Array retournée avec « .slice » en partant soit du premier élément de
l’Array source, soit du dernier élément (indice -1). Par exemple, pour avoir
le Nième élément de l’Array, on peut écrire ceci :
Pour avoir le Nième élément d’une Array à partir du premier (indice =
zéro), de l’Array retournée par « .slice » ou une toute autre Array, on écrit
[plus lourd, mais facilite la compréhension] :
Array . slice ( 0 ) [ N ] , N compris entre [ 0 et Array.length-1 [.
Cette instruction retourne toute l’Array source, et retient l’élément à la
Nième position à partir de zéro, elle est donc équivalente à :
Array[0]
Pour accéder à un élément d’une Array à partir de la fin, on peut
écrire :
Array . slice ( N ) [ 0 ] , N doit être négatif, et -1 pour commencer le
compte par la fin, l’indice doit être toujours zéro.
Le résultat final dépend de l’instruction précise.
La méthode « Array . from ( ) » :
« Array . from ( ) » est une Array polymorphe qui retourne une nouvelle
Array ordonnée, constituée de tous les éléments d’une Array, un Set ou une
Différents types d’Arrays
- 29/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
String sources.
Pour les « Sets », ces éléments sont retenus une et une seule fois au cas où
cet même élément se répète dans le « Set » source (c’est la définition même
de « Set » = jeu d’échantillons représentatifs).
Pour les Arrays sources, c’est le premier élément rencontré est retenu.
Pour les Hash (littéral d’objet), l’élément de l’indice en cours écrase éventuellement l’élément du même indice qui vient avant.
<script type="text/javascript"> "use strict";
const arr=[12, 10, 14, 12, 10, 12, 11, 12, 13, 12];
let r=Array.from( new Set( arr ));
console.log("Array Srce =", arr);
// Array Srce =
// Array(10) [ 12, 10, 14, 12, 10, 12, 11, 12, 13, 12 ]
console.log("Array Cible =", r);
// Array Cible =
// Array(5) [ 12, 10, 14, 11, 13 ]
</script>
Un autre exemple avec d’autres types comme source :
<script type="text/javascript"> "use strict";
let r;
// Array.from avec ARRAY :
//
Elle prend tout même les doublons.
r = Array.from(
[6, 13, 8, 11, 8, 6, 7, 15, 7, 13]
);
console.log(typeof r , r )
// object
// Array(10) [ 6, 13, 8, 11, 8, 6, 7, 15, 7, 13 ]
// Array.from avec TYPED ARRAY :
Différents types d’Arrays - 30/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
//
Elle prend tout même les doublons.
r = Array.from(
new Uint8ClampedArray(
[9, 12, 11, 8, 6, 11, 7, 11, 14, 6]
)
);
console.log(typeof r , r )
// object
// Array(10) [ 9, 12, 11, 8, 6, 11, 7, 11, 14, 6 ]
// Array.from avec SET:
//
Elle prend tout quand ils sont uniques.
r = Array.from( new Set(
[25, 73, 100, 12, 39, 17, 75, 16, 96, 94])
);
console.log(typeof r , r )
// object
// (10) [25, 73, 100, 12, 39, 17, 75, 16, 96, 94]
// Array.from avec SET :
//
Il ne retient pas les doublons.
r = Array.from( new Set(
[14, 11, 12, 13, 12, 11, 11, 12, 11, 10])
);
console.log(typeof r , r )
// object
// Array(5) [ 14, 11, 12, 13, 10 ]
// Array.from avec HASH :
//
Elle prend la quantité spécifiée par length,
//
tous les indices de 0 à length-1, en ne
//
retenant que la valeur du dernier indice doublon.
r = Array.from(
{0: 86, 1: 16, 2:12, 3:49, 4:78, 5:60, length: 6}
);
console.log(typeof r , r )
// object
// (6) [86, 16, 12, 49, 78, 60]
Différents types d’Arrays
- 31/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
// Array.from HASH :
//
Il prend la quantité spécifiée par length,
//
tous les indices de 0 à length-1.
r = Array.from(
{0:11, 1:10, 2:15, 3:11, 4:12, 5:11, length: 6}
);
console.log(typeof r , r )
// object
// Array(6) [ 11, 10, 15, 11, 12, 11 ]
// Array.from HASH :
//
Il prend la quantité spécifiée par length,
//
tous les indices de 0 à length-1.
r = Array.from(
{3:19, 1:17, 2:25, 3:12, 3:16, 0:11, 2:14, length: 6}
);
console.log(typeof r , r )
// object
// Array(6) [ 11, 17, 14, 16, undefined, undefined ]
// Array.from HASH
r = Array.from(
{0:86, 1:16, 2:12, 3:49, 4:78, 5:60, length: 3}
);
console.log(typeof r , r )
// object
// (3) [86, 16, 12]
// Array.from HASH
r = Array.from(
{0:86, 1:16, 2:12, 3:49, 4:78, 5:60, length: 8}
);
console.log(typeof r , r )
// object
// (8) [86, 16, 12, 49, 78, 60, undefined, undefined]
// Array.from HASH
r = Array.from(
Différents types d’Arrays
- 32/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
{0:86, 1:16, annee:12, 3:49, 4:78, 5:60, length: 6}
);
console.log(typeof r , r )
// object
// (6) [86, 16, undefined, 49, 78, 60]
// Array.from HASH
r = Array.from(
{3:86, "1":16, 4:12, 0:49, "5":60, 2:78, length: 6}
);
console.log(typeof r , r )
// object
// (6) [49, 16, 78, 86, 12, 60]
// Array.from HASH
r = Array.from(
{5:86, 1:16, 7:12, 10:49, 3:78, 9:60, length: 6}
);
console.log(typeof r , r )
// object
// (6) [undefined, 16, undefined, 78, undefined, 86]
// Array.from HASH
r = Array.from(
{5:86, 1:16, 7:12, 10:49, 3:78, 9:60, length: 11}
);
console.log(typeof r , r )
// object
// (11) [undefined, 16, undefined, 78, undefined,
//
86, undefined, 12, undefined, 60, 49]
// Array.from HASH
r = Array.from(
{3:22, 15:94, 8:65, 0:98, 11:48, length: 16}
);
console.log(typeof r , r )
// object
// (16) [98, undefined, undefined, 22, undefined,
//
undefined, undefined, undefined, 65, undefined,
Différents types d’Arrays
- 33/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
// undefined, 48, undefined, undefined, undefined, 94]
// Array.from HASH
r = Array.from(
{1:22, 3:94, 5:65, 7:98, 9:20, 10:48, length: 5}
);
console.log(typeof r , r )
// object
// (5) [undefined, 22, undefined, 94, undefined]
console.log("".padEnd(25,"="));
console.log("AVEC CALLBACK en 2è argument");
console.log("Pour appliquer un même TTT à "+
"chaque élément de l'Array");
console.log("=".repeat(25));
// Array.from STRING, avec pointeur sur fonction
// callback, ici le constructeur Number
r = Array.from('2018', Number);
console.log(typeof r , r )
// object
// (4) [2, 0, 1, 8]
// Array.from STRING, avec
//
fonction callback ordinaire et inline
r = Array.from('4239617508', function(e){
return e+" "+ !(e%3);
// divisible par (ou multiple de) 3 ?
});
console.log(typeof r , r )
// object
// (10) ["4 false", "2 false", "3 true",
// "9 true", "6 true", "1 false", "7 false",
// "5 false", "0 true", "8 false"]
</script>
Exécution avec Firefox :
Différents types d’Arrays
- 34/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
object
Array(10) [ 6, 13, 8, 11, 8, 6, 7, 15, 7, 13 ]
test.html:9:4
object
Array(10) [ 9, 12, 11, 8, 6, 11, 7, 11, 14, 6 ]
test.html:21:4
object
Array(10) [ 25, 73, 100, 12, 39, 17, 75, 16, 96, 94 ]
test.html:31:4
object
Array(5) [ 14, 11, 12, 13, 10 ]
test.html:41:4
object
Array(6) [ 86, 16, 12, 49, 78, 60 ]
test.html:53:4
object
Array(6) [ 11, 10, 15, 11, 12, 11 ]
test.html:64:4
object
Array(6) [ 11, 17, 14, 16, undefined, undefined ]
test.html:76:4
object
Array(3) [ 86, 16, 12 ]
test.html:85:4
object
Array(8) [ 86, 16, 12, 49, 78, 60, undefined, undefined ]
test.html:94:4
object
Array(6) [ 86, 16, undefined, 49, 78, 60 ]
test.html:103:4
object
Array(6) [ 49, 16, 78, 86, 12, 60 ]
Différents types d’Arrays - 35/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
test.html:112:4
JavaScript Tome-XXII
object
Array(6) [ undefined, 16, undefined, 78, undefined, 86 ]
test.html:121:4
object
Array(11) [ undefined, 16, undefined, 78, undefined, 86, undefined, 12, undefined, 60, … ]
test.html:130:4
object
Array(16) [ 98, undefined, undefined, 22, undefined, undefined,
undefined, undefined, 65, undefined, … ]
test.html:140:4
object
Array(5) [ undefined, 22, undefined, 94, undefined ]
test.html:151:4
========================= test.html:156:1
AVEC CALLBACK en 2è argument test.html:157:1
Pour appliquer un même TTT à chaque élément de l'Array
test.html:158:1
========================= test.html:160:1
object
Array(4) [ 2, 0, 1, 8 ]
test.html:166:4
object
Array(10) [ "4 false", "2 false", "3 true", "9 true", "6 true",
"1 false", "7 false", "5 false", "0 true", "8 false" ]
test.html:177:4
La méthode « Array . of ( ) » :
Retourne une Array à partir d’une liste d’éléments séparés par une virgule.
Différents types d’Arrays
- 36/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
<script type="text/javascript"> "use strict";
let r;
r = Array.of(1);
console.log(typeof r);
console.log(r);
// =>
[1]
r = Array.of(10);
console.log(typeof r);
console.log(r);
// =>
[10]
r = Array.of(78, 90, 25, 33, 56, 36, 39, 96, 93, 35);
console.log(typeof r);
console.log(r);
// => (10) [78, 90, 25, 33, 56, 36, 39, 96, 93, 35]
r = Array.of("jour",23, "annee",2018, "mois",11,
{hr:8 , min:37});
console.log(typeof r);
console.log(r);
// => (10) [78, 90, 25, 33, 56, 36, 39, 96, 93, 35]
</script>
Avec Firefox :
Différents types d’Arrays
- 37/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Avec Yandex :
Différents types d’Arrays
- 38/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
Différents types d’Arrays
JavaScript Tome-XXII
- 39/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
La boucle itératrice « for … of » des Arrays :
<script type="text/javascript"> "use strict";
let t;
var arr = ['oméga',27,3.14,{}];
t="";
for(const valeur of arr) t+=valeur+" | ";
console.log(t);
// oméga | 27 | 3.14 | [object Object] |
t="";
for(let
valeur of arr.values()) t+=valeur+" | ";
console.log(t);
// oméga | 27 | 3.14 | [object Object] |
t="";
for(var
cle of arr.keys()) t+=cle+" | ";
console.log(t);
// 0 | 1 | 2 | 3 |
t="";
for(let [cle, valeur]
t+="cle = "+cle+" ,
}
console.log(t);
// cle = 0 , valeur =
// cle = 1 , valeur =
of arr.entries()){
"+"valeur = "+valeur+" | ";
oméga |
27 |
Différents types d’Arrays
- 40/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
// cle = 2 , valeur = 3.14 |
// cle = 3 , valeur = [object Object] |
</script>
Le code suivant donne le Nième élément d’une Array, en particulier le
premier et le dernier :
<script> "use strict";
let t;
var array = [17,32,68,90];
console.log(array);
console.log("".padEnd(25,"="))
t="";
for(let i=-2,l=array.length+3 ; i<l ; i++){
t+=array.slice(0)[i]+" | ";
}
console.log("t+=array.slice(0)[i]");
console.log(t);
console.log("".padEnd(25,"="))
t="";
for(let i=-2,l=array.length+3 ; i<l ; i++){
t+=array.slice(i)[0]+" | ";
}
console.log("t+=array.slice(i)[0]");
console.log(t);
console.log("".padEnd(25,"="))
Différents types d’Arrays
- 41/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
t="";
console.log("t+=array.slice(0)[-i]");
for(let l=array.length, i=l+2 ; i>-5 ; i--){
t+=array.slice(0)[i]+" | ";
}
console.log(t);
console.log("".padEnd(25,"="))
t="";
for(let l=array.length, i=l+2 ; i>-5 ; i--){
t+=array.slice(i)[0]+" | ";
}
console.log("t+=array.slice(-i)[0]");
console.log(t);
console.log("".padEnd(25,"="))
console.log("array.slice(0)[-i]");
for(let l=array.length, i=l+2 ; i>-5 ; i--){
console.log(array.slice(0)[i]);
}
console.log("".padEnd(25,"="))
console.log("array.slice(-i)[0]");
for(let l=array.length, i=l+2 ; i>-5 ; i--){
console.log(array.slice(i)[0]);
}
</script>
Différents types d’Arrays
- 42/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
Différents types d’Arrays
JavaScript Tome-XXII
- 43/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Pour avoir plus facilement le tout dernier élément d’une Array on écrit :
Array [ (Array . length) – 1 ].
La méthode « . fill ( v
,
d ) » avec les arrays typées :
Remplace par la valeur « v » tous les éléments de l’Array à partir de la position « d » à compter de zéro, par défaut à partir de l’élément d’indice 0.
Disponible pour les objets Array et Typed Array.
<script type="text/javascript">
var ar = new Uint16Array(
[90,27,65,91,10,31,51,16,56,82,12]);
console.log("Array de départ :\n",ar);
console.log("ar.length :",ar.length);
console.log("");
result = ar.fill(1283, 5);
console.log("Array après .fill(v,d) :\n"+ar);
Différents types d’Arrays
- 44/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
console.log("ar.length :"+ar.length);
</script>
Array de départ :
Uint16Array(11) [
90, 27, 65, 91, 10, 31, 51, 16, 56, 82, …
]
test.html:3:4
ar.length : 11
test.html:4:4
Array après .fill(v,d) :
90,27,65,91,10,1283,1283,1283,1283,1283,1283
test.html:9:4
ar.length :11
test.html:9:4
C’est aussi l’occasion de voir la différence entre les deux affichages, avec
« console.log("Array de départ :\n" , ar); » ave une « virgule »,
et
« console.log("Array après .fill(v,d) :\n" + ar); » avec un
« plus » :
L’instruction « console.log("Array de départ :\n" , ar); » avec
virgule chaîne les affichages de chaque objet séparément avec la méthode
de son type, tandis que
« console.log("Array après .fill(v,d) :\n" + ar); » avec plus
utilise la méthode de l’objet String().
La méthode « Array . fill » permet de facilement initialiser tous ou partie
des éléments d’une Array préexistante ou fraîchement créée :
Différents types d’Arrays
- 45/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
<script type="text/javascript"> "use strict";
let i1, i2;
var arr = new Int32Array(new ArrayBuffer(10 * 4));
console.log("Notre Array : "+arr);
arr.fill(300);
console.log("Notre Array : "+arr);
arr.fill(2018,5);
console.log("Notre Array : "+arr);
arr.fill(999,3,8);
console.log("Notre Array : "+arr);
// Une forme lourde pour ce faire :
for(let i=3 ; i< 7 ; i++) arr[i] = i;
console.log("Notre Array : "+ arr);
</script>
Comment initialiser les éléments d’une Array avec des nombres aléatoires par exemple entre 10 et 100, sans utiliser de boucle ?
On crée un Array d’autant d’éléments et avec la méthode « Array . map
( ) » on retourne une autre Array avec un nombre aléatoire pour chacun des
éléments de la première Array. On croirait que ceci suffit, mais on se bluffe.
<script type="text/javascript"> "use strict";
const arr = new Array(15);
var nvTableau = arr.map(_=>Math.round(Math.random()*90)+10);
console.log(nvTableau);
console.log(arr);
</script>
Différents types d’Arrays
- 46/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Avec Firefox :
Avec Yandex :
On remplit chaque élément de l’Array-source lors de sa création :
<script type="text/javascript"> "use strict";
const arr = new Array(15).fill();
var nvTableau = arr.map(_=>Math.round(Math.random()*90)+10);
console.log(nvTableau);
console.log(arr);
</script>
Firefox :
Différents types d’Arrays
- 47/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Yandex :
Ça marche, mais on constate que chaque élément de la première Array vaut
« undefined » ce qui nous donne moche à l’affichage ?
On remplit alors donc l’Array en création par exemple avec des zéro (0) :
<script type="text/javascript"> "use strict";
const arr = new Array(15).fill(0);
var nvTableau = arr.map(_=>Math.round(Math.random()*90)+10);
console.log(nvTableau);
console.log(arr);
</script>
Différents types d’Arrays
- 48/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Une alternative est d’utiliser une boucle après la création de l’Array :
<script type="text/javascript"> "use strict";
const arr = new Array(15);
for(let i=0, l=arr.length ; i<l ; i++){
arr[i]= Math.round(Math.random()*90)+10;
}
console.log(arr);
</script>
Deux fonctions (ou mieux, méthodes) font exactement la même chose avec
les Arrays Typées : la Array.slice() et la Array.subarray(), pendant
qu’avec les Arrays seule la méthode « Array.slice() » est disponible.
<script type="text/javascript">
let r;
var typedArray =
new Int8Array([47,84,52,98,49,96,73,50,28,26 ]);
console.log("Array initiale =\n"+typedArray);
r = typedArray.slice(2, 6);
console.log("\ntypedArray.slice(2, 7) =\n"+r);
r = typedArray.subarray(2, 6);
console.log("\ntypedArray.subarray(2, 7) =\n "+r);
console.log("\nArray initiale conservée :\n" +
typedArray);
</script>
Différents types d’Arrays
- 49/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
La méthode « Array . copyWithin ( v
Typées » :
,
d ) » des « Arrays » et « Arrays
Modifie l’Array en cours en remplaçant ses éléments effectifs situés à partir
de la position « d », par ses éléments contenus à partir de la position « v »,
et ce, dans les limites de la taille maximale de l’array.
<script type="text/javascript"> "use strict";
let i1, i2;
var arr = new Int32Array([
29,66,23,95,28,12,40,22,92,75,90,54,34,19,35,52,62,98
]);
console.log("Notre Array : ".padStart(24," ")+arr);
i1=3,i2=14;
arr.copyWithin(i1, i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=2,i2=7;
Différents types d’Arrays
- 50/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
arr.copyWithin(i1, i2);
JavaScript Tome-XXII
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=6,i2=3;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=5,i2=5;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=6,i2=-6;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=-7,i2=7;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
Différents types d’Arrays
- 51/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
i1=-8,i2=-8;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=-9,i2=-3;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=-5,i2=-9;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=-5,i2=7;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=-7,i2=5;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
Différents types d’Arrays
- 52/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
i1=0,i2=5;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
i1=5,i2=0;
arr.copyWithin(i1,i2);
console.log(
("arr.copyWithin("+i1+","+i2+") : ").padStart(24," ")+
arr);
</script>
Notre Array :
29,66,23,95,28,12,40,22,92,75,90,54,34,19,35,52,62,98
arr.copyWithin(3,14) :
29,66,23,35,52,62,98,22,92,75,90,54,34,19,35,52,62,98
arr.copyWithin(2,7) :
29,66,22,92,75,90,54,34,19,35,52,62,98,19,35,52,62,98
arr.copyWithin(6,3) :
29,66,22,92,75,90,92,75,90,54,34,19,35,52,62,98,19,35
arr.copyWithin(5,5) :
29,66,22,92,75,90,92,75,90,54,34,19,35,52,62,98,19,35
arr.copyWithin(6,-6) :
29,66,22,92,75,90,35,52,62,98,19,35,35,52,62,98,19,35
arr.copyWithin(-7,7) :
29,66,22,92,75,90,35,52,62,98,19,52,62,98,19,35,35,52
arr.copyWithin(-8,-8) :
29,66,22,92,75,90,35,52,62,98,19,52,62,98,19,35,35,52
Différents types d’Arrays
- 53/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
arr.copyWithin(-9,-3) :
29,66,22,92,75,90,35,52,62,35,35,52,62,98,19,35,35,52
arr.copyWithin(-5,-9) :
29,66,22,92,75,90,35,52,62,35,35,52,62,35,35,52,62,98
arr.copyWithin(-5,7) :
29,66,22,92,75,90,35,52,62,35,35,52,62,52,62,35,35,52
arr.copyWithin(-7,5) :
29,66,22,92,75,90,35,52,62,35,35,90,35,52,62,35,35,52
arr.copyWithin(0,5) :
90,35,52,62,35,35,90,35,52,62,35,35,52,52,62,35,35,52
arr.copyWithin(5,0) :
90,35,52,62,35,90,35,52,62,35,35,90,35,52,62,35,35,52
La méthode « Array . copyWithin ( v
« Arrays Typées » :
,
d
,
n ) » des « Arrays » et
Modifie l’Array en cours en remplaçant « n » de ses éléments effectifs situés à partir de la position « d », par ses éléments contenus à partir de la
position « v », et ce, dans les limites de la taille maximale de l’array.
Les règles de remplacement ne sont pas exactement les mêmes qu’avec
arr.copyWithin(i1,i2).
<script type="text/javascript"> "use strict";
let i1, i2, i3;
var arr = new Int32Array([
29,66,23,95,28,12,40,22,92,75,90,54,34,19,35,52,62,98
]);
console.log("Notre Array : ".padStart(26," ")+arr);
i1=3,i2=6;i3=7;
arr.copyWithin(i1,i2,i3);
Différents types d’Arrays
- 54/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=6,i2=3;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=5,i2=5;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=6,i2=-6;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=-7,i2=7;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=-8,i2=-8;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
Différents types d’Arrays
- 55/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
i1=-9,i2=-3;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=-5,i2=-9;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=-5,i2=7;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=-7,i2=5;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=0,i2=5;i3=7;
arr.copyWithin(i1,i2,i3);
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
i1=5,i2=0;i3=7;
arr.copyWithin(i1,i2,i3);
Différents types d’Arrays
- 56/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
console.log(("arr.copyWithin("+i1+","+i2+","+i3+") : ")
.padStart(26," ")+ arr);
</script>
Notre Array :
29,66,23,95,28,12,40,22,92,75,90,54,34,19,35,52,62,98
arr.copyWithin(3,6,7) :
29,66,23,40,28,12,40,22,92,75,90,54,34,19,35,52,62,98
arr.copyWithin(6,3,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(5,5,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(6,-6,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(-7,7,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(-8,-8,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(-9,-3,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(-5,-9,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(-5,7,7) :
29,66,23,40,28,12,40,28,12,40,90,54,34,19,35,52,62,98
arr.copyWithin(-7,5,7) :
29,66,23,40,28,12,40,28,12,40,90,12,40,19,35,52,62,98
arr.copyWithin(0,5,7) :
12,40,23,40,28,12,40,28,12,40,90,12,40,19,35,52,62,98
Différents types d’Arrays
- 57/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
arr.copyWithin(5,0,7) :
12,40,23,40,28,12,40,23,40,28,12,40,40,19,35,52,62,98
Les méthodes « Array . indexOf (n ) » et « Array . lastIndexOf (n ) »
des « Arrays » et « Arrays Typées » :
Donnent respectivement la première et la dernière position d’un élément
dans une Array ou Typed Array.
<script type="text/javascript">
var arr = new Int32Array(
[24,26,22,29,13,16,15,22,26,13,22,20,20,12,12,18,20,19]);
console.log("Notre Array: "+arr);
console.log("arr.length: "+arr.length);
const n=22;
var lidx = arr.lastIndexOf(n);
console.log(
"La dernière position de "+n+" est à l'index : "+lidx);
var fidx = arr.indexOf(n);
console.log(
"La première position de "+n+" est à l'index : "+fidx);
</script>
Notre Array:
24,26,22,29,13,16,15,22,26,13,22,20,20,12,12,18,20,19
test.html:4:4
arr.length: 18
test.html:5:4
La dernière position de 22 est à l'index : 10 test.html:10:4
La première position de 22 est à l'index : 2 test.html:14:4
Les méthodes « Array . find ( el ) » et « Array . findIndex ( el ) » des
« Arrays » et « Arrays Typées » :
Différents types d’Arrays
- 58/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
<script type="text/javascript"> "use strict";
const isCubic = n => !(Math.pow(n,1/3) % 1);
console.log([86, 57, 70, 68, 8, 27].find(isCubic));
// => 8
console.log([4, 8, NaN, 16, 23, 42].find(isNaN));
// => NaN
console.log([73, 343, 125, 57, 21].findIndex(isCubic));
// => 2
console.log([4, 8, 16, 23, 42, NaN].findIndex(isNaN));
// => 5
</script>
En passant, voici les propriétés auxquelles obéissent les Objets Int8Array ,
Int16Array , Int32Array , Uint8Array , Uint16Array , Uint32Array :
Int8Array(), Int16Array(), Int32Array(),
Uint8Array(), Uint16Array(), Uint32Array(),
Uint8ClampedArray().
BYTES_PER_ELEMENT: 4
length: 3
name: "Int32Array"
prototype: Int32ArrayPrototype { … }
BYTES_PER_ELEMENT: 4
constructor: function Int32Array()
constructor: Int32Array()
BYTES_PER_ELEMENT: 4
length: 3
name: "Int32Array"
prototype: Int32ArrayPrototype { … }
<prototype>: function TypedArray()
<prototype>: ??? { … }
buffer: Getter
byteLength: Getter
byteOffset: Getter
constructor: function TypedArray()
copyWithin: function copyWithin()
entries: function entries()
Différents types d’Arrays
- 59/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
every: function every()
fill: function fill()
filter: function filter()
find: function find()
findIndex: function findIndex()
forEach: function forEach()
includes: function includes()
indexOf: function indexOf()
join: function join()
keys: function keys()
lastIndexOf: function lastIndexOf()
length: Getter
map: function map()
reduce: function reduce()
reduceRight: function reduceRight()
reverse: function reverse()
set: function set()
slice: function slice()
some: function some()
sort: function sort()
subarray: function subarray()
toLocaleString: function toLocaleString()
toString: function toString()
values: function values()
Symbol(Symbol.iterator): function values()
Symbol(Symbol.toStringTag): Getter
<prototype>: Object { … }
<prototype>: function TypedArray()
Comparez ces quelques propriétés disponibles avec les types de données cidessus, avec quelques-unes disponible avec l’objet Array :
Array()
concat: function concat()
every: function every()
filter: function filter()
forEach: function forEach()
from: function from()
indexOf: function indexOf()
isArray: function isArray()
Différents types d’Arrays
- 60/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
join: function join()
lastIndexOf: function lastIndexOf()
length: 1
map: function map()
name: "Array"
of: function of()
pop: function pop()
prototype: Array []
concat: function concat()
constructor: function Array()
concat: function concat()
every: function every()
filter: function filter()
forEach: function forEach()
from: function from()
indexOf: function indexOf()
isArray: function isArray()
join: function join()
lastIndexOf: function lastIndexOf()
length: 1
map: function map()
name: "Array"
of: function of()
pop: function pop()
prototype: Array []
push: function push()
reduce: function reduce()
reduceRight: function reduceRight()
reverse: function reverse()
shift: function shift()
slice: function slice()
some: function some()
sort: function sort()
splice: function splice()
unshift: function unshift()
Symbol(Symbol.species): Getter
<prototype>: function ()
copyWithin: function copyWithin()
entries: function entries()
Différents types d’Arrays
- 61/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
every: function every()
fill: function fill()
filter: function filter()
find: function find()
findIndex: function findIndex()
flat: function flat()
flatMap: function flatMap()
forEach: function forEach()
includes: function includes()
indexOf: function indexOf()
join: function join()
keys: function keys()
lastIndexOf: function lastIndexOf()
length: 0
map: function map()
pop: function pop()
push: function push()
reduce: function reduce()
reduceRight: function reduceRight()
reverse: function reverse()
shift: function shift()
slice: function slice()
some: function some()
sort: function sort()
splice: function splice()
toLocaleString: function toLocaleString()
toSource: function toSource()
toString: function toString()
unshift: function unshift()
values: function values()
Symbol(Symbol.iterator): function values()
Symbol(Symbol.unscopables): Object {
copyWithin: true,
entries: true,
fill: true, …
}
<prototype>: Object { … }
push: function push()
reduce: function reduce()
Différents types d’Arrays
- 62/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
reduceRight: function reduceRight()
reverse: function reverse()
shift: function shift()
slice: function slice()
some: function some()
sort: function sort()
splice: function splice()
unshift: function unshift()
Symbol(Symbol.species): Getter
<get>: function Symbol.species()
<prototype>: function ()
Différents types d’Arrays
- 63/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
LES ARRAYS :
Les Arrays ou tableaux sont des collections les plus faciles à utiliser. Il
existe plusieurs façons de créer une Array, dont :
I.
Avec seulement des crochets :
<script type="text/javascript"> "use strict";
let a;
a = [];
// Array initialement vide.
console.log("a =",a,"[] =",[]);
a = [0];
// Array initialement à un seul élément,
// le nombre 0.
console.log("a =",a,"[0] =",[0]);
a = [10,11];
// Array initialement à deux éléments,
// les nombres 10 et 11 ou autres.
console.log("a =",a,"[0] =",[10,11]);
a = [10.11];
// Array initialement à un seul élément,
// le nombre 10.11.
console.log("a =",a,"[0] =",[10.11]);
</script>
Différents types d’Arrays
- 64/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
II.
JavaScript Tome-XXII
Avec Simplement « Array », sans « new » (sans passer par le constructeur = initialiseur) :
<script type="text/javascript"> "use strict";
let a;
a = Array();
// Array initialement vide.
console.log("a =",a,"Array() =",Array());
a = Array(0)
// Array initialement vide.
console.log("a =",a,"Array(0) =",Array(0));
a = Array("0")
// Array initialement à un seul élément,
// le littéral zéro (0).
console.log("a =",a,'Array("0") =',Array("0"));
a = Array(10,11)
// Array initialement à deux éléments,
// les nombres 10 et 11 ou autres.
console.log("a =",a,"Array(10,11) =",Array(10,11));
a = Array(10.11);
console.log("a =",a,"[0] =",Array(10.11));
// RangeError: invalid array length
Différents types d’Arrays
- 65/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
</script>
III.
Avec « Array » et « new » (en faisant appel au constructeur =
initialiseur) :
<script type="text/javascript"> "use strict";
let a;
a = new Array();
// Array initialement vide.
console.log("a =",a,"new Array() =",new Array());
a = new Array(0)
// Array initialement vide.
console.log("a =",a,"new Array(0) =",new Array(0));
a = new Array("0")
// Array initialement à un seul élément,
// le littéral zéro (0).
console.log("a =",a,'new Array("0") =',new Array("0"));
a = new Array(10,11)
// Array initialement à deux éléments,
// les nombres 10 et 11 ou autres.
console.log("a =",a,"new Array(10,11) =",new Array(10,11));
a = new Array(10.11);
Différents types d’Arrays
- 66/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
console.log("a =",a,"[0] =",new Array(10.11));
// RangeError: invalid array length
</script>
Quelques pièges avec les Arrays :
Si « "b" in ["a" , "b" , "c"] » donne « false »,
« 2 in [ 1 , 2 , 3 ] » donne « true ».
<script> "use strict";
const b="b", d=2;
console.log("b" in ["a","b","c"]); // false
console.log(b in ["a","b","c"]);
// false
console.log(2 in [1 , 2 , 3]);
console.log(d in [1 , 2 , 3]);
</script>
// true
// true
La méthode « Array . sort ( ) » :
Pour trier les éléments d’une Array, rien n’est plus simple :
<script type="text/javascript"> "use strict";
let a = Array.from(
Différents types d’Arrays
- 67/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
new Set([23, 53, 56, 59, 60, 31, 87, 97, 72, 51])
).sort();
let sorted=true;
console.log(a);
for(var k=0 ; k < a.length-2 ; )
if(a[k] > a[++k]){
sorted=false;
break;
}
if(!sorted)status="Not";
console.log(status,"Sorted !, pos =",k)
</script>
En bloquant la méthode « . sort » de tri :
<script type="text/javascript"> "use strict";
let a = Array.from(
new Set([23, 53, 56, 59, 60, 31, 87, 97, 72, 51])
)//.sort();
let sorted=true;
console.log(a);
for(var k=0 ; k < a.length-2 ; )
if(a[k] > a[++k]){
sorted=false;
break;
}
if(!sorted)status="Not";
console.log(status,"Sorted !, pos =",k)
</script>
Différents types d’Arrays
- 68/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Le tri d’une Array peut avoir des consequences imprévisibles et catastrophiques :
Une autre façon de faire le tri :
Le petit code ci-dessous cherche s’il y a un nombre dans l’Array de
nombres, qui soit la moyenne de ses voisins. Pour notre cas ici l’Array trié
contient ce nombre à l’indice [0->]2, et c’est le nombre 43.
<script type="text/javascript"> "use strict";
let a = Array.from(
new Set([41, 96, 50, 92, 14, 96, 95, 45, 41, 43])
).sort();
let ok=false;
console.log(a);
for(var k=1 ; k < a.length-2 ; k++){
if(a[k] == ((a[k-1] + a[k+1])/2)){
ok=true;
break;
}
}
if(!ok)status="*!NO!*";
console.log(status,
`neighboring Meaners !, pos = a[${k}] = ${a[k]}`);
console.log(
`( a[${k-1}] {${a[k-1]}} +` +
` a[${k+1}] {${a[k+1]}} ) / 2 = `+
`${(a[k-1] + a[k+1])/2}`);
console.log(a);
</script>
Différents types d’Arrays
- 69/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
En désactivant le tri comme ceci :
let a = Array.from(
new Set([41, 96, 50, 92, 14, 96, 95, 45, 41, 43])
)//.sort();
L’Array ne contient plus de nombre qui soit la moyenne de ses voisins !
Quelques propriétés (et méthodes) de l’objet « Array » :
a =
(2) […]
0: 10
1: 11
length: 2
<prototype>: Array []
<prototype>: []
concat: function concat()
constructor: function Array()
copyWithin: function copyWithin()
entries: function entries()
every: function every()
fill: function fill()
filter: function filter()
find: function find()
findIndex: function findIndex()
flat: function flat()
flatMap: function flatMap()
forEach: function forEach()
Différents types d’Arrays
- 70/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
includes: function includes()
indexOf: function indexOf()
join: function join()
keys: function keys()
lastIndexOf: function lastIndexOf()
length: 0
map: function map()
pop: function pop()
push: function push()
reduce: function reduce()
reduceRight: function reduceRight()
reverse: function reverse()
shift: function shift()
slice: function slice()
some: function some()
sort: function sort()
splice: function splice()
toLocaleString: function toLocaleString()
toSource: function toSource()
toString: function toString()
unshift: function unshift()
values: function values()
Symbol(Symbol.iterator): function values()
Symbol(Symbol.unscopables): Object {
copyWithin: true,
entries: true,
fill: true, …
}
<prototype>: Object { … }
new Array(10,11) = (2) […]
0: 10
1: 11
length: 2
<prototype>: Array []
Comme on l’a vu au commencement, on peut utiliser une Array de
nombres typés.
Différents types d’Arrays
- 71/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Les « Paramètres du reste ».
Voir volume séparé.
Les « Associated Arrays ».
Voir volume séparé.
Les « Maps » et les « Weakmaps »
Voir volume séparé.
Les « Sets » && « Weaksets »
Voir volume séparé.
LES « DICT ionaries » :
En cours de validation.
L’objet ARRAYBUFFER :
Voir volume séparé.
Les STRINGS :
Voir volume séparé.
Les LITTÉRALES DE CHAÎNE :
Voir volume séparé.
L’OBJECT :
Voir volume séparé.
Différents types d’Arrays
- 72/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
Mots-clés :
Arrays typées, ArrayBuffer, Set, String, Typed Array, Array Typée,
Uint8Array, Uint16Array, Uint32Array, Int8Array, Int16Array, Int32Array,
Float32Array, Float64Array, Arrays, Array, slice, subarray, constructeur,
initialiseur, Object literal, littéral d’objet, entries, values, paradigme
DIASOLUKA Nz. Luyalu
Docteur en Médecine, Chirurgie & Accouchements (1977),
CNOM : 0866 - Spécialiste en ophtalmologie (1980)
Études humanités : Scientifique - Mathématiques & Physique.
Informaticien-amateur, Programmeur et WebMaster.
Chercheur indépendant, autonome et autofinancé, bénévole,
sans aucun conflit d’intérêt ou liens d'intérêts ou contrainte
promotionnelle avec qui qu’il soit ou quelqu’organisme ou
institution / organisation que ce soit, étatique, paraétatique
ou privé, industriel ou commercial en relation avec le sujet
présenté.
+243 - 851278216 - 899508675 - 991239212 - 902263541 - 813572818
diasfb@mail2world.com
Autre Lecture :
Différents types d’Arrays
- 73/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
https://www.scribd.com/document/374738470/Le-Plus-Grand-Secret-de-LaCreation
D’autres publications pouvant aussi intéresser :
• https://www.scribd.com/document/377036251/LeDosage-Des-Medicaments-en-Cac-Cas
• https://www.scribd.com/document/377035454/LeHasard-Des-Thermometres-Non-contact-a-Infrarouge
• https://www.scribd.com/document/376222482/PetiteIntroduction-Aux-Fonctions-JavaScript
• https://www.scribd.com/document/376221919/La-Foien-Jesus-Christ-Pour-Quoi-Faire
• https://www.scribd.com/document/375689778/Lacuitevisuelle-angulaire
• https://www.scribd.com/document/375349851/Lavariable-This
•
https://www.scribd.com/document/375024162/FonctionsImbriquees-en-JS
• https://www.scribd.com/document/374789297/FormatInterne-Des-Objets-JavaScript
•
https://www.scribd.com/document/374788758/Iterationsen-JavaScript
• https://www.scribd.com/document/374738470/Le-PlusGrand-Secret-de-La-Creation
• https://www.scribd.com/document/374597969/NouvelleFormule-d-IMC-indice-de-doduite-Selon-Dr-Diasoluka
Différents types d’Arrays
- 74/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
• https://www.scribd.com/document/373847209/PropertyDescriptors
• https://www.scribd.com/document/373833282/l-ObjetGlobal-Window
•
https://www.scribd.com/document/372665249/JavascriptTome-II
• https://www.scribd.com/document/355291488/motiliteoculaire-2
• https://www.scribd.com/document/355291239/motiliteoculaire-I
• https://www.scribd.com/document/355290248/Script-dAnalyses-Des-Reflexes-Pupillomoteurs
•
https://www.scribd.com/document/321168468/Renseigne
ments-Id-et-Anthropometriques
•
https://www.scribd.com/document/320856721/Emission31-Jul-2016
•
https://www.scribd.com/document/318182982/Complicati
on-Visuelle-du-Traitement-de-La-Malaria
• https://www.scribd.com/document/318180637/RapportEntre-Oxymetrie-Et-Type-Respiration
•
https://www.scribd.com/document/315746265/Classificati
on-Des-Medicaments
•
https://www.scribd.com/document/315745909/Incongruen
Différents types d’Arrays
- 75/76 -
samedi, 1. juin 2019 (12:12 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-XXII
ces-Heresies-et-Heterodoxies-de-la-Notion-deLaboratoire
• https://www.scribd.com/document/315745725/RapportEntre-Oxymetrie-Et-Type-Respiration
Différents types d’Arrays
- 76/76 -
samedi, 1. juin 2019 (12:12 )
Téléchargement
Random flashcards
Commune de paris

0 Cartes Edune

Ce que beaucoup devaient savoir

0 Cartes Jule EDOH

découpe grammaticale

0 Cartes Beniani Ilyes

TEST

2 Cartes Enrico Valle

Créer des cartes mémoire