# Week 1

# Triangle

Maak een bestand triangle.js aan in de reeds aangemaakt folder week-1.

Genereer een driehoek op basis van de breedte (variable b) en de hoogte (variable h). De waarde van de hoogte is gelijk aan de waarde van de breedte. Specificeer ook het het teken dat gebruikt wordt de rechthoek op te vullen – in dit voorbeeld is het een asterisk (*). Specificeer ook het teken dat gebruikt wordt als separator tussen de kolommen – in dit voorbeeld een spatie ().

Tip

Gebruik een for-lus

Resultaat

*  *  *  *  *  *  *  *  *  *  *
*  *  *  *  *  *  *  *  *  *
*  *  *  *  *  *  *  *  *
*  *  *  *  *  *  *  *
*  *  *  *  *  *  *
*  *  *  *  *  *
*  *  *  *  *
*  *  *  *
*  *  *
*  *
*

# Triangle reverse

Maak een bestand triangle_reverse.js aan in de reeds aangemaakt folder week-1.

Genereer een omgekeerde driehoek op basis van de breedte (variable b) en de hoogte (variable h). De waarde van de hoogte is gelijk aan de waarde van de breedte. Specificeer ook het het teken dat gebruikt wordt de rechthoek op te vullen – in dit voorbeeld is het een asterisk (*). Specificeer ook het teken dat gebruikt wordt als separator tussen de kolommen – in dit voorbeeld een spatie ().

Tip

Gebruik een for-lus

Resultaat

*
*  *
*  *  *
*  *  *  *
*  *  *  *  *
*  *  *  *  *  *
*  *  *  *  *  *  *
*  *  *  *  *  *  *  *
*  *  *  *  *  *  *  *  *
*  *  *  *  *  *  *  *  *  *
*  *  *  *  *  *  *  *  *  *  *

# Border rectangle

Maak een bestand border_rectangle.js aan in de reeds aangemaakt folder week-1.

Genereer een lege rechthoek met enkel een zichtbare border op basis van het aantal kolommen (variable nCols) en het aantal rijen (variable nRows).

Tip

Gebruik een for-lus
Gebruik het conditionele statement if … else if … else
Gebruik optioneel de ternary operator (conditie) ? value1 : value2

Resultaat

*  *  *  *  *  *  *  *
*                    *
*                    *
*  *  *  *  *  *  *  *

# Switch

Maak een bestand switch.js aan in de reeds aangemaakt folder week-1.

Genereer een lege rechthoek met enkel een zichtbare border op basis van het aantal kolommen (variable nCols) en het aantal rijen (variable nRows). Vul vanaf het midden (Y-as) alle posities met het opgegeven teken.

Tip

Gebruik een for-lus
Gebruik het conditionele statement if…else if…else
Gebruik optioneel de ternary operator (conditie) ? value1 : value2

Resultaat

*  *  *  *
*        *
*        *
*        *
*  *  *  *
*  *  *  *
*  *  *  *
*  *  *  *

# Close square

Maak een bestand close_square.js aan in de reeds aangemaakt folder week-1.

Genereer een leeg vierkant met enkel een zichtbare border op basis van een gelijk aantal kolommen (variable nCols) en rijen (variable nRows). In het vierkant geven we een kruis weer gelijkaardig met een sluitknop. Het aantal rijen en kolommen zijn steeds oneven.

Tip

Gebruik een for-lus
Gebruik het conditionele statement if … else if … else
Gebruik optioneel de ternary operator (conditie) ? value1 : value2
De oplossing moet enkel werken voor een vierkant (nRows === nCols)

Resultaat

*  *  *  *  *  *  *
*  *           *  *
*     *     *     *
*        *        *
*     *     *     *
*  *           *  *
*  *  *  *  *  *  *

# Credit card validator

Valideer een credit card met de volgende restricties

Nummer moet bestaan uit 16 digits, allemaal getallen.
Tenminste twee getallen moeten verschillend zijn.
De laatste digit moet een even getal zijn.
De som van de digits moet groter zijn dan 16.

Stappenplan:

Maak een bestand credit_card_validator.js aan in de reeds aangemaakt folder week-1.
Schrijf een functie genaamd verifyCreditCardNumber dat:
- 1 argument bevat: credit card nummer
- functie geeft de waarde true of false terug

Tip

Gebruik methode for ... of (opens new window) uit een array
Met de methode split (opens new window) kunnen we een string converteren naar een array op basis van het splitsen of splijten op een opgegeven teken
Met de methode isNaN (opens new window) kunnen we nagaan of een waarde gelijk is aan NaN of niet
Gebruik de functieparseInt om een een string te converteren naar een geheel getal

# Scrambled text

