Conditions

Conditions in Javascript hebben de volgende blueprint:

if (condition) {
    //do something
}

Bijvoorbeeld:

const grade = 15;

if (grade >= 10) {
    console.log("Passing grade");
}

Advanced If

Soms is het niet nodig om else te gebruiken.

Bijvoorbeeld:

function canVote(age) {
    if (age >= 18) {
        return true;
    }
    return false;
}

Als het resultaat voldoet aan de condition wordt true teruggegeven en stopt de functie. Als het resultaat niét aan de condition voldoet dan wordt alleen het stukje return false; teruggegeven.

• When you have an if/else condition that returns two different results, it is possible to drop the else keyword.
• Always use triple equal === when comparing 2 values in JavaScript.

Returning Booleans

• When you're returning a boolean from a function, you can simplify your code by returning the boolean expression directly, without using an if statement.

Bijvoorbeeld:

• In plaats van:

function isPassing(grade) {
    if (grade >= 10) {
        return true;
    } else {
        return false;
    }
}

isPassing(12);

• Schrijf je alleen:

function isPassing(grade) {
    return grade >= 10;
}

Dit is omdat grade >= 10 op zichzelf al true of false teruggeeft, afhankelijk van de grade. Je hoeft het dan niet nog in een if/else statement te schrijven.

Even & Odd

// even numbers
4 % 2 // 0
6 % 2 // 0
8 % 2 // 0
10 % 2 // 0

// odd numbers
3 % 2 // 1
5 % 2 // 1
7 % 2 // 1
9 % 2 // 1

Bij de even getallen is de division remainder altijd 0, en bij de oneven getallen 1.

Je kan ook hier een if condition gebruiken om te weten te komen of een getal even of oneven is.

The ternary operator

Korte if conditions kunnen soms geschreven worden met de ternary operator. Dit is een kortere manier om een if...else statement te schrijven.

Bijvoorbeeld:

• In plaats van:

function evenOrOdd(number) {
    if (number % 2 === 0) {
        return "even";
    }
    return "odd";
}

• Schrijf je:

function evenOrOdd(number) {
    return (number % 2 === 0) ? "even" : "odd";
}

Syntax:

condition ? expressionWhenTrue : expressionWhenFalse

Het wordt afgeraden deze te gebruiken, omdat het je code een stuk onleesbaarder maakt.

Arrays I

Arrays

Arrays in Javascript geven de mogelijkheid om meerdere elementen in dezelfde variabele op te slaan. Dit kunnen numbers, strings, booleans, arrays, objects en nog veel meer zijn. Deze kunnen mixed zijn in dezelfde array.

Bijvoorbeeld:

const users = []; // empty array
const grades = [10, 8, 13, 15]; // array of numbers
const attendees = ["Sam", "Alex"]; // array of strings
const values = [10, false, "John"]; // mixed

.length property

Je kan het aantal elementen in een array krijgen met de .length property.

Bijvoorbeeld:

[].length; // 0

const grades = [10, 8, 13, 15];
grades.length; // 4

.length is een property en geen fucntie. Daarom staat er geen () achter.

Get element by index

Vergelijkbaar met strings, kun je een element uit een array krijgen door de vierkante haak syntax [] te gebruiken met de index vanaf 0.

Bijvoorbeeld:

const users = ["Sam", "Alex", "Charley"];
users[1]; //"Alex"

Je kan ook de .at(index) gebruiken, die de negatieve getallen accepteerd en het dus makkelijker maakt om het laatste element van een array te vinden. Negatieve getallen tellen terug vanaf het laatste element in de array.

Bijvoorbeeld:

const users = ["Sam", "Alex", "Charley", "Blane", "Crane"];
users.at(0); //"Sam"
users.at(1); //"Alex"
users.at(-2); //"Blane"
users.at(-1); //"Crane"

Adding an element

Je kan een element toevoegen door de .push() method te gebruiken.

Bijvoorbeeld:

const numbers = [10, 8, 13, 15];
numbers.push(20); // returns 5 (the new length of the array)
console.log(numbers); // [10, 8, 13, 15, 20];

Warning: Array.push() returns the new length of the array.

numbers.push(20) geeft 5 terug, de lengte van de array. Dit is vaak verwarrend voor developers. .push() voegt een nieuw item toe aan de array maar geeft ook de nieuwe lengte terug van de array.

Arrays & const

Ook al waren de variabele numbers defined met const, konden we alsnog nieuwe data toe voegen. Dat is omdat const betekent dat je alleen de variabele kan toekennen wanneer het defined wordt. Maar dat betekent niet dat de variabele onveranderlijk is. De content kan wel veranderen.

Het voordeel is dat wanneer je het defined als een array, het altijd een array zal blijven wat betekent dat je veilig array methods erop kan toepassen. De array content kan veranderen.

Bijvoorbeeld:

const numbers = []; // start with empty array
numbers.push(10); // returns 1 (new length of array)
console.log(numbers); // [10] (still an array but content changed)
numbers.push(20); // returns 2 (new length of array)
console.log(numbers); // [10, 20] (still an array but content changed)