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