Met deze applicatie veranderen we de positie van tekens in een string, bijv. webmaster wordt sreabewmt.

Stappenplan:

Maak een bestand scrambled_text.js aan in de reeds aangemaakt folder week-1.
Schrijf een functie genaamd scrambleText dat:
- 1 argument bevat: de tekst die herschikt zal worden
- geeft herschikte text terug

Voorbeeld

The word "website" scrambled is "webstie"
The word "webdevelopment" scrambled is "eepwmovnbeeltd"
The word "programming" scrambled is "mprigagmorn"

# Globally Unique Identifier (GUID)

Deze applicatie genereert paswoorden, bijv.: A26dY26zQ.

Maak een bestand guid.js aan in de reeds aangemaakt folder week-1.
Schrijf een functie genaamd generateGUID dat:
- 1 argument bevat: het aantal tekens dat het paswoord moet bevatten
- geeft het gegenereerd paswoord terug (string)
Roep deze functie 2 keer aan, steeds met een andere waarde voor het argument
Log het resultaat van elke aanroep naar de console.

Tip

# Sorting array of objects

Schrijf een JavaScript programma waarmee een array van objecten gesorteerd (opens new window) kan worden op een bepaalde eigenschap (property) van het object.

Gegeven volgende array:

const library = [
  {
    title: "The Road Ahead",
    author: "Bill Gates",
    libraryID: 1254,
  },
  {
    title: "Gem Squash Tokoloshe",
    author: "Zadok Rachel",
    libraryID: 3245,
  },
  {
    title: "Walter Isaacson",
    author: "Steve Jobs",
    libraryID: 4264,
  },
];

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

Sorteer de array
1. alfabetisch op de eigenschap author. Output het resultaat – de gesorteerde array – naar de console.
2. omgekeerd alfabetisch (Eng. reverse alphabetical) op de eigenschap author. Output het resultaat (de gesorteerde array) naar de console.
3. oplopend op libraryID. Output het resultaat (de gesorteerde array) naar de console.
4. aflopend op libraryID. Output het resultaat (de gesorteerde array) naar de console.

Tip

Maak voor het alfabetisch sorteren van strings gebruik van de methode String.prototype.localeCompare() (opens new window)

Voorbeeld Output

---Alfabetisch sorteren----
[
  { title: 'The Road Ahead', author: 'Bill Gates', libraryID: 1254 },
  { title: 'Walter Isaacson', author: 'Steve Jobs', libraryID: 4264 },
  {
    title: 'Gem Squash Tokoloshe',
    author: 'Zadok Rachel',
    libraryID: 3245
  }
]
---Omgkeerd alfabetisch sorteren----
[
  {
    title: 'Gem Squash Tokoloshe',
    author: 'Zadok Rachel',
    libraryID: 3245
  },
  { title: 'Walter Isaacson', author: 'Steve Jobs', libraryID: 4264 },
  { title: 'The Road Ahead', author: 'Bill Gates', libraryID: 1254 }
]
---Sorteren op getallen (libraryID)----
[
  { title: 'The Road Ahead', author: 'Bill Gates', libraryID: 1254 },
  {
    title: 'Gem Squash Tokoloshe',
    author: 'Zadok Rachel',
    libraryID: 3245
  },
  { title: 'Walter Isaacson', author: 'Steve Jobs', libraryID: 4264 }
]
---Omgkeerd sorteren op getallen (libraryID)----
[
  { title: 'Walter Isaacson', author: 'Steve Jobs', libraryID: 4264 },
  {
    title: 'Gem Squash Tokoloshe',
    author: 'Zadok Rachel',
    libraryID: 3245
  },
  { title: 'The Road Ahead', author: 'Bill Gates', libraryID: 1254 }
]

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

# Digital clock is ticking

Maak een bestand digital_clock_ticking.js aan in de reeds aangemaakt folder week-1.

In deze applicatie maken we een digitale clock die tikt. Gebruik de ingebouwde setInterval() (opens new window) methode met een delay van 1000 milliseconden.

Stappenplan:

Beschrijf een functie generateDigitalClockUTCAsString() met:
- 1 parameter utc waarin we de tijdszone specifieren
- 1 parameter cityName waarin we de naam van de stad specifieren
- geeft de string representatie van de tijd terug bijv. 17:53:45
Beschrijf een functie ticking() waaring we de klok laten tikken. Deze functie wordt aangeroepen in de setInterval() methode.

Voorbeeld

The time in Ghent is 18:23:21
The time in Ghent is 18:23:22
The time in Ghent is 18:23:24
The time in Ghent is 18:23:25
The time in Ghent is 18:23:26
The time in Ghent is 18:23:27
The time in Ghent is 18:23:28

Week 2