Day 36 - 11/10

Plan:

Learning Js:

• If else

• Switch

• Loop

• BreaBreak/

• Iterables

• Sets

• Maps

• Type conversion

• ...

Converting webpage to html/css: https://arena-zeexo-simple.myshopify.com/?fts=0#

Progress:

Switch

switch(expression) { case x: // code block break; case y: // code block break; default: // code block }

• break: break out of the switch

• default: the code will be automatically run when no case match; can be anywhere in switch block

• This will make case 4 and 5 share the same code:

case 4:

case 5:

text = "Soon it is Weekend";

break;

• If multiple cases matches a case value, the first case is selected.

• If no default label is found, the program continues to the statement(s) after the switch.

• The values must be of the same type to match the cases.

Loops

for (expression 1; expression 2; expression 3) { // code block to be executed }

• expression 1: can initiate many values in expression 1

for (let i = 0, len = cars.length, text = ""; i < len; i++) {

text += cars[i] + "<br>";

}

• can omit expression 1 when the values are set before the loop

• If omit expression 2, must provide a break inside the loop.

For-in Loop

Loops through the properties of an Object and Array:

const person = {fname:"John", lname:"Doe", age:25};

let text = "";

for (let x in person) {

text += person[x];

}

For each Loop

.forEach() : Call a function once for each array element

For of Loop

Loops through the values of an iterable object

for (let x of language) {

text += x;

}

While

• do - while: always execute the code once before checking the condition

Break

• break; : break out of the block

• continue; : skip one iteration in the loop

Sets

Set is a collection of unique values, each value appear once

• new Set()

const letters = new Set(["a","b","c"]);

• .add() : add element to the tail; if equal elements are added, only the first one kept

• delete(): remove an element

• .has() : return true if an element exist

• .forEach()

• .values() : Return an iterator with all the values

• size

Map

A Map holds key-value pairs where the keys can be any datatype.

Create map

• new Map([ ]); : pass an array to map

• map.set(key, value) : create a map and set new pair of value

const fruits = new Map();

fruits.set("apples", 500);

Method

• .set(key, value); : can be used to add value, and change existing value

• .get(key); : get the value of a key

• .size; : return the number of element in a map

• .delete(key); : remove a map element

• .has(key); : check if a key exist

• .entries(): returns an iterator object

Type of

• Undefined and Null are equal in value but different in type

• (A instanceof B); : check if object A is an instance of object B

• :void()

Type conversion

String to Number

• Number() : convert a variable (or a value) into a number

• parseFloat() : Parses a string and returns a floating point number

• parseInt() : Parses a string and returns an integer

• '+' operator: the variable cant be converted will have type Number but value NaN

let y = "5";

let x = + y;

Number to String

• String(x)

• x.toString()

• toExponential(): Returns a string, with a number rounded and written using exponential notation

• toFixed() : Returns a string, with a number rounded and written with a specified number of decimals.

• toPrecision() : Returns a string, with a number written with a specified length

Date to Number

• Number(d)

• d.getTime()

Date to String

• String(x)

• x.toString()

• date methods

Boolean to Number

• Number()

Boolean to String

• String(b)

• b.toString()

Automatic String Conversion

When output an object or variable, toString() will be automatically called