#JS-Fundamental  #Javascript 

Variable declaration in JS

  • let
    • It has a block-scope
  • const
    • Used for unchanging variable
    • This can’t be re-defined
  • var
    • No block-scope
    • var variables are either function-wide or global
    • they are visible through blocks.
  • let and const basically replace var.
  • var should not be used anymore

Variables (var, let, const) declaration

  • Variables names can contains –> letters, numbers, _, $
    • Cannot start with –> number
  • Reserve keywords, name –> should not be used as variable name

VAR

var name = 'John Doe';
var greeting;
console.log(greeting, name);
// undefined "John Doe" 

greeting = 'Hello';
console.log(greeting); 
// "Hello"

var greeting;
console.log(greeting); 
// "Hello"

LET

let name2;
name2 = 'John Doe';
console.log(name2);
// "John Doe"

let user = 'John', age = 25, message = 'Hello';
console.log(age)
// 25

let person2 = {
  name4: 'John'
}
person2.age = 40
console.log(person2)
/*[object Object] {
  age: 40,
  name4: "John"
}*/
console.log(person2.age)
// 40

CONST

  • CONST variable can’t be re-assigned
  • CONST variable declare and initialize at the same time, else error
const name3 = 'John';
console.log(name3);
// name3 = 'Sara'; // Error

// const greeting2; // Error
  • In below example
    • person and numbers are referene type variable
    • They only store only the address of the object
    • So, you can chage the inner value but can’t change the complete object
const person = {
    name4: 'John',
}
person.name4 = 'Sara'; // possible

const numbers = [1,2,3,4,5];
numbers.push(6);  //possible

// not possible to reassign
// numbers=[1,2,3,4,5]

Hoisting concept

// "ReferenceError: `Cannot access 'name' before initialization`
name = 'John';
let name;

// No Error
myVal = 20;
var myVar;

// ReferenceError
console.log(var1); 
let var1 = 20;

// undefined --> No Error
console.log(var2); 
var var2 = 20;

Issue with var

  • Can be initialize before it is declared
    • Take undefined as default
  • No declaration takes as var
    • someValue = 10;
    • var is added with someValue
  • Re-declaration of same variable is possible
    • var someVal = 10;
    • var someVal = 20; // No Error
  • var is always global

Strict mode

  • Use 'use strict'; at top of your JS file
  • Activating Strict Mode
  • It disable some behaviours
    • You can not use undeclared variables
    • Deleting a variable (or object) is not allowed.
    • Keywords reserved for future JavaScript versions can NOT be used
x1 = 3.14; // Error

let x2 = 3.14;
delete x3; // Error

const interface = 'Audio'; // Error

Scope for let, var and const

A local variable (i.e. created in a function) which also exists as a global variable is a “shadowed variable”.

// let, const -->  block scope 
// var --> fxn scope 

// Global Scope
var a = 1;
let b = 2;
const c = 3;

(function(){
    console.log(a,b,c);
}());
// 1 2 3

// Function Scope
(function(){
  // Shadowed Variables
  var a = 4;
  let b = 5;
  const c = 6;
  console.log('Function Scope: ', a, b, c);
}());
// 4 5 6

console.log(a,b,c)
// 1 2 3

// Block Scope
if(true) {
  var a = 4;  // changes global
  let b = 5;  // not change global
  const c = 6;  // not change global
  console.log('If Scope: ', a, b, c);
}
// 4 5 6

console.log('Global Scope: ', a, b, c);
// 4 2 3
  • Multi word variables naming var firstname;
var firstname;
var firstName = 'John'; // Camel case
var first_name = 'Sara'; // Underscore (Not recommended)
var FirstName = 'Tom'; // Pascal case (Not recommended)

If-else in JS

  • Nested if-else
//and  "AND, &&" operator
const name1 = 'Steve';
const age = 70;

if(age > 0 && age < 12){
  console.log(`${name1} is a child`);
} else if(age >= 13 && age <= 19){
  console.log(`${name1} is a teenager`);
} else {
  console.log(`${name1} is an adult`);
}

Switch case

let age = 4
// default

let age = 3
// 3rd No Default

let age = 1
// 1st No

switch (age) {
    case 0:
    case 1:
        console.log("1st No");
        break;
        // break doesn't allow to go further
    case 2:
        console.log("2nd No");
    case 3:
        console.log("3rd No");
    default:
        console.log("Default");
        break;
}

Reference