Web Development - HTML, CSS & JavaScript
55.6K subscribers
1.88K photos
5 videos
34 files
512 links
Learn to code and become a Web Developer with HTML, CSS, JavaScript , Reactjs, Wordpress, PHP, Mern & Nodejs knowledge

Managed by: @love_data
Download Telegram
โœ… JavaScript Acronyms You MUST Know ๐Ÿ’ป๐Ÿ”ฅ

JS โ†’ JavaScript
ES โ†’ ECMAScript
DOM โ†’ Document Object Model
BOM โ†’ Browser Object Model
JSON โ†’ JavaScript Object Notation
AJAX โ†’ Asynchronous JavaScript And XML
API โ†’ Application Programming Interface
SPA โ†’ Single Page Application
MPA โ†’ Multi Page Application
SSR โ†’ Server Side Rendering
CSR โ†’ Client Side Rendering
TS โ†’ TypeScript
NPM โ†’ Node Package Manager
NPX โ†’ Node Package Execute
CDN โ†’ Content Delivery Network
IIFE โ†’ Immediately Invoked Function Expression
HOF โ†’ Higher Order Function
MVC โ†’ Model View Controller
MVVM โ†’ Model View ViewModel
V8 โ†’ Google JavaScript Engine
REPL โ†’ Read Evaluate Print Loop
CORS โ†’ Cross Origin Resource Sharing
JWT โ†’ JSON Web Token
SSE โ†’ Server Sent Events
WS โ†’ WebSocket

๐Ÿ’ฌ Double Tap โ™ฅ๏ธ For More ๐Ÿš€
โค11๐Ÿ”ฅ3
๐Ÿš€ ๐Ÿฐ ๐—™๐—ฅ๐—˜๐—˜ ๐—–๐—ผ๐˜‚๐—ฟ๐˜€๐—ฒ๐˜€ ๐˜๐—ผ ๐—•๐—ผ๐—ผ๐˜€๐˜ ๐—ฌ๐—ผ๐˜‚๐—ฟ ๐—ฅ๐—ฒ๐˜€๐˜‚๐—บ๐—ฒ & ๐—–๐—ผ๐—ป๐—ณ๐—ถ๐—ฑ๐—ฒ๐—ป๐—ฐ๐—ฒ ๐ŸŽ“๐Ÿ”ฅ

Make your resume stand out and feel more confident during your job search.

๐Ÿš€ Build confidence and a career-focused mindset

โœ… 100% FREE
โœ… Beginner Friendly
โœ… Improve Your Resume
โœ… Develop Career-Ready Skills
โœ… Great for Students, Freshers & Professionals

๐Ÿ”— ๐—˜๐—ป๐—ฟ๐—ผ๐—น๐—น ๐—™๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜๐Ÿ‘‡:- 

https://pdlink.in/4gce062

๐Ÿ”ฅ Don't just apply for jobs โ€” build the skills and confidence to stand out!
โค1
๐Ÿš€ Full Stack Projects You Should Build (With Source Code)

1๏ธโƒฃ AI SaaS Tool
Learn authentication, subscriptions, APIs & AI integration.

๐Ÿ”— Source Code: https://github.com/ayusshrathore/ai-saas

2๏ธโƒฃ Real-Time Collaborative Code Editor
Just like Google Docs but for coding. Multiple users can edit code simultaneously.

๐Ÿ”— Source Code: https://github.com/Mohitur669/Realtime-Collaborative-Code-Editor

3๏ธโƒฃ Trading Simulator
A virtual stock trading platform to practice trading strategies.

๐Ÿ”— Source Code: https://github.com/nikolatechie/trading-simulator

4๏ธโƒฃ Microservices E-Commerce Platform
Learn scalable architecture using microservices, APIs, and backend systems.

๐Ÿ”— Source Code: https://github.com/ShahandFahad/E-Commerce

5๏ธโƒฃ Real-Time Chat Application
Build a WhatsApp-like chat app with real-time messaging.

