JavaScript_Basics(constantly updated)

A flexible language that powers dynamic websites and apps

Variables

Dynamic websites need to remember information to display or change. For that, JavaScript has variables
Like moving boxes, variables have content and names that tell us what’s inside


Variable types

  • number:
    • variable type that stores number
  • string:
    • variable type that stores a series of char
    • can be recognized with the two double quotes, between which any symbol can stay
    • Eg: "ajjef91239mca dsjfjja03"
  • boolean:
    • stores the result of comparison
    • true
    • false
  • var thisIsAVariable
  • var name="Samuel";
    • variable name - name
    • Variable value - “Samuel”
      • “Samuel” is a string
    • A statement ends with semicolon ;
  • var time = 5;
    • 5 is a number, not a string : since there’s no “ “
  • var lighton = true
  • var finishedHW = false

Instruction

With special instruction console.log(), we tell the computer to display a value in an area called the console.

  • console.log("Hello World");
    When we display variables in the console, their values appear instead of their names. If we log name here, it’ll show its value.

Arithmetic operations are supported with numbers:

  • + plus
  • - minus
  • * multiply
  • / divides

joining operator: +
+ when + is used between two numbers, the result will be their sum
+ when + is used between two strings, the result will be the joining of the string
+ "name:" + " Samuel" -> "name: Samuel"
+ when + is used between a string and a number, the number will be automatically transformed into a string
+ "age: " + 8 -> "age: 8"
+ when + is used between a string and a boolean, the boolean will be automatically transformed into a string
+ "Passed": + true -> "passed: true"

Using Variables

Variables are called variables because the values they store can change

Use the = sign to change the value in status from "Watching Netflix" to "Playing frisbee"
1
2
3
var currentStatus = "Watching Netflix";
currentStatus = "Playing frisbee";
console.log(currentStatus);

Comparing operators

All comparison statements returns a boolean value

  • ===
    • this is used to check whether two variables are equal
      • variables can be of type string or number
    • 1===2 returns false
    • "apple"==="apple" returns true
  • !==
    • this is used to check whether two variables are not equal
    • 1!==2 returns true
  • >
    • this is used to check whether a variable is larger than another variable
    • 1>2 returns false
  • <
    • this is used to check whether a variable is smaller than another variable
    • 1<2 returns true
  • <=
    • this is used to check whether a variable is smaller or equal than another variable
    • 1<=2 returns true
    • 1<=1 returns true
  • >= this is used to check whether a variable is larger or equal than another variable
    • 1>=2 returns false

If/else statement

How can we write code that adapts to different situations? By using the if statement.

Structure:

1
2
3
4
5
6
7
8
9
10
11
12
13
if(condition){//place a boolean value in the bracket
//statement1
}
else{
//statement2
}
This is equivalent to:
if(condition){
//statement1
}
if(!condition){//negating the condition
//statement2
}

Properties:

  • The if statement runs code only if the boolean it’s relying on is true. It’s like saying, of something is true, then do this.
  • We use false instead to skip the code inside the curly braces.
  • The else statement doesn’t need its own condition. That’s because it handles the cases where the if’s condition false

Definitions:

  • Values like true that are placed inside the parenthesis are called conditions.

    • These can be:
    • true
    • false
    • comparison of variables
      • a === b
      • a !=== b
      • a < b
      • a <= b
      • a > b
      • a >= b
  • Statements relying on conditions are called conditionals.

Incorporating else if

1
2
3
4
5
6
7
8
9
10
var age = 10;
if (age < 16){
console.log("children")
}
else if(age < 65){
console.log("working population")
}
else{
console.log("elderly")
}

Properties:

  • As long as they go before the else statement, we can add as many else if statement as we’d like