├── Chp-1 └── README.md ├── Chp-2 └── README.md ├── Chp-3 └── README.md ├── Chp-4 └── README.md ├── Chp-5 └── README.md ├── Chp-6 └── README.md ├── Chp-7 └── README.md └── README.md /Chp-1/README.md: -------------------------------------------------------------------------------- 1 | ## CHAPTER 1 - JS CODE EXECUTION 2 | 3 | Many of us might know how to write a program in JavaScript and don't exactly understand how it works under the hood. 4 | 5 | So let's explore this today! 6 | 7 | How our JS code gets executed what are the different phases and steps that come into play. 8 | 9 | ![image](https://user-images.githubusercontent.com/42679346/126876041-c107ca41-331f-49b2-9969-4306fcf865a4.png) 10 | 11 | 12 | ### Definition of JavaScript: 13 | 14 | JS is a single-threaded, lightweight, dynamically interpreted, and just-in-time compiled programming language with first-class functions. 15 | 16 | Let’s deconstruct each of these building components of JS: 17 | 18 | > **_Single threaded_** 19 | 20 | JS Can only execute one thing at a time (Will discuss this in detail below :- ) 21 | 22 | > **_Lightweight_** 23 | 24 | It is called a lightweight lang because it does not come with many type constructs and syntactic requirements. 25 | 26 | Everything is a object in JS which makes it easy and flexible to use and understand. 27 | This feature makes JS a multi-paradigm language. 28 | 29 | > **_First class fn:_** 30 | 31 | JS is a higher-order first class functional programming language because we can pass around function and return a function from anywhere in our code 32 | This is possible in JS because everything including functions is an Object. 33 | 34 | > **_JIT_** 35 | 36 | Just in time aka JIT compilation 37 | Unlike other statically typed languages like C / C++ 38 | JS does not gets compiled beforehand instead it undergoes JIT compilation. 39 | 40 | This basically means that the code is compiled in the memory just before it gets executed. 41 | 42 | This is what makes JS dynamic because it is decided at the time of execution that what type a variable will store and it can change during the course of program. 43 | 44 | You may ask Why is this important ? 45 | 46 | - It’s because our browser’s JS engine can only execute machine level code not the source code we provide. 47 | - It converts our source code to bytecode inside the memory and feeds it to the JS engine to execute that code 48 | 49 | ### What are JS engines ? 50 | 51 | - These are responsible for executing our JS code and interacting with the surrounding Environment APIs. 52 | - Each Browser vendor have their own engine that follows Ecmascript guidelines. 53 | Example : V8 (Chrome) SpiderMonkey (Firefox) Nitro (Safari) 54 | 55 | ### What is execution context? 56 | 57 | An execution context is an abstract concept of an environment where the Javascript code is evaluated and executed. Whenever any code is run in JavaScript, it’s run inside an execution context. 58 | 59 | When a JavaScript Engine executes a script, it creates execution contexts. Each execution context has two phases. 60 | 61 | - The Creation Phase 62 | - The Execution Phase 63 | 64 | Let's take an example to understand it. 65 | 66 | ![image](https://user-images.githubusercontent.com/42679346/126876053-d455a66e-c83f-4c6b-9513-159618be3dc1.png) 67 | 68 | 69 | ### The Creation Phase: 70 | 71 | When a script executes for the first time, JavaScript Engine creates a global execution context. During the creation phase following tasks are performed: 72 | 73 | #### Task 1: 74 | 75 | Creation of a global object i.e. "window" in the browser (or in "global" node). 76 | 77 | #### Task 2: 78 | 79 | Creation of a "this" object binding that points to the global object created above. 80 | 81 | #### Task 3: 82 | 83 | Setting up a "Memory Heap" for storing variables and function reference. 84 | 85 | #### Task 4: 86 | 87 | Storing the function declarations in the memory heap and variables within the global execution context with the initial values as undefined. 88 | 89 | ![image](https://user-images.githubusercontent.com/42679346/126876059-1bdcb9a8-2539-4fa9-9034-aa1679a51572.png) 90 | 91 | 92 | ### The Execution Phase: 93 | 94 | During the execution phase the JavaScript Engine executes the code line by line. In this phase, it assigns values to the variables and executes the function calls. 95 | Note: For every function call, the JavaScript Engine creates a new Function Execution Context. 96 | 97 | ![image](https://user-images.githubusercontent.com/42679346/126876063-c4f40ee3-dff2-4cd5-8a51-199b1ca74088.png) 98 | 99 | ### Function Execution Context vs Global Execution Context: 100 | 101 | The Function Execution Context is similar to the Global Execution Context but instead of creating the global object, it creates the arguments object that contains a reference to all the parameters passed into function. 102 | -------------------------------------------------------------------------------- /Chp-2/README.md: -------------------------------------------------------------------------------- 1 | ## CHAPTER 2 - HOISTING IN JS 2 | 3 | A lot of people would tell you that "Hosting" meaning variables physically moved to the top. 4 | 5 | For many Beginners, it seems like some spooky weird stuff is happening behind the scenes but don't quite understand it. 6 | 7 | What do you think? Is moving on top is Hosting or its something different. 8 | 9 | Lets Demystify this in our today's chapter - 10 | 11 | ![image](https://user-images.githubusercontent.com/42679346/127195623-65e9a553-7f5a-4928-b687-2ec50e73033b.png) 12 | 13 | MDN Docs says : 14 | > Variable and function declarations are physically moved to the top of your code, but this is not in fact what happens. 15 | > Instead the variables and function declarations are put into memory during compile phase, but stays exactly where you typed them in your code 16 | 17 | ### What Actually Happens: 18 | 19 | To fully understand hoisting, you should know how code is executed in JavaScript. 20 | 21 | If you don't know, check it out : [How JS code is Executed](https://twitter.com/smileguptaaa/status/1418976271913021440?s=20) 22 | 23 | ### Example 1: 24 | 25 | Can you try guessing the output for this code ? or Will you get any errors by writing it in such a way? 26 | 27 | ![image](https://user-images.githubusercontent.com/42679346/127196176-48fb02a5-f423-41e4-ba4d-03947acd2afa.png) 28 | 29 | 30 | ### Solution: 31 | 32 | ![image](https://user-images.githubusercontent.com/42679346/127196203-3793c92a-1864-4214-93af-e08791c1e31a.png) 33 | 34 | ### Explanation: 35 | 36 | Here, although the variable "greeting" is used before it is declared, you won't see any errors due to the concept of hoisting. 37 | 38 | ### Behind the Scene: 39 | 40 | When I ran this code, what will happen is: ( as mentioned above) code execution takes place in 2 steps. 41 | 42 | During the creating phase of global execution context the JS Engine places the variable greeting in the memory and initialises its value to "undefined". 43 | 44 | Similar to variables, functions are also hoisted in JavaScript. 45 | 46 | Here is an example: 47 | 48 | ![image](https://user-images.githubusercontent.com/42679346/127196785-e0d4edb7-cea1-4f2f-bd5a-410302a559c0.png) 49 | 50 | 51 | ### Example 2: 52 | Can you guess what will happen here: 53 | 54 | ![image](https://user-images.githubusercontent.com/42679346/127196893-64a855d1-2f96-4179-8aed-ffc6fb832b83.png) 55 | 56 | 57 | Solution: 58 | 59 | ![image](https://user-images.githubusercontent.com/42679346/127196967-aa623879-9113-44f9-b39a-9854bd82180e.png) 60 | 61 | So what just happened? Didn't I say that functions are also hoisted just like variables. 62 | 63 | I still stand by my statement, both variables and functions are hosted. 64 | 65 | If you carefully see the example 2, I wrote a function expression and not function. 66 | 67 | 68 | There is a significant difference between function and function expression. This I will discuss in my upcoming tweets. 69 | 70 | For now, just remember: 71 | - Functions and Function Expressions are different. 72 | - Functions can be hoisted and Function Expressions don't. 73 | 74 | 75 | ### Question Time: 76 | 77 | Are let and const variable declarations also hoisted? 78 | 79 | It's a myth, that let and const are not hoisted. In reality they are hoisted. 80 | 81 | For the ES6 features like let and const the creation phase works quite differently 82 | 83 | It still goes through the code and allocates spaces for variables but the initializer sets the variable with a special mode called TDZ (Temporal Dead Zone) which means the variable exists but they cannot be accessed before their declarations. 84 | 85 | ### TDZ: 86 | 87 | It is a behaviour in JS that occurs when declaring a variable with let and const. In ES6, accessing a let or const before its declaration cause ReferenceError. The time span when that happens between the creation of variable binding and its declaration is The Temporal Dead Zone. 88 | 89 | To Sum up in case of: 90 | 1) var, let and const - Hoisting ✅ 91 | 2) Functions - Hoisting ✅ 92 | 3) Function Expressions - Hoisting ❎ 93 | 4) Arrow Functions - Hoisting ❎ 94 | 95 | ### Whats Next: 96 | Thanks for reading this thread on "Hoisting". In the next tweet of this series, we shall take a look at Closures 97 | Stay tuned and cheers! 98 | 99 | 100 | 101 | 102 | 103 | -------------------------------------------------------------------------------- /Chp-3/README.md: -------------------------------------------------------------------------------- 1 | ## CHAPTER 3 - CLOSURES 2 | 3 | Coding in JavaScript without an understanding of closures is like trying to speak English without an understanding of grammar rules — you might be able to get your ideas across, but probably a bit awkwardly. 4 | 5 | So Let's start Demystifying Closures - 6 | 7 | ![image](https://user-images.githubusercontent.com/42679346/128040634-7e20ebbb-f795-4122-85f4-6e0a29260006.png) 8 | 9 | MDN docs says: 10 | 11 | >A closure is the combination of a function bundled together with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function’s scope from an inner function. 12 | 13 | In Simple words: 14 | A function bundled together with its lexical environment. In other words, it is an inner function which has access to variable of outer function. 15 | 16 | Note: Closure will remember the reference of a particular value in its lexical scope and not its value. 17 | 18 | Example: 19 | 20 | ![image](https://user-images.githubusercontent.com/42679346/128040891-d36eedfb-b58e-4d28-b41a-4551466515a9.png) 21 | 22 | The amazing thing is, even if the outer function returns the inner function then also inner function will have access to outer function variables.1 23 | 24 | In other programming languages if a function returns then it becomes ready for garbage collection or is completely removed from the heap, but in Javascript if there is closure then the parent function variables remain in the heap. 25 | 26 | ## Example: This is the interview question from Razorpay 2021 27 | 28 | Can you try solving it ? 29 | Hint: You have to return a function which will take one parameter and you need to return a closure. 30 | 31 | ![image](https://user-images.githubusercontent.com/42679346/128041006-567ddd8a-868c-402d-9c86-be22c299703d.png) 32 | 33 | 34 | If you carefully notice this solution and compare it with the definition of closure, you will notice function which I have created returns the addition of N (parameter) and input (variable present in its lexical environment). 35 | 36 | ![image](https://user-images.githubusercontent.com/42679346/128041674-bbfee82a-5734-4de8-8930-ac80a5415011.png) 37 | 38 | 39 | ## Uses of Closure: 40 | 41 | 1) Module Design Pattern 42 | 2) Currying 43 | 3) setTimeouts 44 | 4) Iterators 45 | 5) Memoize 46 | 6) To maintain state in Async world 47 | 48 | ## Advantages of Closure: 49 | 50 | 1) Callbacks implementation in javascript is heavily. dependent on how closures work. 51 | 2) Mostly used in Encapsulation of the code. 52 | 3) Also used in creating API calling wrapper methods. 53 | 54 | ## Disadvantages of Closure: 55 | 56 | 1) Variables used by closure will not be garbage collected. 57 | 2) If closures will not be handled correctly it will result to memory leaks 58 | 59 | 60 | ## Bonus - What is Garbage Collector 61 | 62 | It's basically a program run by JS Engine to monitor memory allocation and determine when a block of allocated memory is no longer needed and reclaim it. 63 | 64 | ## Whats Next: 65 | 66 | Thanks for reading this chapter on "Closures". In the next chapter of this series, we shall take a look at Callbacks. 67 | Stay tuned and cheers! 68 | 69 | Content Credits: 70 | @smileguptaaa @jha_bisu 71 | -------------------------------------------------------------------------------- /Chp-4/README.md: -------------------------------------------------------------------------------- 1 | ## CHAPTER 4 CALLBACKS 2 | 3 | Hey folks! So far in JS Lab, we discussed how code gets executed and what exactly closure means in JS. 4 | 5 | Moving ahead, another important topic in understanding JS is learning about its asynchronous capabilities. 6 | 7 | Let’s discuss these today and look into callbacks. 8 | 9 | 10 | ![image](https://user-images.githubusercontent.com/42679346/128609841-3d888091-60d4-45a8-abde-c195d23f3b5d.png) 11 | 12 | What are callbacks: 13 | 14 | Before we throw some technical jargons at you, let me give you an analogy. 15 | 16 | How does the postal service work? 17 | 18 | Say I wanted to send some message to my friend (Cool down Gen-z devs, We didn’t have phone back then). 19 | So I wrote my message on a letter and gave it to the postman. 20 | He then takes my letter and delivers it to the desired address. 21 | Once the letter reaches my friend , He can open it and read that letter and my message will be delivered. 22 | 23 | (Thank God Mobile phones were invented!) 24 | 25 | This model here is what we refer to as ***callbacks***. 26 | 27 | And the flow of information here is what we called ***asynchronous***. 28 | 29 | ### Technical Definition: 30 | 31 | A callback is a procedure / method that is to be invoked at a later point of time. 32 | 33 | Callbacks are what provides asynchronous functionalities to Javascript. It’s an integral part of building modern day web application. 34 | 35 | It involves passing a function as a parameter to another function which is then invoked in some other environment when a subscribed event occurs. 36 | 37 | PS: We can pass function reference as a parameter because they are basically objects under the hood. 38 | 39 | 40 | ### Example 1: 41 | 42 | - We setup a ‘click’ listener on our button element and we want to execute some code every time a button is pressed. 43 | - Here each button press is an event that occurs. 44 | 45 | ![image](https://user-images.githubusercontent.com/42679346/128609967-ffefb5e1-ccb2-438a-a233-089cacd101c7.png) 46 | 47 | 48 | In order to execute some code for that we have registered a foo function which acts as a callback which gets invoked every time a button click happens. 49 | 50 | This asynchronous nature that callbacks provide us , makes it easy to structure our application based on event models. 51 | 52 | ### Example 2: 53 | 54 | What if we want to delay some code executions and execute that after x unit time has passed. 55 | Say we need to greet the user after 5s. 56 | 57 | Usually, code can only get executed one by one, but if we want this required behavior. 58 | setTimeout can help us with that. 59 | 60 | ### setTimeout: 61 | 62 | The function that we provide to setTimeout acts as a callback function which gets executed after delay time 63 | 64 | Syntax: setTimeout(fn, delay) 65 | 66 | ![image](https://user-images.githubusercontent.com/42679346/128610005-9b618ab7-67b8-47b2-8c1b-111b5126f9de.png) 67 | 68 | 69 | Callbacks are awesome and opens a whole new dimension of async JS to us. 70 | But there might arise some problem when you have to execute some code only after previous timeout has occurred. 71 | 72 | ### Example 3 73 | 74 | Say I want to print 75 | - 1 to console after 3s 76 | - 2 to console after 6s 77 | - 3 to console after 9s 78 | 79 | What we can do is use nested setTimeout here as shown: 80 | 81 | ![image](https://user-images.githubusercontent.com/42679346/128610041-febeb665-0a61-4abf-a2eb-940fa2e02849.png) 82 | 83 | Here you see how the nesting of callbacks becomes difficult to parse and maintain. 84 | 85 | Since this used to occur so frequently that developers have a name for this called as “Callback hell”. 86 | 87 | To solve this we have "Promises" which we will see in next chap. 88 | 89 | 90 | -------------------------------------------------------------------------------- /Chp-5/README.md: -------------------------------------------------------------------------------- 1 | ## CHAPTER 5 - PROMISES 2 | 3 | Promises are one of the ways by which we can deal with asynchronous operations in JavaScript. Many people struggle in understanding, how Promises work. 4 | 5 | Demystifying Promises : 6 | 7 | ![image](https://user-images.githubusercontent.com/42679346/128611153-9c659e2f-cbca-4b1b-badf-9041cfdeaa9f.png) 8 | 9 | ### MDN Says: 10 | 11 | It is a proxy for a value not necessarily known when the promise is created. It allows you to associate handlers with an asynchronous action's eventual success value or failure reason. 12 | 13 | Theoretically, JS promises are no different than the real life promises — when coupled with result oriented conditions. 14 | 15 | In Other Words: 16 | 17 | Promise is an action which guarantees a result in future, the result could be the expected one(positive) and if anything goes wrong, the result will be something which was not anticipated(negative). While doing the promise we also close on the conditions - what if 18 | 19 | 20 | Promises in JavaScript is in one of these states: 21 | - Pending: initial state, neither fulfilled nor rejected 22 | - Fulfilled(resolved): meaning that the operation was completed successfully 23 | - Rejected: meaning that the operation failed 24 | 25 | 26 | 27 | ### Example 1: 28 | 29 | John lives with his mom. He is a very good boy except he does not like to clean his room. 30 | 31 | Everyday he seeks his mom's permission in evening to go out and play with his friends. 32 | 33 | One day, in order to make John clean his room, his mom added a condition on him. 34 | 35 | 36 | ![image](https://user-images.githubusercontent.com/42679346/128611204-a653375e-3b48-40ed-bd2a-2ce3c464f9e8.png) 37 | 38 | 39 | Two things will happen here 40 | 1) If John is able to clean his room(fulfilling the promise condition): He goes out for football. 41 | 42 | 2) But what if he does not clean(failing to complete the promise condition): he needs to do the laundry. 43 | 44 | Let's see same situation in code base. 45 | 46 | ### Constructing Promise: 47 | 48 | ![image](https://user-images.githubusercontent.com/42679346/128611214-b8c2da72-a6b9-4c35-93c4-f2abbfaea4dc.png) 49 | 50 | ### Returning Promise: 51 | 52 | ![image](https://user-images.githubusercontent.com/42679346/128611222-88a3348b-7032-448b-b75e-34f4518ce323.png) 53 | 54 | ### Why do we use Promises: 55 | 56 | Promise(s) is the antidote to Callback-hell. It’s a new way to introduce asynchronous callbacks without having to deal with ‘Pyramid of doom’. 57 | 58 | 59 | -------------------------------------------------------------------------------- /Chp-6/README.md: -------------------------------------------------------------------------------- 1 | ## CHAPTER 6 - IIFE 2 | 3 | Hi Everyone! We are back with yet another episode of JS Lab. 4 | 5 | In this chapter, you will be learning everything about *"Immediately Invoked Function Expression"* a.k.a IIFE. 6 | 7 | Demystifying IIFE 👇🏻 8 | 9 | ![image](https://user-images.githubusercontent.com/42679346/130602960-b6c671c8-22eb-4669-9c41-e4e7164aed8b.png) 10 | 11 | IIFE is a JavaScript Function that runs as soon as it is defined. It is a design pattern that essentially contains two parts: 12 | 13 | - It is an anonymous function with its lexical scope enclosed within parenthesis ( ). 14 | - Creates the immediately invoked function expression ( ). 15 | 16 | ### Why do we need IIFE: 17 | We know that functions in JS have local scope. For eg: there are multiple .js files in your applications over a while. It's highly possible that functions with the same name exist across files. 18 | 19 | In such scenarios, a single web page could include all these .js files, polluting the global scope by having two or more functions/variables with the same name. 20 | 21 | ### How to write IIFE: 22 | IIFEs are very useful because they don't pollute the global object and they are a simple way to isolate variable declarations. 23 | 24 | This is the syntax of IIFE: 25 | 26 | ![image](https://user-images.githubusercontent.com/42679346/130603375-4b9391b5-5cb0-4ac3-9120-10f8f26f03ba.png) 27 | 28 | IIFEs can also be defined with arrow functions. 29 | 30 | ![image](https://user-images.githubusercontent.com/42679346/130603433-2437da6e-f27a-4be0-8e6c-8b770878c828.png) 31 | 32 | Here is a comparison between a normal function definition and IIFE. 33 | 34 | ![image](https://user-images.githubusercontent.com/42679346/130603502-42cb1046-0f55-416d-ad05-eeaaa0d4cc93.png) 35 | 36 | 37 | -------------------------------------------------------------------------------- /Chp-7/README.md: -------------------------------------------------------------------------------- 1 | ## CHAPTER 7 - Array and Array Methods 2 | 3 | Programming is all about data manipulation. 4 | 5 | Hence it becomes essential to understand how we store them and how we apply various operations to that data 6 | Thus today we will be discussing Arrays and useful operations that you can perform on them. 7 | 8 | ![image](https://user-images.githubusercontent.com/42679346/130608542-a70a17c3-7fbd-4d51-8c67-aa2cc0a68055.png) 9 | 10 | So far we know how to store data in a variable 11 | Say a number -> let number = 5 12 | 13 | But how do you store a bunch of data together as a collection say (4,5,6,7,8)? 14 | 15 | This is where Array comes in! 16 | 17 | An array is a Data Structure that stores and represents a collection of data in the form of a list. 18 | 19 | It stores data as elements in a sequential manner and retrieves them back via index position when you need them. 20 | 21 | Example 1: 22 | 23 | ![image](https://user-images.githubusercontent.com/42679346/130608741-941e6d37-7945-4c2d-961f-367b70648675.png) 24 | 25 | Now I can access each of these via square bracket syntax `[]` 26 | 27 | - listOfMovies[0] // 'Inception' 28 | - listOfMovies[1] // 'Fight Club' 29 | - listOfMovies[2] // 'The Matrix' 30 | - listOfMovies[3] // 'Memento' 31 | 32 | Array Data Type is characterized by the length property present. 33 | 34 | listOfMovies.length // 2 35 | 36 | Since JS is a dynamically typed language, arrays can be a collection of elements of any type 37 | 38 | Example 2: 39 | 40 | ![image](https://user-images.githubusercontent.com/42679346/130608833-6b384faf-2cfc-4606-9d1d-1ddf19c015f8.png) 41 | 42 | ### Create a new array: 43 | There are various ways of creating a new Array but the most common ways are: 44 | 45 | 1) Square Bracket Syntax 46 | 47 | 2) new Array() 48 | 49 | 3) Array.of (Similar to Array constructor) 50 | 51 | 4) Array.from (Used to create a list like an object to actual Array) 52 | 53 | ![image](https://user-images.githubusercontent.com/42679346/130608904-0e20672f-f8ec-494c-ba90-dd82e83e97c1.png) 54 | 55 | ### Useful Array Methods: 56 | 1) push() – Insert an element at the end of the array. 57 | 58 | 2) unshift() – Insert an element at the beginning of the array. 59 | 60 | 3) pop() – Remove an element from the end of the array. 61 | 62 | ![image](https://user-images.githubusercontent.com/42679346/130608960-77986a36-293d-42ac-adb0-dd0f9de0c7a4.png) 63 | 64 | 65 | 4) shift() – Remove an element from the beginning of the array. 66 | 67 | 5) slice() – Create a shallow copy of an array. 68 | 69 | 6) length – Determine the size of an array. 70 | 71 | ![image](https://user-images.githubusercontent.com/42679346/130609013-ff1f4901-5da6-4b99-b350-b1af75798759.png) 72 | 73 | 74 | ### Array Iterator Methods: 75 | These are very useful methods that allow us to iterate over each element of the array and perform transformations, filtering out stuff, and more in a streamlined manner. 76 | 77 | Below are the most widely used methods: 78 | 1. map 79 | 2. filter 80 | 3. reduce 81 | 4. some 82 | 5. find 83 | 84 | 85 | >Note: All the above-mentioned methods are first-class functions that take another function as an argument wherein we specify the logic to iterate and apply in that function. 86 | 87 | ### Map: 88 | 89 | The map() method returns a new array by iterating through the elements and applying the provided transformation function. 90 | 91 | Example: Let's map out a num array to its corresponding squared array 92 | 93 | ![image](https://user-images.githubusercontent.com/42679346/130609174-24eea0fe-5625-4a75-a086-e80445ff72cc.png) 94 | 95 | ### Filter: 96 | The filter() method returns a new array with all the elements that satisfy the condition mentioned in the predicate function. 97 | 98 | Example: 99 | 100 | ![image](https://user-images.githubusercontent.com/42679346/130609225-d86f9efb-f087-4b6a-a875-9cf1c820a0cd.png) 101 | 102 | 103 | ### Reduce: 104 | 105 | The reduce() method applies a reducer function on each of the elements and returns an output value. 106 | Reducer function accepts 2 arguments `acc` which stores accumulated value till current execution and `curr` stores current element value. 107 | 108 | ![image](https://user-images.githubusercontent.com/42679346/130609290-04ccec83-2723-4811-a029-72f008529338.png) 109 | 110 | ### Some: 111 | The some() method returns a boolean value depending upon whether the predicate condition is being satisfied (true) or not (false). 112 | 113 | ![image](https://user-images.githubusercontent.com/42679346/130609369-f72c11b0-b82c-42bb-836d-f869b490be93.png) 114 | 115 | ### Find: 116 | It returns the first matched element from the array that satisfies the condition in the function. 117 | 118 | Example - Let's return the age of the first person that is greater than 30. 119 | 120 | 121 | ![image](https://user-images.githubusercontent.com/42679346/130609435-c6d2351f-c5e7-421a-81e4-7691a1005e81.png) 122 | 123 | ### More Array Methods: 124 | 125 | ![image](https://user-images.githubusercontent.com/42679346/130609467-575496b4-88dc-44df-a16d-4961ec362946.png) 126 | 127 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # JS-LAB 2 | Place where we explore about JS topics 3 | 4 | Js lab is a twitter series we are launching to cover Js concepts and topics 5 | Ranging from Intermediate to Advance level to take your development journey to the next level and understand ins and outs of JS. 6 | 7 | *⭐ this Repo and be ready for some awesome content coming your way!* 8 | 9 | ![image](https://user-images.githubusercontent.com/42679346/126431134-93d9e024-47c6-47ef-acb3-e8e50ea13f27.png) 10 | 11 | 12 | ## Why Name JavaScript Lab: 13 | 14 | As the name suggests, Lab is a place where we experiment and play with random things. Here we will be experimenting with JavaScript, so we named it JavaScript Lab a.k.a. JS Lab. 15 | 16 | ## Why series on JavaScript: 17 | - JS is the language of web. 18 | - It’s the core Building block of developing modern day Web/Native Applications. 19 | - It makes our web app Interactive and Dynamic. 20 | - It is everywhere from frontend to backend to DB servers you name it and you’ll find JS there. 21 | 22 | ## What's in for you: 23 | - You’ll learn everything right from Intermediate JS till Advanced level. 24 | - We’ll cover topics that will help you in your day to day development along with most frequently asked JS interviews questions. 25 | 26 | ## Schedule of the tweets: 27 | - We roll out thread on new topics every Tuesday and Saturday so stay tuned for some exciting content coming your way. 28 | 29 | ## About Content Creators and Delivery: 30 | It is a joint effort added by Smile and Bishwajit. For this first series, we will role it out on 31 | Twitter - @smileguptaaa. 32 | If the response will be good ( in near future) we have plans to have a dedicated page for JS Lab here on Twitter itself. 33 | 34 | ## About Smile Gupta: 35 | 36 | She is Engineer by choice and community contributor by passion. She is into Web Dev from last 1.5years. Currently 37 | She is currently working in 38 | @KonfHub and an Incoming Frontend Engineer in 39 | @RazorpayEngg 40 | 41 | Twitter: [@smileguptaaa](https://twitter.com/smileguptaaa) 42 | 43 | Github : [smilegupta](https://github.com/smilegupta) 44 | 45 | 46 | ## About Bishwajit Jha: 47 | He make software to solve real-world problems, CS Undergrad, 21 | Building amazing projects and contributing to open source for the past 3 years. 48 | He is currently working in @voicezen 49 | 50 | Twitter : [@jha_bisu](https://twitter.com/jha_bisu) 51 | 52 | Github : [ajitjha393](https://github.com/ajitjha393) 53 | 54 | 55 | 56 | --------------------------------------------------------------------------------