๐Ÿ”— Tutorial + Code: https://youtu.be/B_l8nD-bvI0?si=M4N5p1wiPiBW-XA8

6๏ธโƒฃ Developer Portfolio SaaS
Create a platform where developers can generate their own portfolio websites.

๐Ÿ”— Source Code: https://github.com/akhilub/portfolio-saas

7๏ธโƒฃ Job Referral Platform

A platform where users can request and provide job referrals.

๐Ÿ”— Source Code: https://github.com/RutikKulkarni/ReferralNetworkHub

8๏ธโƒฃ Food Delivery App
Build your own Swiggy/Zomato-like full stack application.

๐Ÿ”— Source Code: https://github.com/Mshandev/Food-Delivery

9๏ธโƒฃ Ride Sharing App
Learn how ride booking systems like Uber work.

๐Ÿ”— Source Code: https://github.com/codinggita/ride_share

๐Ÿ”Ÿ Video Streaming Platform
Build your own YouTube-like video streaming platform.

๐Ÿ”— Source Code: https://github.com/soumanpaul/Video-streaming-web-app

โœจ Donโ€™t forget to react to this message for more awesome content like this! ๐Ÿ‘‡

๐Ÿ™ Thank you all for joining! ๐Ÿ’™
โค9๐Ÿ”ฅ1
๐Ÿ’ป ๐— ๐—ฎ๐˜€๐˜๐—ฒ๐—ฟ ๐—ฆ๐—ค๐—Ÿ ๐—ณ๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜ | ๐Ÿฑ ๐—•๐—ฒ๐˜€๐˜ ๐—ฌ๐—ผ๐˜‚๐—ง๐˜‚๐—ฏ๐—ฒ ๐—–๐—ต๐—ฎ๐—ป๐—ป๐—ฒ๐—น๐˜€ ๐Ÿš€

Want to learn SQL from scratch to advanced level without spending anything? These 5 YouTube channels offer tutorials, practical examples and problem-solving content.

๐Ÿ”ฅ Learn โ†’ Practice โ†’ Build Projects โ†’ Prepare for SQL Interviews

๐Ÿ”— ๐—˜๐—ป๐—ฟ๐—ผ๐—น๐—น ๐—™๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜๐Ÿ‘‡:- 

https://pdlink.in/4wCjU6x

๐Ÿ“Š Perfect for Students | Freshers | Data Analyst Aspirants | SQL Beginners
๐—™๐—ฅ๐—˜๐—˜ ๐— ๐—ฎ๐˜€๐˜๐—ฒ๐—ฟ๐—ฐ๐—น๐—ฎ๐˜€๐˜€ ๐—ข๐—ป ๐—Ÿ๐—ฎ๐˜๐—ฒ๐˜€๐˜ ๐—ง๐—ฒ๐—ฐ๐—ต๐—ป๐—ผ๐—น๐—ผ๐—ด๐—ถ๐—ฒ๐˜€ ๐Ÿ˜
- AI
- Data Analytics
- Data Science
- CloudComputing
- Cyber Security
โ€‹
๐Ÿ’ซBuild a Future Ready Career in the AI Era
โ€‹
๐Ÿ’ซLearn the Skills, Hiring Trends, and Preparation Strategies That Matter
โ€‹
๐—ฅ๐—ฒ๐—ด๐—ถ๐˜€๐˜๐—ฒ๐—ฟ ๐—™๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜ ๐Ÿ‘‡:-
โ€‹
https://pdlink.in/45w4ztg
โ€‹
(Only few slots left )
โ€‹
Date & Time :- 18th August 2026 & 7PM
โค2
๐Ÿ“Š ๐Ÿฑ ๐—•๐—ฒ๐˜€๐˜ ๐—Ÿ๐—ฒ๐—ฎ๐—ฟ๐—ป๐—ถ๐—ป๐—ด ๐—ฅ๐—ฒ๐˜€๐—ผ๐˜‚๐—ฟ๐—ฐ๐—ฒ๐˜€ ๐—ง๐—ผ ๐— ๐—ฎ๐˜€๐˜๐—ฒ๐—ฟ ๐— ๐—ฆ ๐—˜๐˜…๐—ฐ๐—ฒ๐—น ๐—ณ๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜

