Syntax -:
var name = value.
|Syntax -:
let name = value.
| | The variables that are defined with **var** statement have function scope. | The variables that are defined with **let** statement have block scope. | | We can declare a variable again even if it has been defined previously in the same scope. | We cannot declare a variable more than once if we defined that previously in the same scope. | | Hoisting is allowed with **var**. | **let** is hoisted but inaccessible due to temporal dead zone | |Example -:
var websitename = “geeksforgeeks”;
|Example -:
let x = 69;
| | var is an ECMAScript1 feature. | let is a feature of ES6. | In summary, `let` offers more precise control over variable scope and lifecycle, making it the preferred choice for modern JavaScript development. Its block scoping and strict handling of hoisting and redeclaration help prevent common pitfalls associated with `var`. ### Explain Implicit Type Coercion in JavaScript? When the value of one data type is automatically converted into another data type, it is called Implicit type coercion in JavaScript. ```javascript var a = 4; var b = "2"; console.log(a+b); // converted to string = 42 console.log(a-b); // converted to number = 2 ``` ### Difference between “== “ and “ === “ operators ? Both are comparison operators. The difference between both the operators is that “==” is used to compare values whereas, “ === “ is used to compare both values and types. ```javascript let a = 0; let b = false; console.log((a == b)); // true console.log((a === b)); // false ``` ### What is the difference between Session storage and Local storage? | Session storage | Local storage | | ------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------- | | The data stored in session storage gets expired or deleted when a page session ends. | Websites store some data in local machine to reduce loading time; this data does not get deleted at the end of a browsing session. | ### What is the difference between Undefined and Null in JavaScript? | Undefined means a variable has been declared but a value has not yet been assigned to that variable. | Null is an assignment value that we can assign to any variable that is meant to contain no value. | | ---------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- | ### Output of Following Codes ```javascript (function(){ setTimeout(()=> console.log(1),2000); console.log(2); setTimeout(()=> console.log(3),0); console.log(4); })(); Output: 2 4 3 1 ``` ### What is a self-invoked function? How does a self-invoked function work? A self-invoked function, also known as an Immediately Invoked Function Expression (IIFE), is a function that is executed immediately after it is defined. This technique is commonly used in JavaScript to create a new scope and to avoid polluting the global namespace. #### Structure of an Immediately Invoked Function Expression (IIFE) An IIFE is typically structured as follows: ```javascript (function() { console.log("This is a self-invoked function!"); })(); ``` #### Why Use an IIFE? 1. **Avoid Global Variables**: Variables defined within an IIFE are not accessible outside its scope, which helps in preventing global namespace pollution. ```javascript code(function() { var secret = "I'm a secret!"; console.log(secret); // This will log "I'm a secret!" })(); console.log(secret); // This will throw a ReferenceError: secret is not defined ``` 2. **Module Pattern**: IIFEs are often used in the module pattern to create private and public members. ```javascript var counterModule = (function() { var count = 0; // private variable return { increment: function() { count++; console.log(count); }, reset: function() { count = 0; console.log(count); } }; })(); counterModule.increment(); // logs 1 counterModule.increment(); // logs 2 counterModule.reset(); // logs 0 ``` In this example, `count` is a private variable that can only be accessed and modified by the methods `increment` and `reset`. 3. **Immediate Initialization**: IIFEs can be used to initialize variables or set up configurations right away. ```javascript var appConfig = (function() { var config = { apiKey: '1234567890', apiUrl: 'https://api.example.com' }; return config; })(); console.log(appConfig.apiKey); / ``` ### What happens if you initialize a variable in a block but do not declare it anywhere in the code? If you initialize a variable in a block without declaring it anywhere in the code (i.e., without using `var`, `let`, or `const`), it will be treated as an implicit global variable in JavaScript. This happens because the JavaScript interpreter will automatically create a global variable with the given name. Here is an example to illustrate this behavior: ```javascript function example() { // No declaration with var, let, or const implicitGlobal = "I'm an implicit global variable!"; } example(); console.log(implicitGlobal); // This will log: "I'm an implicit global variable!" ``` #### Why This Happens * **Global Scope**: If a variable is assigned a value without being declared using `var`, `let`, or `const`, it will be added to the global object (`window` in browsers, `global` in Node.js). This makes it accessible from anywhere in the code. ### Let's assume a function receives 3 parameters but you call it using 2 parameters. a. What will happen? b. What will be the value of the 3rd parameter? #### a. What will happen? The function will execute without any error. JavaScript does not enforce a strict number of parameters, so it allows you to call a function with fewer or more arguments than it is defined to take. #### b. What will be the value of the 3rd parameter? The third parameter will be `undefined`. When a function is called with fewer arguments than the number of parameters defined, the parameters for which no corresponding arguments are provided will be set to `undefined`. #### Example Here is an example to illustrate this behavior: ```javascript function exampleFunction(a, b, c) { console.log(a); // logs the value of the first argument console.log(b); // logs the value of the second argument console.log(c); // logs the value of the third argument, which will be undefined } exampleFunction(1, 2); // Only two arguments are provided ``` Output: ```javascript 1 2 undefined ``` In this example: * `a` is assigned the value `1`. * `b` is assigned the value `2`. * `c` is not provided, so it is assigned `undefined`. #### Handling Undefined Parameters If you want to provide default values for parameters that might be undefined, you can use default parameter syntax: ```javascript function exampleFunction(a, b, c = 3) { console.log(a); // logs the value of the first argument console.log(b); // logs the value of the second argument console.log(c); // logs the value of the third argument, which will be 3 if not provided } exampleFunction(1, 2); // Only two arguments are provided ``` Output: ``` 1 2 3 ``` In this modified example, `c` will default to `3` if it is not provided. ### Differences between declaring variables using var, let and cons? When declaring variables in JavaScript, you have three options: `var`, `let`, and `const`. Each has its own characteristics and scope rules. Here's a detailed explanation of the differences: #### 1. `var` * **Scope**: `var` is function-scoped, meaning it is accessible within the function it is declared in. If declared outside any function, it becomes globally scoped. * **Hoisting**: Variables declared with `var` are hoisted to the top of their scope. This means the declaration is processed before any code is executed, but the initialization is not. As a result, you can reference a `var` variable before its declaration without getting a `ReferenceError`, although its value will be `undefined` until the line where it's initialized is executed. * **Re-declaration**: You can re-declare a variable using `var` within the same scope without any errors. * **Example**: ```javascript function example() { console.log(x); // undefined due to hoisting var x = 5; console.log(x); // 5 } example(); var y = 10; var y = 20; // No error console.log(y); // 20 ``` #### 2. `let` * **Scope**: `let` is block-scoped, meaning it is only accessible within the block (enclosed by `{}`) it is declared in. This includes for-loops, if statements, etc. * **Hoisting**: Variables declared with `let` are hoisted to the top of their block, but they are not initialized. This means referencing a `let` variable before its declaration results in a `ReferenceError`. * **Re-declaration**: You cannot re-declare a variable using `let` within the same scope. * **Example**: ```javascript function example() { console.log(x); // ReferenceError: Cannot access 'x' before initialization let x = 5; console.log(x); // 5 } example(); let y = 10; let y = 20; // SyntaxError: Identifier 'y' has already been declared ``` #### 3. `const` * **Scope**: `const` is also block-scoped, similar to `let`. * **Hoisting**: Variables declared with `const` are hoisted to the top of their block but are not initialized. Like `let`, referencing a `const` variable before its declaration results in a `ReferenceError`. * **Re-declaration and Assignment**: You cannot re-declare or reassign a variable declared with `const`. This makes `const` useful for defining constants that should not change. * **Mutable Objects**: Note that while you cannot reassign a `const` variable, if it holds an object or array, the properties or elements of that object/array can be changed. * **Example**: ```javascript function example() { console.log(x); // ReferenceError: Cannot access 'x' before initialization const x = 5; console.log(x); // 5 } example(); const y = 10; y = 20; // TypeError: Assignment to constant variable. const obj = { key: 'value' }; obj.key = 'newValue'; // Allowed console.log(obj.key); // 'newValue' ``` #### Summary * **Scope**: `var` is function-scoped; `let` and `const` are block-scoped. * **Hoisting**: All are hoisted, but `let` and `const` are not initialized until their declaration is encountered. * **Re-declaration**: `var` allows re-declaration; `let` and `const` do not. * **Assignment**: `const` does not allow reassignment; `var` and `let` do. ### Is JavaScript a statically typed or a dynamically typed language? JavaScript is a dynamically typed language. In a dynamically typed language, variable types are determined at runtime, allowing a variable to hold values of any type without explicit type declarations. This flexibility can make coding more convenient but may also lead to runtime errors if types are not handled appropriately. JavaScript, being dynamically typed, allows variables to change types during execution and accommodates a wide range of data types without explicit type annotations ### What is Callback Hell? Callback hell (or "pyramid of doom") is a situation in which multiple nested callbacks make the code difficult to read and maintain. This often occurs when dealing with asynchronous operations, such as making multiple API calls or handling multiple events. Here's an example of callback hell:getUser(function(user) {
getProfile(user.id, function(profile) {
getPosts(user.id, function(posts) {
displayUserProfile(user, profile, posts, function() {
});
});
});
});
| Function Declaration | Function Expression | |
|---|---|---|
| 1 | Function declarations are hoisted to the top of their containing scope. This means you can call the function before its definition in the code. | Function expressions are not hoisted. This means you cannot call the function before it is defined in the code. |
| 2 | Uses the function keyword followed by a name and parameter list. | Often assigned to a variable, can be anonymous or named, and defined using the function keyword. |
| 3 | Typically used for defining main functions that need to be available throughout the code. | Often used for inline functions, such as callbacks or immediately invoked function expressions (IIFEs). |
| Client - Side JavaScript | Server - Side JavaScript | |
|---|---|---|
| 1 | Client-side JavaScript runs in the user's web browser, interacting with the web page's content and the browser itself. | Server-side JavaScript runs on the web server, handling backend logic, database interactions, and serving web pages to clients |
| 2 | Runs in the browser (e.g., Chrome, Firefox, Safari). | Runs on the server (e.g., Node.js). |
| 3 | Popular libraries and frameworks include jQuery, React, Angular, and Vue.js. | Popular frameworks include Express.js, Koa.js, and Hapi.js. |
| 4 | Common Uses:
| Common Uses:
|