I use to think "Call, apply and bind " was just a theoritical nothing practical thing but this is the first time I actually understood the Use Case of "CALL" , one of the best Lecture thanks sir. Again Thanks a lot.
🎯 Key Takeaways for quick navigation: 00:00 📜 *Introduction to Video and Keywords* - Brief introduction to the video and its purpose. - Emphasis on the importance of understanding keywords. - Mention of the tendency to rush through topics in courses. 00:29 🗂️ *Different Keywords and their Usage* - Explanation of the variety of keywords used in the script. - Noting that multiple keywords are often combined and explained together. - Suggestion to understand keywords at different time durations for better comprehension. 01:10 🚀 *Evolution of React and Coding Practices* - Historical perspective on React's early versions and coding practices. - Description of the initial challenges due to limited language features. - Transition from minimalistic coding to the current abundance of language features and libraries. 01:54 🔄 *Execution Context and Function Interaction* - Explanation of the global execution context and its persistence. - Illustration of how functions maintain their execution context. - Emphasis on the memory and context carried by functions during execution. 02:34 🔄 *Execution Context and Function Relationships* - Explanation of execution context in JavaScript functions. - Advantages of visualizing code through diagrams. - Illustration of the global execution context and nested function contexts. 03:00 🗃️ *Understanding Execution Context Hierarchy* - Introduction to the concept of execution context hierarchy. - Overview of the global execution context and its position in the hierarchy. - Explanation of how nested functions create their own execution contexts. 03:29 🔍 *Challenges with Execution Context References* - Discussion on the challenges of referencing execution contexts in nested functions. - Examination of how 'this' keyword behaves in different contexts. - Highlighting the complexities when functions refer to outer execution contexts. 04:10 🧩 *Troubleshooting Global Execution Context Issues* - Explanation of problems arising from global execution context references. - Introduction to the 'this' keyword and its role in context resolution. - Discussion on common issues related to referencing objects in different contexts. 05:07 🔄 *Overlapping Abstraction in Real-world Scenario* - Discussion on the persistent problem of overlapping abstraction in real-world scenarios. - Introduction to a practical example to illustrate the issue. - Creation of a new file named 'dot.js' to demonstrate practical implementation. 05:50 📝 *Setting User Details Functionality* - Explanation of creating a function named 'setUserName' to set the username. - Implementation of rules to check and fetch username from the database. - Demonstration of accessing and setting user details within the 'setUserName' function. 06:49 🔄 *Internal Execution Context Access in Nested Functions* - Understanding the access of variables declared within functions in the internal execution context. - Illustration of the 'setUserName' method accessing variables declared internally. - Explanation of how internal functions have access to variables declared in their scope. 07:18 🛠️ *Optimizing Function Calls for Better Access* - Optimization strategy for better access to variables within nested functions. - Discussion on creating a new user with a unique keyword for improved access. - Highlighting the significance of organizing and minimizing function calls for efficient code. 07:31 🔒 *Issue with Property Assignment in Execution Context* - Introduction to the problem with property assignment in the current execution context. - Observing the output after running the code and identifying issues. - Lack of proper setting of properties within the object causing unexpected behavior. 08:09 🛠️ *Debugging and Fixing the Property Setting Problem* - Debugging the code to identify the root cause of the property-setting problem. - Recognizing that the 'setUserName' method is not properly setting the 'username' property. - Addressing the issue by correctly assigning the 'username' property within the function. 08:49 🔍 *Analyzing Reference and Execution Context in JavaScript* - Understanding the reference and execution context of the 'setUserName' method. - Discussing the role of the 'set' method in accessing and modifying object properties. - Clarifying the need for proper referencing and execution context to avoid issues. 09:17 🛠️ *Implementing Method of Object Substitution for Clarity* - Introducing the concept of method of object substitution for clearer code. - Demonstrating how the 'Object.subset' method works in the current scenario. - Discussing the advantages of using clear and concise coding techniques for better understanding. 10:14 🔄 *Handling Execution Context Removal and Reference Hole* - Explanation of removing execution context and reference hole within the outer function. - Demonstrating how variables declared inside the function become inaccessible after execution. - The importance of keeping a reference hole and the execution context for proper functioning. 10:29 🚧 *Troubleshooting and Debugging the Reference Hole Issue* - Identifying the need to maintain a reference hole for variables and functions. - Troubleshooting the problem of the reference hole affecting the expected behavior. - Discussing the syntax and practical aspects of resolving the issue. 11:13 🌐 *Utilizing Global Object for Reference Hole Solution* - Introducing the use of the global object to maintain a reference hole. - Demonstrating how to pass the global object as an optional parameter to the function. - Ensuring that changes inside the function do not affect the global context. 12:08 🧰 *Applying Execution Context Pass for Improved Functionality* - Implementing execution context pass as a solution to the reference hole problem. - Clarifying the significance of passing the context and the resulting improvement in functionality. - Emphasizing the importance of understanding execution context in interviews and real-world scenarios. Made with HARPA AI
01:37 Understanding execution context and 'this' keyword in JavaScript 03:17 Understanding the execution context in JavaScript functions 05:01 Explanation of setting usernames and creating users using JavaScript functions 06:45 Understanding execution context in JavaScript 08:28 Explaining the concept of object substitution and its implications 09:56 Managing execution context in JavaScript [Removing execution context will cause all declared variables to disappear To keep a reference of the execution context, use the "CALL" Method] 11:24 Discussing the use of 'this' in different scenarios and its implications
Great effort sir. This is one of the tricky ones , which you explained very well. I was always wondering why we need call/apply/bind, as we can call a function directly with its name. The only difference is, via call/apply/bind we can set our current context (optionally can send our parameters) , which we cant do via normal function call. But, now i understood, under the hood its the function execution context which play a vital role when there is function inside another function.
The way you explains sir, that definitely came from years of experience. I used to move from one video to other to understand topics. But now found gem, no need to go anywhere else. Aapke samjhane se sab samajh aa jata h😊
There is a doubt in my mind. This call function is okay, like we can use call to use the reference of other function's execution context. But when we use "this" keyword in the function which is called by the call method then it will always access the other function's execution context, what if I also want to refer to my context. Eg: What if I want a variable named as "username" (whose context refers to its parent function only) in the mentioned example's SetUsername method. "this.username" always gives me context of createUser and append a new child always.
what is wrong with passing the context through arguement?? function setName(ctx, name){ ctx.username = name; } function createUser(name, email){ setName(this, name); this.email = email; }
because it is not the write way to do it:- you can declare createUser as constructor so that this refer to the new instance of an object. const user = new CreateUser ('yourname', 'yourmailid' );
I followed a channel to learn DSA but I left because he is always making videos 1hour or for no use and concentrating on his watch time. but you are the perfect, literally very nice series in less time. I am requesting for DSA series also.
Mera ek question hAY: HTML,CSS,PHP,JS,MYSQL YEH SAB SIKH KAR KYA iot RELATED PROFESSIONAL LEVEL CODE KAR PAUNGA, YA ISMAY BHI AUR BAHUT KUCH SECURITY LOOP HOLS, SCALABALITY ISSUE AYEGA?
smaj me to aa geya hai subscrib to hum ne phle se hi ker rkha hai, ab to bess like ki daree thi wo bhi ker diya hai :) aap bus content le ker aaty jaye like and share ki chinta chood hi do aap wo to hum aap ke bina khay bhi ker dengay !! kya kery kerna pedta hai content hi etna jada acha hai ki, button like per jaye bina rukta hi nhi :) (:
Mera naam sameer hai me 16 saal ka hu from uttarakhand, Roorkee. mere paas aik startup idea hai ( ye idea bahut hi badi problem ka solution hai jo problem mene khud face ki hai ) jise me business me execute karna chahta hu mene revenue model or startup business me kaise execute hoga sab kuch tayar kr liya hai bs mujhe aap jaise mentor or investor ki jaroorat hai. Please support me aapke aik chote se action se meri poori life change ho jayegi. Thank you ❤
chaiaurcode >>>>> All RUclipsr 😂 content creator be like Lagta hai Students Smart ho gye hai kyuki bo chaiaurcode ko subscribe krne lage hai😂 or chai ki tarah depth me chijo ko sikh rhe hai
In the starting i am not interested in your series...bcoz I thik you are same as other ...but after watch your your function vidio . I follow your js series without time wasting and explore all channels.... your series. #justlikeafire🔥🔥 on RUclips
I did not even know that call/bind/apply even exist.
Hitesh ji, you nailed it.
I use to think "Call, apply and bind " was just a theoritical nothing practical thing but this is the first time I actually understood the Use Case of "CALL" , one of the best Lecture thanks sir. Again Thanks a lot.
Congratulations sir for 150K subscribers...You deserve much more than that!...
Kuch teachers ke aawaj se unko padhna achha lagta hai. You are one of them Sir..
🎯 Key Takeaways for quick navigation:
00:00 📜 *Introduction to Video and Keywords*
- Brief introduction to the video and its purpose.
- Emphasis on the importance of understanding keywords.
- Mention of the tendency to rush through topics in courses.
00:29 🗂️ *Different Keywords and their Usage*
- Explanation of the variety of keywords used in the script.
- Noting that multiple keywords are often combined and explained together.
- Suggestion to understand keywords at different time durations for better comprehension.
01:10 🚀 *Evolution of React and Coding Practices*
- Historical perspective on React's early versions and coding practices.
- Description of the initial challenges due to limited language features.
- Transition from minimalistic coding to the current abundance of language features and libraries.
01:54 🔄 *Execution Context and Function Interaction*
- Explanation of the global execution context and its persistence.
- Illustration of how functions maintain their execution context.
- Emphasis on the memory and context carried by functions during execution.
02:34 🔄 *Execution Context and Function Relationships*
- Explanation of execution context in JavaScript functions.
- Advantages of visualizing code through diagrams.
- Illustration of the global execution context and nested function contexts.
03:00 🗃️ *Understanding Execution Context Hierarchy*
- Introduction to the concept of execution context hierarchy.
- Overview of the global execution context and its position in the hierarchy.
- Explanation of how nested functions create their own execution contexts.
03:29 🔍 *Challenges with Execution Context References*
- Discussion on the challenges of referencing execution contexts in nested functions.
- Examination of how 'this' keyword behaves in different contexts.
- Highlighting the complexities when functions refer to outer execution contexts.
04:10 🧩 *Troubleshooting Global Execution Context Issues*
- Explanation of problems arising from global execution context references.
- Introduction to the 'this' keyword and its role in context resolution.
- Discussion on common issues related to referencing objects in different contexts.
05:07 🔄 *Overlapping Abstraction in Real-world Scenario*
- Discussion on the persistent problem of overlapping abstraction in real-world scenarios.
- Introduction to a practical example to illustrate the issue.
- Creation of a new file named 'dot.js' to demonstrate practical implementation.
05:50 📝 *Setting User Details Functionality*
- Explanation of creating a function named 'setUserName' to set the username.
- Implementation of rules to check and fetch username from the database.
- Demonstration of accessing and setting user details within the 'setUserName' function.
06:49 🔄 *Internal Execution Context Access in Nested Functions*
- Understanding the access of variables declared within functions in the internal execution context.
- Illustration of the 'setUserName' method accessing variables declared internally.
- Explanation of how internal functions have access to variables declared in their scope.
07:18 🛠️ *Optimizing Function Calls for Better Access*
- Optimization strategy for better access to variables within nested functions.
- Discussion on creating a new user with a unique keyword for improved access.
- Highlighting the significance of organizing and minimizing function calls for efficient code.
07:31 🔒 *Issue with Property Assignment in Execution Context*
- Introduction to the problem with property assignment in the current execution context.
- Observing the output after running the code and identifying issues.
- Lack of proper setting of properties within the object causing unexpected behavior.
08:09 🛠️ *Debugging and Fixing the Property Setting Problem*
- Debugging the code to identify the root cause of the property-setting problem.
- Recognizing that the 'setUserName' method is not properly setting the 'username' property.
- Addressing the issue by correctly assigning the 'username' property within the function.
08:49 🔍 *Analyzing Reference and Execution Context in JavaScript*
- Understanding the reference and execution context of the 'setUserName' method.
- Discussing the role of the 'set' method in accessing and modifying object properties.
- Clarifying the need for proper referencing and execution context to avoid issues.
09:17 🛠️ *Implementing Method of Object Substitution for Clarity*
- Introducing the concept of method of object substitution for clearer code.
- Demonstrating how the 'Object.subset' method works in the current scenario.
- Discussing the advantages of using clear and concise coding techniques for better understanding.
10:14 🔄 *Handling Execution Context Removal and Reference Hole*
- Explanation of removing execution context and reference hole within the outer function.
- Demonstrating how variables declared inside the function become inaccessible after execution.
- The importance of keeping a reference hole and the execution context for proper functioning.
10:29 🚧 *Troubleshooting and Debugging the Reference Hole Issue*
- Identifying the need to maintain a reference hole for variables and functions.
- Troubleshooting the problem of the reference hole affecting the expected behavior.
- Discussing the syntax and practical aspects of resolving the issue.
11:13 🌐 *Utilizing Global Object for Reference Hole Solution*
- Introducing the use of the global object to maintain a reference hole.
- Demonstrating how to pass the global object as an optional parameter to the function.
- Ensuring that changes inside the function do not affect the global context.
12:08 🧰 *Applying Execution Context Pass for Improved Functionality*
- Implementing execution context pass as a solution to the reference hole problem.
- Clarifying the significance of passing the context and the resulting improvement in functionality.
- Emphasizing the importance of understanding execution context in interviews and real-world scenarios.
Made with HARPA AI
best example for ecplanation of , what is call in js. Thanks sir
Watch almost 2 playlist before that, but never ever learn new thing that way. Thank you Sir.
one of the best series of JAVASCRIPT in RUclips 👍, the way of explanation is very good . Thanks for making such great videos for us
01:37 Understanding execution context and 'this' keyword in JavaScript
03:17 Understanding the execution context in JavaScript functions
05:01 Explanation of setting usernames and creating users using JavaScript functions
06:45 Understanding execution context in JavaScript
08:28 Explaining the concept of object substitution and its implications
09:56 Managing execution context in JavaScript
[Removing execution context will cause all declared variables to disappear
To keep a reference of the execution context, use the "CALL" Method]
11:24 Discussing the use of 'this' in different scenarios and its implications
12:20, Also run with a call back function to see if the 'this' for the callback does something different
Great effort sir. This is one of the tricky ones , which you explained very well. I was always wondering why we need call/apply/bind, as we can call a function directly with its name. The only difference is, via call/apply/bind we can set our current context (optionally can send our parameters) , which we cant do via normal function call. But, now i understood, under the hood its the function execution context which play a vital role when there is function inside another function.
Ekdum badiya explain bhiya ,dimag me hi call stack console.log ho gya !!
Very good explanation of the call, and amazing teaching style.
The way you explains sir, that definitely came from years of experience. I used to move from one video to other to understand topics. But now found gem, no need to go anywhere else. Aapke samjhane se sab samajh aa jata h😊
Such good demonstration of call and this. Diagrammatic illustration makes the understanding concrete.
Thanks sir jii ❤ your content and the way you explain is osm . You made js to easy to learn
Thanks ❤️
I am addicted to Sir Hitesh Lectures, top notch quality available for free
sir you have explained it very easily, thank you
Call is by default then ... closure na 11:03
There is a doubt in my mind. This call function is okay, like we can use call to use the reference of other function's execution context. But when we use "this" keyword in the function which is called by the call method then it will always access the other function's execution context, what if I also want to refer to my context.
Eg: What if I want a variable named as "username" (whose context refers to its parent function only) in the mentioned example's SetUsername method.
"this.username" always gives me context of createUser and append a new child always.
Love this JAVASCRIPT series.... Love you Hitesh Sir.....🙏🙏🙏🙏
you are helping us to learn .so we pray to god for your good
one of the best series in youtube sir your efforts hats off👍
Awesome Explanation, Hitesh ji.
at 12:00 what if i use return from SetUsername function and hold it in a variable in Createuser function??
The best dialogue of complete series "Kaun sa interview nahi nikalne wala, yahi se nikalwayenge"
what is wrong with passing the context through arguement??
function setName(ctx, name){
ctx.username = name;
}
function createUser(name, email){
setName(this, name);
this.email = email;
}
because it is not the write way to do it:-
you can declare createUser as constructor so that this refer to the new instance of an object.
const user = new CreateUser ('yourname', 'yourmailid' );
you misunderstood 'this' keywrd with variable. 'ctx' you used is avariable passed as argument. both are completely different bro
Amazing explanation! Thank you sir.
kar liya subscribe sir ji. Sir your teaching style is awesome, I really like it. Thank you for your effort.
Keep watching
thanks a lot for the real world examples that is best thing about your videos
Thankyou for this amazing series
Amazing explanation! Thank you sir.
yes!
Really, very informative video....
Thank you so much
Just amazing explanation.. Huge respect, sir
really like your lectures sir.baht maja aatahe jab appse padhneko milta he , i love you sir.
best Series ALL OVER THE UNIVERSE, thank you Sir 🙏
sir i'm in love with your teaching style can't express how good I'm feeling to find this channal 🥺
Dhanayavad Guru G🚩✌
Truly❤
A man of commitment 👌🏼👌🏼🙏🏽🙏🏽🙏🏽
I followed a channel to learn DSA but I left because he is always making videos 1hour or for no use and concentrating on his watch time. but you are the perfect, literally very nice series in less time. I am requesting for DSA series also.
i love your teaching sir thanks a lot
Sir ise speed se aaj hi complete krwa doge Javascript ko 😂😂😂😂 Thnx sir ise derailed course lane ke liye 🙇🙇🙇🙇
Detailed*
khub bhaloo explaination sir...
itna toh chai bhi ni piya hoga jitna chai word sun chuka hun lectures me....😆😆
Sir maja aagya.. ye huwina baat..topics sab cover horahehy... soon react is on the way
Definitely i didn't watch previous videos but it looks like U are on fire bhaiya...❤❤❤
Thanks a ton
Ji ha yahi se niklenge sare interviews
"Chai aur Code, your videos are like a friend guiding me through the fascinating world of JavaScript!"
Mind blowing classes💕
another masterpiece of a video explanation❤
Superb sir, thanks for the video ❤
one of the best couses ever
Mera ek question hAY: HTML,CSS,PHP,JS,MYSQL YEH SAB SIKH KAR KYA iot RELATED PROFESSIONAL LEVEL CODE KAR PAUNGA, YA ISMAY BHI AUR BAHUT KUCH SECURITY LOOP HOLS, SCALABALITY ISSUE AYEGA?
Superb sir, thanks the video ❤
G.O.A.T Hitesh sir ❤
very well explained sir
masterpiece series
Hitesh Sir, Thanks 🙏
smaj me to aa geya hai subscrib to hum ne phle se hi ker rkha hai, ab to bess like ki daree thi wo bhi ker diya hai :)
aap bus content le ker aaty jaye like and share ki chinta chood hi do aap wo to hum aap ke bina khay bhi ker dengay !!
kya kery kerna pedta hai content hi etna jada acha hai ki, button like per jaye bina rukta hi nhi :) (:
Learnt call, when on a call 😂🔥
Loved it sir 💖
Your hindi😍, i loved it
software expert Hitesh Choudhary 😅
Lovin the series!
Great explanation, Sir. ❤
Thank you sir ❤🙏
Like for a tea ☕
Deep understanding
quality content❤
Hello sir playlist me 43 no. ka video nahi dikh raha hai prototype ka
Thanks, add kr diya h
Another Masterpiece ❤
Gratitude Sirji ❤❤❤
Amaziiinnnnngggggggggggg Explaination
thanks ji
awesome explanation sir
hello sir but ye sab use kahan hoga? sab upar se jata hai
Mera naam sameer hai me 16 saal ka hu from uttarakhand, Roorkee. mere paas aik startup idea hai ( ye idea bahut hi badi problem ka solution hai jo problem mene khud face ki hai ) jise me business me execute karna chahta hu mene revenue model or startup business me kaise execute hoga sab kuch tayar kr liya hai bs mujhe aap jaise mentor or investor ki jaroorat hai. Please support me aapke aik chote se action se meri poori life change ho jayegi.
Thank you ❤
Nice Explanation
hbaiya apka experience apki teaching m proper kam ata nazar ata hai
Thanks A Lot Sir ❤❤
Hi Hitesh, could you please explain how this keyword is related to arrow functions?
check out lecture 23 on this and arrow function 🎉
Thank you very very much sir Ji
How I learn spoke English like you tell me
love and respect for you sir
Maja aagya❤❤❤
Bohat Alla😍
chaiaurcode >>>>> All RUclipsr 😂 content creator be like Lagta hai Students Smart ho gye hai kyuki bo chaiaurcode ko subscribe krne lage hai😂 or chai ki tarah depth me chijo ko sikh rhe hai
Sir theme Konsi hai???
Like subscribe krna na bhule 🙏
Thankyou Sir 😀❤
Theme konsy use kar rahy hai
Thanks a lot 🙏🏻❤
love you sir!
nice explanation
Thank You Sir ❤❤
thankyouuuuuu so much sirrrrrrrrrr
#this
In the starting i am not interested in your series...bcoz I thik you are same as other ...but after watch your your function vidio . I follow your js series without time wasting and explore all channels.... your series. #justlikeafire🔥🔥 on RUclips
yes!
this is similar to prototypal inheritance
Thank you so much sir