Excel is one of the most valuable workplace skills โ€” start learning for FREE today!

โœ… Beginner Friendly
โœ… Learn at Your Own Pace
โœ… Improve Excel & Data Analysis Skills
โœ… Useful for Jobs & Interviews
โœ… Completely FREE Resources

๐Ÿ”— ๐—˜๐—ป๐—ฟ๐—ผ๐—น๐—น ๐—™๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜๐Ÿ‘‡:- 

https://pdlink.in/3UkOmoa

๐ŸŽ“ Perfect for Students | Freshers | Data Analyst Aspirants | Working Professionals
๐Ÿš€ ๐——๐—ฎ๐˜๐—ฎ ๐—”๐—ป๐—ฎ๐—น๐˜†๐˜๐—ถ๐—ฐ๐˜€ ๐—–๐—ฒ๐—ฟ๐˜๐—ถ๐—ณ๐—ถ๐—ฐ๐—ฎ๐˜๐—ถ๐—ผ๐—ป ๐—–๐—ผ๐˜‚๐—ฟ๐˜€๐—ฒ ๐Ÿ“Š๐Ÿ”ฅ

๐—•๐˜‚๐—ถ๐—น๐—ฑ ๐—๐—ผ๐—ฏ-๐—ฅ๐—ฒ๐—ฎ๐—ฑ๐˜† ๐—ฆ๐—ธ๐—ถ๐—น๐—น๐˜€ & Learn the tools companies actually use and prepare for high-growth Data Analyst opportunities.

๐Ÿ’ผ 60+ Hiring Drives Every Month
๐Ÿค 500+ Hiring Partners
๐Ÿ‘จโ€๐Ÿซ 1-on-1 Expert Mentorship
๐Ÿ“ Resume & Interview Preparation
๐Ÿš€ Dedicated Placement Assistance

๐Ÿ”— ๐—•๐—ผ๐—ผ๐—ธ ๐—ฎ ๐—™๐—ฅ๐—˜๐—˜ ๐—–๐—ฎ๐—ฟ๐—ฒ๐—ฒ๐—ฟ ๐—–๐—ผ๐˜‚๐—ป๐˜€๐—ฒ๐—น๐—น๐—ถ๐—ป๐—ด๐Ÿ‘‡:-

https://pdlink.in/45vk5ph

๐ŸŽ“ Perfect for Students | Freshers | Working Professionals | Career Switchers
๐Ÿ“Š ๐—ช๐—ฎ๐—ป๐˜ ๐˜๐—ผ ๐—•๐—ฒ๐—ฐ๐—ผ๐—บ๐—ฒ ๐—ฎ ๐—ฃ๐—ฟ๐—ผ ๐—ถ๐—ป ๐——๐—ฎ๐˜๐—ฎ ๐—”๐—ป๐—ฎ๐—น๐˜†๐˜๐—ถ๐—ฐ๐˜€? ๐Ÿš€

Learning Excel, SQL and Power BI is only the beginning. To stand out as a Data Analyst, focus on practical experience, visibility and networking.

๐Ÿ”ฅ 4 Ways to Level Up Your Data Analytics Career:

๐Ÿ’ก Master the Skills โ†’ Build Projects โ†’ Create Your Portfolio โ†’ Get Noticed

๐Ÿ”— ๐—–๐—ต๐—ฒ๐—ฐ๐—ธ ๐˜๐—ต๐—ฒ ๐—–๐—ผ๐—บ๐—ฝ๐—น๐—ฒ๐˜๐—ฒ ๐—š๐˜‚๐—ถ๐—ฑ๐—ฒ ๐Ÿ‘‡

