04b. Arrays - xarling/ES6-workshop GitHub Wiki
Array.from
Met deze methode kun je array-like objecten zoals arguments
of output van DOM queries, maar ook iterable objects zoals Map
en Set
converteren naar echte Array objecten.
Syntax:
Array.from(arrayLike[, mapFn[, thisArg]])
Voorbeelden:
// Array-like object (arguments) to Array
function f() {
return Array.from(arguments);
}
f(1, 2, 3);
// [1, 2, 3]
// Any iterable object...
// Set
var s = new Set(["foo", window]);
Array.from(s);
// ["foo", window]
// Map
var m = new Map([1, 2], [2, 4], [4, 8](/xarling/ES6-workshop/wiki/1,-2],-[2,-4],-[4,-8));
Array.from(m);
// [1, 2], [2, 4], [4, 8](/xarling/ES6-workshop/wiki/1,-2],-[2,-4],-[4,-8)
// String
Array.from("foo");
// ["f", "o", "o"]
// Using an arrow function as the map function to
// manipulate the elements
Array.from([1, 2, 3], x => x + x);
// [2, 4, 6]
// Generate a sequence of numbers
Array.from({length: 5}, (v, k) => k);
// [0, 1, 2, 3, 4]
Array.of
Maakt een array van alle argumenten die meegegeven worden.
var mijnArray = Array.of(1, '2', 3, {4: '4'})
// [1, '2', 3, {4: '4'}]
// mijnArray.length === 4; true
Toevoegingen aan Array.prototype
Array.prototype.copyWithin
Syntax:
arr.copyWithin(target, start = 0[, end = this.length])
Voorbeeld:
// Array.prototype.copyWithin
[1, 2, 3, 4, 5].copyWithin(0, 3);
// [4, 5, 3, 4, 5]
[1, 2, 3, 4, 5].copyWithin(0, 3, 4);
// [4, 2, 3, 4, 5]
[1, 2, 3, 4, 5].copyWithin(0, -2, -1);
// [4, 2, 3, 4, 5]
Opdracht
Beredeneer wat .copyWithin
doet op basis van bovenstaande voorbeelden.
Array.prototype.fill
Syntax
arr.fill(value[, start = 0[, end = this.length]])
Vult een array met de opgegeven value. Optioneel zijn de start en end posities.
// Array.prototype.fill
[1,2,3,4,5,6,7,8,9].fill(9)
// [9,9,9,9,9,9,9,9,9]
[1,2,3,4,5,6,7,8,9].fill(9,3)
// [1,2,3,9,9,9,9,9,9]
[1,2,3,4,5,6,7,8,9].fill(9,2,4)
// [1,2,9,9,5,6,7,8,9]
Array.prototype.find
Syntax
arr.find(callback[, thisArg])
Returnt het eerste item uit de array dat een 'true' oplevert voor de callback-functie
// Array.prototype.find
[1,2,3,4,5,6,7,8,9].find(x => x > 6)
// 7
#Array.prototype.findIndex Syntax
arr.findIndex(callback[, thisArg])
Returnt de index van het eerste item uit de array dat een 'true' oplevert voor de callback-functie
// Array.prototype.findIndex
console.log([4,3,9,1,2,5,6,8,7].findIndex(x => x > 6));
// 2
#Array.prototype.entries Levert een Array Iterator object op met alle key/value pairs voor elke index in de array
// ES6
var arr=[4,3,2,1]
var entries = arr.entries();
console.log(entries.next().value); // [0,4]
console.log(entries.next().value); // [1,3]
console.log(entries.next().value); // [2,2]
console.log(entries.next().value); // [3,1]
console.log(entries.next().value); // undefined
#Array.prototype.keys Levert een Array Iterator object op met alle keys van de array
// ES6
var arr=[4,3,2,1]
var entries = arr.keys();
console.log(entries.next().value); // 0
console.log(entries.next().value); // 1
console.log(entries.next().value); // 2
console.log(entries.next().value); // 3
console.log(entries.next().value); // undefined
#Array.prototype.values Levert een Array Iterator object op met alle values van de array
// ES6
var arr=[4,3,2,1]
var entries = arr.values();
console.log(entries.next().value); // 4
console.log(entries.next().value); // 3
console.log(entries.next().value); // 2
console.log(entries.next().value); // 1
console.log(entries.next().value); // undefined
Opdracht
Zie \04b.arrays\arrays-findIndex.html voor de opdracht