Week 2: JavaScript variables, data types and operators

• JavaScript
• MBO
• Studiejaar 2

Terugblik

<script>

let js = 'amazing';

if (js == 'amazing') alert('JavaScript is FUN!');

40+8+23-10;

console.log(40+8+23-10);

</script>

Doel van deze les

• Aan het einde van de les heb jij verschillende data types toegepast. De data types die behandeld worden zijn:
• Numbers
•  String
• Boolean
• Undefinied
• Null
• Symbol
• BigInt
• Aan het einde van de les worden operators door jou gebruikt in combinatie met de bovenstaande data types. De volgorde waarin de verschillende operators weet jij nu te onderbouwen.
• Aan het einde van de les heb jij variables en values gebruikt om verschillende data types aan te maken en simpele rekensommen te maken.

Create a variable

De 'let' keyword gebruiken bij het aanmaken van een variabele.

Voorbeeld:

let country = "The Netherlands";

Printing variables

Voor het printen van variables in de console gebruiken wij het volgende.

Voorbeeld:

let country = "The Netherlands";

console.log(country);

More about variables

Some keywords are reserved in JS such as function.

This means you cant use that as a name for your variable. However when you really need to, you can use a dollar sign before the name.

Voorbeeld:

$function

Data types

Er zijn verschillende data types in JavaScript.

Jullie kennen er al een paar.

Laten wij dat hier sommeren met wat voorbeelden.

Data types: Numbers

Number: Floating point numbers 👉🏼 used for decimals and integers.

Voorbeeld:

let age = 23;

Data types: String

String: Sequence of characters 👉🏼 used for text.

Voorbeeld:

let firstName = 'Taif Rahim';

Data types: Boolean

Boolean: Logical type that can only be true or false 👉🏼 used for taking descisions.

Voorbeeld:

let teacher = true;

Data types: Undefined

Undefined: Value taken by a variable that is not yet defined.

Voorbeeld:

let students;

Data types: Null

Null: Also means empty value.

Data types: Symbol(ES2015)

Symbol: Value that is unique and cannot be changed. (Nu nog niet nuttig)

Data types: BigInt(ES2020)

BigInt: Large integers than the Number type can hold.

Comments

Comments can be used as followed:

// documenting code is important

or multiline comment

/*

let someVariable = 'example'

*/

Minus operator

const ageTaif = 2050 - 1989;

const ageSam = 2050 - 2011;

console.log(ageTaif, ageSam);

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Multiply, devide and power operator

const ageTaif = 2050 - 1989;

console.log(ageTaif * 2, ageTaif / 10, 2 ** 3);

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Power operator

const ageTaif = 2050 - 1989;

console.log(ageTaif * 2, ageTaif / 10, 2 ** 3);

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Plus operator

const firstName = 'Taif';

const lastName = 'Rahim';

console.log(firstName + ' ' + lastName);

let x = 10 + 5;

console.log(x);

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Assingment operators

let x = 15;

x += 10;

x *= 4;

x++;

x--;

console.log(x);

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Comparison operators

console.log(ageTaif > ageSam);

meer comparison operators:

>, <, >=, <=

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Maak een comparison of ageSam groter of gelijk is aan 18

const isFullAge = ageSam >= 18;

moet het antwoord zijn.

Order of comparisons

console.log(now - 1989 > now - 2011);

JavaScript weet dat hij eerst beide getallen moet hebben voor hij het gaat vergelijken. Wij behandelen dit in de volgende les.

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Order of comparisons

JS volgt de aanwijzingen op mozilla developers network.

Hier staat een tabel met de precedence voor de verschillende operators.

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

developer.mozilla.org

Voorbeeld

let x, y

x = y = 25 - 10 - 5;

Wat is x? (hint, kijk naar het tabel!)

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Voorbeeld

const now = 2021;

ageTaif = now - 1989;

ageLulu = now - 1994;

averageAge = ageTaif + ageLulu / 2;

Wat valt je op aan de bovenstaande gemiddelde berekening?

Wij zijn de haakjes vergeten!

Hier const keyword introduceren en vertellen dat 2050 een variabele kan worden omdat het vaker terugkomt. Maak 'now' variabele hiervoor aan.

Code challenge

Plak je code hier