https://pdlink.in/4cIfLqn

๐ŸŽฏ Perfect for Students | Freshers | Data Analyst Aspirants | Career Switchers
๐ŸŽ“ ๐Ÿฐ ๐—™๐—ฅ๐—˜๐—˜ ๐—–๐—ฒ๐—ฟ๐˜๐—ถ๐—ณ๐—ฎ๐˜๐—ถ๐—ผ๐—ป๐˜€ ๐—ง๐—ผ ๐— ๐—ฎ๐˜€๐˜๐—ฒ๐—ฟ ๐—œ๐—ป ๐Ÿฎ๐Ÿฌ๐Ÿฎ๐Ÿฒ ๐Ÿš€

Want to build job-ready skills and strengthen your resume? Start learning these in-demand technologies for FREE! ๐Ÿ”ฅ

๐Ÿ“Š ๐——๐—ฎ๐˜๐—ฎ ๐—”๐—ป๐—ฎ๐—น๐˜†๐˜๐—ถ๐—ฐ๐˜€ :- https://pdlink.in/4qn5q94

๐Ÿ’ซ ๐—”๐—œ & ๐— ๐—ฎ๐—ฐ๐—ต๐—ถ๐—ป๐—ฒ ๐—Ÿ๐—ฒ๐—ฎ๐—ฟ๐—ป๐—ถ๐—ป๐—ด :- https://pdlink.in/4zrkYNg

โ˜๏ธ ๐—–๐—น๐—ผ๐˜‚๐—ฑ ๐—–๐—ผ๐—บ๐—ฝ๐˜‚๐˜๐—ถ๐—ป๐—ด :- https://pdlink.in/4wzy6Ny

๐Ÿ›ก๏ธ ๐—–๐˜†๐—ฏ๐—ฒ๐—ฟ ๐—ฆ๐—ฒ๐—ฐ๐˜‚๐—ฟ๐—ถ๐˜๐˜† :- https://pdlink.in/4xMJNl5

๐Ÿ” ๐—ฆ๐—ต๐—ฎ๐—ฟ๐—ฒ this with your friends and classmates!
โค2
๐——๐—ฎ๐˜๐—ฎ ๐—ฆ๐—ฐ๐—ถ๐—ฒ๐—ป๐—ฐ๐—ฒ ๐—™๐—ฅ๐—˜๐—˜ ๐—ข๐—ป๐—น๐—ถ๐—ป๐—ฒ ๐— ๐—ฎ๐˜€๐˜๐—ฒ๐—ฟ๐—ฐ๐—น๐—ฎ๐˜€๐˜€ ๐Ÿ˜

๐Ÿ’ซKickstart Your Data Science Career

๐Ÿ’ซJoin this Masterclass for an expert-led session on Data Science

Eligibility :- Students ,Freshers & Working Professionals

๐—ฅ๐—ฒ๐—ด๐—ถ๐˜€๐˜๐—ฒ๐—ฟ ๐—™๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜ ๐Ÿ‘‡:-

https://pdlink.in/4xOh5jA

(Only few slots left )

Date & Time :- 21st August 2026 & 7PM
โค1
๐Ÿš€ JavaScript Interview Questions with Answers โ€” Part 6

51. How do you sort arrays?

The sort() method is used to sort the elements of an array.

Sorting Strings

const fruits = ["Banana", "Apple", "Mango"];
fruits.sort();
console.log(fruits);


Output:

["Apple", "Banana", "Mango"]

Sorting Numbers

By default, sort() converts elements to strings, so a comparison function should be used for numbers.

const numbers = [10, 5, 20, 2];
numbers.sort((a, b) => a - b);
console.log(numbers);


Output:

[2, 5, 10, 20]

Descending Order:

numbers.sort((a, b) => b - a);


Interview Tip:

sort() mutates the original array.

52. What is array destructuring?

