📚 JavaScript Concepts & DSA Practice
Explore different topics and practice JavaScript concepts and DSA questions.
🧠Core JS Concepts
- Basic Concepts - JavaScript basic concepts include variables, data types, operators, control flow, functions, and loops used to build Program logic.
- Accessing Properties - Retrieving the value of an object’s property using dot notation or bracket notation in JavaScript.
- Coercion - The automatic or manual conversion of a value from one data type to another (e.g., number to string or string to boolean) in JavaScript.
- Control Statement - Control statements manage the flow of program execution using conditions and loops such as if, switch, for, and while.
- For-Each - forEach() executes a provided function once for each element in an array without returning a new array.
- For-of - for…of iterates directly over the values of iterable objects like arrays, strings, and sets.
- For-in - for…in iterates over the enumerable property keys of an object (or indexes of an array).
- let-var-const - var is function-scoped, let is block-scoped, and const is block-scoped and cannot be reassigned.
- Map Method - map() creates a new array by applying a function to each element of an existing array.
- Math Methods - Math methods provide built-in functions like Math.round(), Math.floor(), and Math.random() to perform mathematical calculations in JavaScript.
- Object Methods - Object methods are built-in functions like Object.keys() and Object.values() used to work with object properties and values.
- Parameter Argument - Parameters are variables defined in a function declaration, while arguments are the actual values passed to the function when it is called.
- Reduce Method - The reduce() method executes a reducer function on each array element to accumulate a single output value.
- Rest and Spread Operator - The ... operator collects multiple elements into an array (rest) or expands elements from an array or object (spread).
- Scope - Scope determines the accessibility and lifetime of variables in different parts of a JavaScript program.
- Set Map - Set stores unique values, while Map stores key–value pairs with keys of any type in JavaScript.
- slice_splice_split - slice() extracts a portion of an array or string, splice() modifies an array by adding or removing elements, and split() divides a string into an array based on a separator.
- sort_join_some_every - join() combines array elements into a string, some() checks if at least one element meets a condition, and every() checks if all elements satisfy a condition.
- How to use this - The this keyword refers to the object that is currently executing the function in JavaScript.
- DOM - The Document Object Model (DOM) represents an HTML or XML document as a tree structure, allowing JavaScript to access and manipulate elements dynamically.
🙄 Intermediate JS Concepts
- CallBack Hell:- A situation in JavaScript where multiple nested callbacks make the code difficult to read, maintain, and debug.
- Closure:- A closure is a function that remembers and accesses variables from its outer scope even after that scope has finished executing.
- Debouncing_Throttling:- debouncing delays function execution until after a pause, while throttling limits how often a function runs over time.
- Template Literal:- Template literals allow embedding variables and expressions inside strings using backticks (`) and ${} syntax.
- Destructuring Stringify Parse:- Destructuring extracts values from arrays or objects, JSON.stringify() converts objects to JSON strings, and JSON.parse() converts JSON strings back to objects.
- Event Bubbling Capturing:- Event capturing triggers handlers from the outer element to inner, while event bubbling triggers them from the inner element to outer in the DOM event flow.
- Event Deligation:- Event delegation handles events at a parent element instead of individual child elements by using event bubbling to manage multiple child events efficiently.
- Event Loop:- The event loop continuously monitors the call stack and task queues, pulling callbacks and microtasks (like promises) to enable non-blocking asynchronous execution in JavaScript.
- Execution Context:- The execution context is the environment in which JavaScript code runs, defining how variables, functions, and this are accessed during execution.
- Filter Methods:- The filter() method creates a new array containing only the elements that satisfy a specified condition.
- Hoisting:- Hoisting is JavaScript’s behavior of moving variable and function declarations to the top of their scope before code execution.
- lazy_loading memoization:- Lazy loading delays loading a resource until it's needed, while memoization stores and reuses function results to avoid repeated calculations.
- Local SessionStorage:- localStorage stores data permanently until manually cleared, while sessionStorage stores data only for the duration of the page session.
- Promise:- A promise is an object that represents the eventual completion or failure of an asynchronous operation in JavaScript.
- Pure Impure:- A pure function always returns the same output for the same input without side effects, while an impure function may change external state or produce different results.
- Shallow Copy Deep Copy:- A shallow copy copies only the top-level properties of an object, while a deep copy duplicates all nested objects and structures independently.
- Synchronous Asynchrouns Function:- Synchronous code runs line-by-line and blocks execution, while asynchronous code runs without blocking and handles operations in the background.
- Prototype VS Class:- Prototype is JavaScript’s underlying inheritance mechanism, while classes provide a cleaner, modern syntax on top of prototypes for creating objects and handling inheritance.
- Anonymous Functions:- Anonymous functions are functions defined without a name, often used as callbacks or inline function expressions.
- Arrow Functions:- Arrow functions provide a shorter syntax for writing functions and automatically bind this to the surrounding scope.
- Callback Functions:- A callback function is a function passed as an argument to another function to be executed later.
- Function Expression:- A function expression defines a function as part of a variable assignment or within another expression instead of declaring it by name.
- Higher Order Function:- A higher-order function is a function that takes other functions as arguments or returns a function as its result.
- IIFE Functions:- An IIFE (Immediately Invoked Function Expression) is a function that runs automatically as soon as it is defined.
- Async Functions:- An async function is a function that returns a promise and allows using await to handle asynchronous operations more easily.
- Recursive Function:- A recursive function is a function that calls itself until a specified condition is met.
- Constructure Function:- A constructor function is a special function used to create and initialize objects using the new keyword.
- Named Functions:- A named function is a function declared with a specific name, making it reusable and easier to identify in debugging.
- Call Bind Apply:- call() and apply() invoke a function with a specified this value, while bind() returns a new function permanently bound to that value.
- Find FindIndex:- find() returns the first element that matches a condition, while findIndex() returns the index of that matching element.
- Includes Search Startwith Endwith:- startsWith() checks if a string begins with a value, endsWith() checks if it ends with a value, search() finds the position of a match using a regex, and includes() checks if a value exists inside a string or array.
- IndexOf_LowerCse_UpperCase:- indexOf() returns the position of a value in a string or array, while toLowerCase() and toUpperCase() convert text to lowercase or uppercase.
- Push Pop:- push() adds elements to the end of an array, while pop() removes the last element from an array.
- Replace charAt trim:- replace() substitutes part of a string, charAt() returns the character at a specific index, and trim() removes whitespace from both ends of a string.
😎 Advance JS Concepts
- Async and Defer:- async loads scripts in parallel and executes them as soon as they’re ready, while defer loads scripts in parallel but executes them only after the HTML is fully parsed.
- Promise:- A promise is an object that represents the eventual result (success or failure) of an asynchronous operation.
- Lazy Loading and Memoization:- Lazy loading delays loading a resource until it’s needed, while memoization caches a function’s results to avoid repeated calculations.
- DebouncingVsThrottling - Debouncing delays a function until the user stops triggering it, while throttling limits how often a function can run over time.
- Event Loop - The event loop manages the execution of asynchronous code by moving tasks from the queue to the call stack when it becomes empty.
- Execution Context - The execution context is the environment where JavaScript code runs, determining how variables, functions, and this are accessed.
- Closure:- A closure is a function that remembers and can access variables from its outer scope even after that scope has finished executing.
- Currying:- Currying transforms a function so that it takes one argument at a time, returning a new function for each remaining argument.
- PrototypeVsClass:- Prototype is JavaScript’s native inheritance system, while classes provide a cleaner, more structured syntax built on top of prototypes.
- SynchronousVsAsynchronous:- Synchronous code runs one task at a time in order, while asynchronous code allows other tasks to run without waiting.
- ShallowCopyVsDeepcopy:- Shallow copy copies only top-level references, while deep copy creates a fully independent clone of all nested data.
😎 DSA Problem Solving 🤨