Home JavaScript (ES6) ES6 jQuery JQ Exercises EX

JavaScript (ES6)

Basic syntax

Data types
var vs let

Debugging

Console

DOM manipulation

querySelector()
Loop over NodeList
Modify content
Modify attributes
Data-* attributes
Modify classes
Modify styles
Modify elements

Event listeners

Mouse events (version 1)
Mouse events (version 2)
Window events
Event bubbling
Prevent default action
Dispatch (trigger) event
NodeList events

Operators

Arithmetic operators
Assignment operators
Comparison operators
Logical operators

Control structures

Example: score JavaScript (if - else if)
Example: score JavaScript (switch)
Example: draw blocks (for - while - do while)
Example: color blocks (forEach)

String object

Example: form validation
Example: replace words

Number object

Parse numeric input fields

Math object

Example: cylinder volume
Example: roll the dice

Date object

Example: days before Christmas (native version)
Example: days before Christmas (luxon.js)

Timing functions

Example: analog + digital Clock
Example: reaction test

Arrow functions

this keyword

Object literals

Example: object literal
Example: campus map
Example: geolocation API

Array object

Map methode
Filter methode
Example: bingo
Example: change circle background

Classes

Basic User class
Example: campuses Thomas More Kempen

Local storage

Example: login form
Example: shopping list

Fetch API

GET
POST
PATCH/PUT
DELETE
Error handling
Example: fetch images
Example: fetch movie info
Example: Belgian railway time schedules

Promises

Calculator:
Run promises in parallel
Example: karaoke
Example: random words

Async/Await

Example: calculator
Example: karaoke
Example: random words
Example: fetch images
Example: fetch movie info
Example: Belgian railway time schedules

Webdesign Advanced - IT Factory
Thomas More Kempen - © 2025