Array destructuring allows you to extract values from an array and assign them to variables.

Example:

const numbers = [10, 20, 30];
const [a, b, c] = numbers;
console.log(a);
console.log(b);
console.log(c);


Output:

10

20

30

Skipping Values:

const numbers = [10, 20, 30];
const [first, , third] = numbers;
console.log(first, third);


Output:

10 30

Default Values:

const numbers = [10];
const [a, b = 20] = numbers;
console.log(a, b);


Output:

10 20

53. What are Sets?

A Set is a collection of unique values.

Duplicate values are automatically removed.

Example:

const numbers = new Set([1, 2, 2, 3, 3]);
console.log(numbers);


The Set contains:

{1, 2, 3}

Common Methods:

const numbers = new Set();
numbers.add(10);
numbers.add(20);
console.log(numbers.has(10));
numbers.delete(20);


Convert Set to Array:

const arr = [...numbers];


54. What are Maps?

A Map is a collection of key-value pairs.

Unlike regular objects, a Map can use different data types as keys.

Example:

const users = new Map();
users.set(1, "Deepak");
users.set(2, "John");
console.log(users.get(1));


Output:

Deepak

Common Methods:

users.set(key, value);
users.get(key);
users.has(key);
users.delete(key);
users.clear();


Example:

console.log(users.has(2));


Output:

true

Map vs Object:

Map

โ€ข Any value can be a key

โ€ข Has size property

โ€ข Built-in methods

โ€ข Designed for key-value collections

Object

โ€ข Keys are primarily strings/symbols

โ€ข No built-in size

โ€ข Different object APIs

โ€ข General-purpose objects

55. What are Symbols?

Symbol is a primitive data type used to create unique identifiers.

Example:

const id1 = Symbol("id");
const id2 = Symbol("id");
console.log(id1 === id2);


Output:

false

Even though both have the same description, each Symbol is unique.

Using Symbol as an Object Property:

const id = Symbol("id");
const user = {
name: "Deepak",
[id]: 101
};
console.log(user[id]);


Common Use:

Symbols are useful when you need unique property keys that are unlikely to conflict with other properties.

56. What are generators?

Generators are special functions that can pause and resume execution.

They are created using function* and use the yield keyword.

Example:
โค3
function* numbers() {
yield 1;
yield 2;
yield 3;
}

const generator = numbers();

console.log(generator.next());
console.log(generator.next());


Output:

{ value: 1, done: false }

{ value: 2, done: false }

After all values are consumed:

{ value: 3, done: false }

{ value: undefined, done: true }

Important:

Calling a generator function doesn't immediately execute its body. It returns a generator object.

57. What are iterators?

An iterator is an object that provides a way to access values one at a time using the next() method.

Example:

const numbers = [10, 20, 30];
const iterator = numbers[Symbol.iterator]();

console.log(iterator.next());
console.log(iterator.next());


Output:

{ value: 10, done: false }

{ value: 20, done: false }

The iterator eventually returns:

{ value: undefined, done: true }

Common Iterables:

โ€ข Arrays

โ€ข Strings

โ€ข Maps

โ€ข Sets

That's why they can be used with for...of.

for (const number of numbers) {
console.log(number);
}


58. What is destructuring assignment?

Destructuring assignment allows values to be extracted from arrays or objects and assigned to variables.

Object Example:

const user = {
name: "Deepak",
age: 25
};

const { name, age } = user;


Array Example:

const numbers = [10, 20];
const [a, b] = numbers;


Why Use It?

It makes code shorter and easier to read, especially when working with API responses and function parameters.

59. What is dynamic import?

Dynamic import allows a JavaScript module to be loaded when it is needed, instead of loading it immediately.

It uses: import()

Example:

async function loadModule() {
const module = await import("./math.js");
console.log(module.add(10, 20));
}


Important:

Unlike a static import:

import { add } from "./math.js";


dynamic imports return a Promise.

Common Uses:

โ€ข Lazy loading

