Nanthini Ammu

Posted on Apr 2

Java Script Variables and Data Types

#webdev #javascript #beginners #tutorial

Variables:

Variables are containers for storing data values.
Variables must be defined with unique names.
Variable name can contain Letters (a–z, A–Z), Digits (0–9), Underscore _, and Dollar sign $.
Variable name can't start with number.
Javascript is case sensitive.So let name and let Name both are different variables.
Don't use reserved keywords for variable names.
Use camelCase. Ex userName , totalAmount.
For contstant variables ise upper_case.Ex const MAX_LIMIT = 100;
For boolean use is or has. Ex isLoggedIn,hasPermission.

Data Types :

Primitive data types:

String : Text wrpped in quotes.
Number : Integers and Decimals.
BigInt : Used for integers larger than the safe limit of the Number type. Created by appending n to an integer
Boolean : Yes or No.
Undefined : Variable declared but value not yet assigned.
Null : empty.

Symbol :

Non Primitive data types:

Object, Array, Functions, Dates, RegExp.

How to declare variables:

JS has 3 keywords.
- var(old way – avoid),let(modern & recommended) and constconstant – cannot change.

Direct Assignment :
let city = "Chennai";

Declare first, assign later :

let country;
country = "India";

Reassign value :

let score = 10;
score = 20;

What is Scope?

Scope defines where a variable can be accessed in the code.
There are mainly 2 types. Function Scope(Function Level) and Block Scope(Block Level).

What is Block Level ?

A block is anything inside { } like if condition,loop, and function.
let and const follow block scope.

if (true) {
  let y = 20;
  console.log(y); // Works
}

console.log(y); // Error

What is Function Level?

A variable declared inside a function can be used only inside that function.
var follows function scope.

function test() {
  var x = 10;
  console.log(x); // Works
}

test();
console.log(x); //  Error (x is not accessible here)

var ignores block scope. if (true) { var a = 100; }

console.log(a); // Works.
Even though a is declared inside {}, it is accessible outside.

What is Hoisting?

Hoisting means JS moves declarations to the top of their scope before execution. So we can use a variable before we even declare it. Instead of an error, we get undefined.

Hoisting with var :

console.log(x); // undefined
var x = 10;

Why no error?
JavaScript internally treats it like this:

var x;
console.log(x); // undefined
x = 10;

Declaration is moved up
Value assignment stays in place

Hoisting with let and const :

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

This happens because of Temporal Dead Zone (TDZ) - The time between
variable declaration and initialization.

Why var should not be used?

Lack of Block Scope. This can leak variables outside blocks.

if (true) {
  var x = 10;
}

console.log(x); // 10 (unexpected!)

Hoisting Issues. This hides bugs.

console.log(a); // undefined
var a = 5;

Can be redeclared. var allows us to redeclare the same variable name multiple times in the same scope without an error. This can lead to accidentally overwriting values. let and const will throw a SyntaxError if we try to redeclare them.

var name = "Arun";
var name = "Raj"; // no error

DEV Community