Samenvatting Javascript cheatsheet Web Development II

Hoofdstuk 1: Javascript basics
Script koppelen In HTML: <script src=”…”></script>
 Src = pad naar js bestand
Alert (pop up) alert(‘iets’);
Cijfer afronden tot x cijfers na de iets.toFixed(x);
komma
Grootste en kleinste getal Number.MIN_VALUE || Number.MAX_VALUE
+ en – oneindig Number.POSITIVE_INFINITY ||…
Afronden Math.round(getal);
Max/Min vinden array / lijst van Math.max(getal1, getal2, getal3);
getallen Math.min(getal1, getal2, getal3);
Datum maken Huidige tijd: const date = new Date();
Gekozen tijd: const date = new Date(jaar, maand, dag,
uur, minuut, sec, millisecond);
 Maand is 0-based!!
Uren etc uit datum halen Datum.getHours();
Enhanced for For(let key in myAvatar){…}
Of forof ipv forif
Functie definiëren function functie(par1, par2){…}
Array declareren Let pizzas = [];
Let pizzas = new Array();
Array: verwijder laatste element Pizzas.pop();
Array: voeg waarde toe opt eind Pizzas.push(“iets”);
Array: verwijder eerste waarde en Pizzas.shift();
return ze
Array: voeg waarde toe int begin Pizzas.unshift(“iets”);
Array: verwijder element op positie Delete pizzas[2];
 Returned undefined  Dan zit er een ‘empty’ in
Array: verwijder elementen op positie Pizzas.splice(startIndex, aantalEl);
Array: waarde invoegen Pizzas.splice(4,0, waarde);  waarde invoegen op index4
Array: arrays samenvoegen const array3 = array1.concat(array2);
Array: omkeren Pizzas.reverse();
Array: een stuk uit kopiëren Const array1 =array2.slice(2, 4);
 Array wordt dus niet aangepast  array1 zijn dus waarden met index 2 en 3
Array: sorteren Pizzas.sort(x);
 x is comparator bv x1.year – x2.year
Array: element zoeken Pizzas.indexOf(“margherita”);
 eventueel startend vanaf index
 geeft index weer Pizzas.lastIndexOf(“margherita”);
 -1 indien niet gevonden  Gaat van achter naar voor
Array: als string weergeven Pizzas.join(“-“);
 Met eventueel scheidingsteken
Array: destructuring: 1 kopiëren Const [pizza1, pizza2] = pizzas;  eerste 2 elementen
 Snel elementen uithalen ig Const [, , pizza3] = pizzas  3e element
 Nut: array kopiëren gaat niet adhv
a=b
Array: destructuring: kopiëren Const kopie = […pizzas]; kopie van Pizzas
Const link = pizzas;  hard link!

, Hoofdstuk 2: Objecten en functies
Object declareren Const mijnObject = {};
 Eventueel met attributen Const mijnObject = {
naam: “bob”,
letter: {el1: “A”, el2: “B”}
};
Attributen ophalen Const naam = mijnObject.naam;
 Kan ook functie zijn die je oproept Const letterEl1 = mijnObject.letter.el1;
Attributen toevoegen & invullen mijnObject.leeftijd = 20;
Attributen verwijderen Delete mijnObject.leeftijd;
Object destructuring Const { naam, letter : hoofdletter } = mijnObject;
 Zie ook HT2-ex1-objects vanonder  Variabelen maken met overeenkomende attribuut
v/h object (naam en hoofdletter)
 De waarde v/h attribuut letter wordt in de const
hoofdletter gestopt
Object overlopen For(let key in mijnObject){
 Voor elk attribuut in object Console.log(key: mijnObject[key]);
};
 naam: bob …
Alle keys in een array steken Let arr = Object.keys(mijnObject);
Functie toevoegen als attribuut mijnObject.functie = function (par1){…};
Functie met onbeperkt/ onbepaald Function functie(par1, par2, …etc){…};
aantal parameters  de parameter “etc” kan je dan bijvoorbeeld overlopen
me ne forof, foreach, …
 in combinatie met array  function functie(par1, par2, …[a,b,c,d]){…};
destructuring o zo kunde makkelijk aan de 4 eerste waarden
Arrowfunctie Function functie(par1, par2){…};
 bv in const functie steken  const functie = (par1, par2) => {…};
 uitvoeren moet met () achter!
Event op een element uit de html Const element = document.getElementById(‘id’);
 hover  element.onmouseover = () => {…};
 kan ook met eventhandler zie  element.onclick = () => {…};
verder  onload, …
Exceptie gooien & vangen try {
throw {
name: 'SomethingWentWrongError',
message: 'Something went wrong. You should fix it'
};
} catch (e) {
console.log(`Error ${e.name}: ${e.message}`);
} finally {…}

Of

Throw Error(‘rip’);