โ€ข Code splitting

โ€ข Loading features only when required

โ€ข Improving initial page performance

60. What are ES6 modules?

ES6 modules provide a standard way to divide JavaScript applications into separate files.

They use export and import.

Export:

// math.js
export function add(a, b) {
return a + b;
}


Import:

// app.js
import { add } from "./math.js";
console.log(add(10, 20));


Default Export:

export default function greet() {
console.log("Hello");
}


Import:

import greet from "./greet.js";


Benefits:

โœ… Code organization

โœ… Reusability

โœ… Encapsulation

โœ… Easier maintenance

โœ… Avoids unnecessary global variables

โค๏ธ Double Tap For Part 7
โค1๐Ÿ‘1
๐—ช๐—ข๐—ฅ๐—ž ๐—™๐—ฅ๐—ข๐—  ๐—›๐—ข๐— ๐—˜ ๐—๐—ข๐—• ๐—ข๐—ฃ๐—ฃ๐—ข๐—ฅ๐—ง๐—จ๐—ก๐—œ๐—ง๐—ฌ ๐Ÿ˜

Company Name :- AI InsurTech Company

๐Ÿ’ผ ๐—ฅ๐—ผ๐—น๐—ฒ: Backend Developer
๐Ÿ’ฐ ๐—ฆ๐—ฎ๐—น๐—ฎ๐—ฟ๐˜†: โ‚น5 LPA
๐Ÿ  ๐—ช๐—ผ๐—ฟ๐—ธ ๐— ๐—ผ๐—ฑ๐—ฒ: Work From Home
๐Ÿ“ ๐—Ÿ๐—ผ๐—ฐ๐—ฎ๐˜๐—ถ๐—ผ๐—ป: Hyderabad / Remote

๐ŸŽ“ ๐—ช๐—ต๐—ผ ๐—–๐—ฎ๐—ป ๐—”๐—ฝ๐—ฝ๐—น๐˜†?
โœ… BTech/BE graduates
โœ… Branches: CS, IT, AI, ML and Data-related streams
โœ… Graduation Years: 2025 and 2026

๐Ÿ”— ๐—”๐—ฝ๐—ฝ๐—น๐˜† ๐—ก๐—ผ๐˜„ ๐Ÿ‘‡:-

https://pdlink.in/4xIfsE4

โšก Apply early and share this opportunity with your friends!
โค4
โ˜๏ธ ๐Ÿฐ ๐—™๐—ฅ๐—˜๐—˜ ๐—š๐—ผ๐—ผ๐—ด๐—น๐—ฒ ๐—–๐—น๐—ผ๐˜‚๐—ฑ ๐—–๐—ผ๐˜‚๐—ฟ๐˜€๐—ฒ๐˜€ | ๐—•๐˜‚๐—ถ๐—น๐—ฑ ๐—œ๐—ป-๐——๐—ฒ๐—บ๐—ฎ๐—ป๐—ฑ ๐—–๐—น๐—ผ๐˜‚๐—ฑ ๐—ฆ๐—ธ๐—ถ๐—น๐—น๐˜€

Explore these Google Cloud learning resources covering cloud fundamentals, infrastructure, networking, security, data and AI/ML.

๐Ÿ”ฅ 4 Courses to Explore:
1๏ธโƒฃ Cloud Computing Fundamentals
2๏ธโƒฃ Infrastructure in Google Cloud
3๏ธโƒฃ Networking & Security in Google Cloud
4๏ธโƒฃ Data, ML & AI in Google Cloud

๐Ÿ”— ๐—˜๐—ป๐—ฟ๐—ผ๐—น๐—น ๐—™๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜๐Ÿ‘‡:- 

https://pdlink.in/4zrksPn

