HOISTING AND OBJECTS IN JAVASCRIPT

Hoisting:

• Hoisting refers to the behavior where JavaScript moves the declarations of variables, functions, and classes to the top of their scope during the compilation phase.
• This can sometimes lead to surprising results, especially when using var, let, const, or function expressions.
• Hoisting applies to variable and function declarations.
• Initializations are not hoisted, they are only declarations.
• 'var' variables are hoisted with undefined, while 'let' and 'const' are hoisted but remain in the Temporal Dead Zone until initialized.

Temporal Dead Zone (TDZ):

• The Temporal Dead Zone (TDZ) is the period in JavaScript between entering a scope and the initialization of variables declared with let or const, during which accessing them results in an error.
• Variables declared with let and const are hoisted but not initialized.
• Accessing these variables before their declaration throws a ReferenceError.

example:
hello();
var hello = function() {
console.log("Hi!");
};
output:
TypeError: hello is not a function

1. Variable Hoisting with var:

• When you use var to declare a variable, the declaration is hoisted to the top, but its value is not assigned until the code execution reaches the variable’s initialization.
• This results in the variable being assigned undefined during the hoisting phase.

example:
console.log(a);
var a = 5;
output:
undefined

2. Variable Hoisting with let and const:

• Unlike var, let and const are also hoisted, but they remain in a Temporal Dead Zone (TDZ) from the start of the block until their declaration is encountered.
• Accessing them before their declaration will throw a ReferenceError.

example:
console.log(b);
let b = 10;
output:
Uncaught ReferenceError: Cannot access 'b' before initialization

3. Function Declaration Hoisting:

• Function declarations are hoisted with both their name and the function body.
• This means the function can be called before its definition in the code.

example:
greet();
function greet() {
console.log("Hello, Mahima!");
}
output:
Hello, Mahima!

Objects in JS:

• In JavaScript, an object is a collection of key–value pairs where keys (also called properties) are strings or symbols, and values can be any data type (including other objects or functions).
• Objects are used to store structured data and represent real-world entities.
• Values are stored as key:value pairs called properties.
• Functions are stored as key:function() pairs called methods.
• Objects are mutable and dynamic properties can be added, modified, or deleted at any time.
• Objects allow data grouping and encapsulation, making it easier to manage related information and behaviour together.

There are two primary ways to create an object in JavaScript:

1.Creation Using Object Literal:

The object literal syntax allows you to define and initialize an object with curly braces {}, setting properties as key-value pairs.

example:
let obj = {
name: "Sourav",
age: 23,
job: "Developer"
};
console.log(obj);
output:
{"name":"Sourav","age":23,"job":"Developer"}

2. Creation Using new Object() Constructor:

(TBD)

Properties:

• Values are stored as key:value pairs called properties.
• Definition: A property is a key–value pair inside an object.
• Key: Always a string (or symbol).
• Value: Can be any data type (string, number, boolean, object, array, function, etc.).

example:
const mobile1={
name : "realme",
price : 45000,
storage : {
ram : 8,
rom : 256
}
}
console.log(mobile1)
console.log(mobile1.storage.ram)
output:
name: "realme"
price: 45000
storage: ram: 8
rom:256
8
Adding/Updating properties:(TBD)
Deleting properties:(TBD)

Methods:

• Functions are stored as key:function() pairs called methods.
• Definition: A method is a function stored as a property.
• Purpose: To define behavior for the object.

example:
const mobile2 = {
name: "realme",
price: 45000,
storage: {
ram: 8,
rom: 256
},
browse:function(){
console.log("5g networking speed")
}
}
mobile2.browse();
output:
5g networking speed

References:

Objects in JavaScript - GeeksforGeeks

Your All-in-One Learning Portal: GeeksforGeeks is a comprehensive educational platform that empowers learners across domains-spanning computer science and programming, school education, upskilling, commerce, software tools, competitive exams, and more.

geeksforgeeks.org

w3schools.com