๐ŸŽฏ Perfect for Students | Freshers | Developers | Cloud & DevOps Aspirants
๐Ÿš€ ๐—”๐—œ & ๐— ๐—ฎ๐—ฐ๐—ต๐—ถ๐—ป๐—ฒ ๐—Ÿ๐—ฒ๐—ฎ๐—ฟ๐—ป๐—ถ๐—ป๐—ด ๐—™๐—ฅ๐—˜๐—˜ ๐—–๐—ฒ๐—ฟ๐˜๐—ถ๐—ณ๐—ถ๐—ฐ๐—ฎ๐˜๐—ถ๐—ผ๐—ป ๐—–๐—ผ๐˜‚๐—ฟ๐˜€๐—ฒ

๐Ÿ”ฅ Upgrade your skills and prepare for exciting career opportunities in AI!

โœ… Beginner-friendly course
โœ… Learn AI & Machine Learning fundamentals
โœ… Gain practical, job-ready skills
โœ… Earn a FREE certificate
โœ… Boost your resume and LinkedIn profile
โœ… Ideal for students, freshers and professionals

๐Ÿ”— ๐—˜๐—ป๐—ฟ๐—ผ๐—น๐—น ๐—ณ๐—ผ๐—ฟ ๐—™๐—ฅ๐—˜๐—˜ ๐Ÿ‘‡:-

https://pdlink.in/4zrkYNg

โšก Limited opportunityโ€”start learning today!
โค1
๐Ÿš€ JavaScript Interview Questions with Answers โ€” Part 8

71. What is fetch()?

fetch() is a modern JavaScript API used to make HTTP requests and communicate with servers.

It returns a Promise.

Example:

fetch("https://api.example.com/users")
.then(response => response.json())
.then(data => {
console.log(data);
})
.catch(error => {
console.log(error);
});


Using async/await:

async function getUsers() {
try {
const response = await fetch(
"https://api.example.com/users"
);
const data = await response.json();
console.log(data);
} catch (error) {
console.log(error);
}
}


Interview Tip:

fetch() rejects its Promise for network-level failures, but an HTTP error such as 404 or 500 does not automatically reject it. You should check response.ok.

72. What is AJAX?

AJAX stands for Asynchronous JavaScript and XML.

It is a technique for communicating with a server and updating parts of a webpage without reloading the entire page.

Despite the name, AJAX doesn't require XML. Modern applications commonly exchange JSON.

Example:

A webpage can request:

User data โ†’ Server
โ†“
JSON
โ†“
JavaScript
โ†“
Update webpage


Modern Approach:

Today, fetch() is commonly used instead of the older XMLHttpRequest API.

73. What are Web APIs?

Web APIs are browser-provided interfaces that allow JavaScript to interact with browser features and the environment.

Examples include:

โ€ข fetch()

โ€ข setTimeout()

โ€ข DOM APIs

โ€ข Local Storage

โ€ข Geolocation API

โ€ข Web Workers

โ€ข Clipboard API

Example:

setTimeout(() => {
console.log("Hello");
}, 1000);


The timer functionality is provided by the host environment, such as a browser or Node.js runtime, rather than being part of the JavaScript language itself.

Interview Tip:

Don't confuse JavaScript language features with browser Web APIs.

74. What is setTimeout()?

setTimeout() schedules a function to run after a specified delay.

Example:

setTimeout(() => {
console.log("Hello");
}, 2000);


The callback becomes eligible to run after approximately 2 seconds.

Important:

The delay is not a guarantee that the function executes exactly at that time.

It may execute later if the JavaScript runtime is busy.

75. What is setInterval()?

setInterval() repeatedly schedules a function at approximately specified intervals.

Example:

const interval = setInterval(() => {
console.log("Running...");
}, 1000);


The callback runs approximately every second until the interval is cancelled.

Stop It:

clearInterval(interval);


Common Uses:

โ€ข Timers

โ€ข Polling

โ€ข Repeated UI updates

โ€ข Periodic tasks

76. What is clearTimeout()?

clearTimeout() cancels a timeout that was previously scheduled using setTimeout().

Example:

const timer = setTimeout(() => {
console.log("Hello");
}, 5000);

clearTimeout(timer);


The callback will not execute because the timeout was cancelled before it became eligible to run.

Common Use:

Useful when you need to cancel a scheduled action.

77. What is clearInterval()?

clearInterval() stops an interval created using setInterval().

Example:
let count = 0;

const interval = setInterval(() => {
count++;
console.log(count);
if (count === 5) {
clearInterval(interval);
}
}, 1000);


Output:

1

2

3

4

5

After 5, the interval is stopped.

78. What is callback hell?

Callback hell occurs when multiple asynchronous operations are nested inside one another, making code difficult to read and maintain.

Example:

getUser(user => {
getOrders(user, orders => {
getPayment(orders, payment => {
processPayment(payment, result => {
console.log(result);
});
});
});
});


This creates deeply nested code.

Problems:

โŒ Difficult to read

โŒ Difficult to debug

โŒ Difficult to maintain

โŒ Error handling becomes complicated

79. How do you avoid callback hell?

Several approaches can make asynchronous code cleaner.

1. Use Promises

getUser()
.then(getOrders)
.then(getPayment)
.then(processPayment)
.catch(handleError);


2. Use async/await

async function process() {
try {
const user = await getUser();
const orders = await getOrders(user);
const payment = await getPayment(orders);
await processPayment(payment);
} catch (error) {
console.log(error);
}
}


3. Break large functions into smaller functions

Instead of putting everything into one deeply nested callback, separate responsibilities into reusable functions.

Interview Tip:

For modern JavaScript, Promises and async/await are the most common solutions.

80. What are microtasks and macrotasks?

This is an important advanced JavaScript interview topic.

The JavaScript runtime has different queues for asynchronous work.

Microtasks

Examples include:

โ€ข Promise callbacks

โ€ข queueMicrotask()

โ€ข MutationObserver callbacks in browsers

Macrotasks / Tasks

Common examples include:

โ€ข setTimeout()

โ€ข setInterval()

โ€ข Some browser events

Example:

console.log("Start");

setTimeout(() => {
console.log("Timeout");
}, 0);

Promise.resolve().then(() => {
console.log("Promise");
});

console.log("End");


Output:

Start

End

Promise

Timeout

Why?

After the synchronous code finishes, the runtime processes available microtasks before moving to the next task.

So:

Synchronous code
โ†“
Microtasks
โ†“
Next task / macrotask


โค๏ธ Double Tap For Part 9
โค1
๐Ÿš€ ๐—ช๐—ถ๐—ฝ๐—ฟ๐—ผ ๐—˜๐—น๐—ถ๐˜๐—ฒ ๐—ก๐—ง๐—› & ๐—ง๐˜‚๐—ฟ๐—ฏ๐—ผ ๐—™๐—ฅ๐—˜๐—˜ ๐—œ๐—ป๐˜๐—ฒ๐—ฟ๐˜ƒ๐—ถ๐—ฒ๐˜„ ๐—ž๐—ถ๐˜ ๐Ÿ’ป๐Ÿ”ฅ

Get access to a FREE interview preparation kit and prepare smarter for your upcoming assessment & interview rounds.

๐Ÿ“š Prepare For:-
โœ… Technical Interview Questions
โœ… Software Engineer Interview Rounds
โœ… Interview Preparation Resources

๐ŸŽฏ Perfect for Students | Freshers | Engineering Graduates | Wipro Aspirants

๐Ÿ”— ๐—š๐—ฒ๐˜ ๐—™๐—ฅ๐—˜๐—˜ ๐—œ๐—ป๐˜๐—ฒ๐—ฟ๐˜ƒ๐—ถ๐—ฒ๐˜„ ๐—ž๐—ถ๐˜ ๐Ÿ‘‡:-

https://pdlink.in/4zh9E6g

๐Ÿ”ฅ Start preparing early and improve your chances of cracking the Wipro hiring process!