Call, apply & Bind in JavaScript - Front End Interview 🔥 Episode 4 - In 20 Minutes

แชร์
ฝัง
  • เผยแพร่เมื่อ 12 ม.ค. 2025

ความคิดเห็น • 178

  • @TechnicalSuneja
    @TechnicalSuneja  3 ปีที่แล้ว +27

    00:00 - Don't skip anything 🙏
    Aur kya haal sabke?
    btao next topic JS kon sa hona chahiye ??

    • @R_S_R_389
      @R_S_R_389 3 ปีที่แล้ว +1

      bhaiya backend With node Js interview pr video bnao...☺☺

    • @mohdtausif
      @mohdtausif 3 ปีที่แล้ว

      please make a video on throttling and denouncing in details.

    • @soomjeetsahoo8710
      @soomjeetsahoo8710 3 ปีที่แล้ว

      How is bind saved in memory stack vs a call? Does bind creates a reference?

    • @farzamyousuf3354
      @farzamyousuf3354 3 ปีที่แล้ว

      function ke uper video honi chahiye ziayda confusion function main hoti simple function aur arrow function main

    • @rumanmushtaq898
      @rumanmushtaq898 2 ปีที่แล้ว

      @@R_S_R_389 yes right i also need

  • @YashDEVELOPER12
    @YashDEVELOPER12 2 ปีที่แล้ว +6

    One important use of bind function is :
    When we used a function as callback like setTimeout() , there is chance that method loose reference of object .
    So to tightly bind the method with object we can use bind method.
    Apart of this.. thanks alot brother for explaining call and apply function very well..

    • @sumittiwari231
      @sumittiwari231 10 หลายเดือนก่อน

      bhai koi real life examplle deke samjh dena please . abhi tk mera clear nhi hua doubt en topic pe

  • @pujamohanty8825
    @pujamohanty8825 3 ปีที่แล้ว +6

    The way you explained call,bind and apply....it's fantastic 👏

  • @unseenjoda9899
    @unseenjoda9899 2 ปีที่แล้ว

    Explained Nicely... Jab hume pata hi nahin hai problem kahan hai... Solution ko kaise use karen... Great sir

  • @rohanmainali9040
    @rohanmainali9040 ปีที่แล้ว +2

    Please learn these concepts because today in my mid-level react interview I got these questions.

  • @HumairaMaqbool-t2l
    @HumairaMaqbool-t2l ปีที่แล้ว +7

    In JavaScript, call, apply, and bind are methods that allow you to control the value of the this keyword within a function and also enable you to pass arguments to a function in different ways. These methods are commonly used in object-oriented programming and functional programming paradigms.
    Call Method:
    The call method is used to call a function and explicitly specify the value of this inside the function. It allows you to pass arguments to the function individually as a comma-separated list.
    javascript
    Copy code
    const person = {
    name: "John",
    sayHello: function() {
    console.log(`Hello, my name is ${this.name}`);
    },
    };
    const anotherPerson = {
    name: "Alice",
    };
    person.sayHello(); // Output: Hello, my name is John
    person.sayHello.call(anotherPerson); // Output: Hello, my name is Alice
    In the example above, we have an object person with a method sayHello. Using call, we can invoke the sayHello method with a different object anotherPerson to change the value of this inside the method.
    Apply Method:
    The apply method is similar to the call method, but instead of passing arguments individually, it takes the arguments as an array.
    javascript
    Copy code
    const person = {
    name: "John",
    sayHello: function(greeting) {
    console.log(`${greeting}, my name is ${this.name}`);
    },
    };
    const anotherPerson = {
    name: "Alice",
    };
    person.sayHello("Hi"); // Output: Hi, my name is John
    person.sayHello.apply(anotherPerson, ["Hello"]); // Output: Hello, my name is Alice
    In this example, we have modified the sayHello method to accept a greeting argument. Using apply, we can pass the arguments in an array to change the value of this inside the method and provide the greeting.
    Bind Method:
    The bind method is used to create a new function with a specific value for this, which can be used later. Unlike call and apply, the bind method does not immediately invoke the function but returns a new function with the specified this value.
    javascript
    Copy code
    const person = {
    name: "John",
    sayHello: function() {
    console.log(`Hello, my name is ${this.name}`);
    },
    };
    const anotherPerson = {
    name: "Alice",
    };
    const helloFunction = person.sayHello.bind(anotherPerson);
    helloFunction(); // Output: Hello, my name is Alice
    In this example, we use bind to create a new function helloFunction with the value of this set to anotherPerson. When we call helloFunction(), it logs the message with the name from anotherPerson.
    Choosing Between Call, Apply, and Bind:
    The choice between call, apply, and bind depends on your specific use case. Use call or apply when you want to immediately invoke a function with a specific this value and pass arguments individually or as an array, respectively. Use bind when you want to create a new function with a preset this value to be called later.
    In summary, call, apply, and bind are powerful methods in JavaScript that allow you to control the value of this inside a function and provide flexibility in passing arguments. Understanding how to use these methods can enhance your code's readability and enable you to create more robust and reusable functions.

  • @surajsuryawanshi45
    @surajsuryawanshi45 3 หลายเดือนก่อน +1

    Thank you for your explanation
    I easily understood this concept. i never forgot this concept

  • @fakhruddin746
    @fakhruddin746 2 ปีที่แล้ว +2

    Well Described @technical Suneja
    Firstly thanks to you to this brief explanation
    Just one more point here, That is { Call Apply bind with arrow function}.

    • @rohit_dev
      @rohit_dev 2 ปีที่แล้ว +1

      I think call, apply and bind will not work with the arrow function because arrow function don't have their own this keyword.

  • @srinivasnahak3473
    @srinivasnahak3473 4 หลายเดือนก่อน

    This was the best explanation so far! You explained the concepts really well.

  • @sadikdeveloper
    @sadikdeveloper ปีที่แล้ว +1

    thank you so much finally clear my doubts in these 3 methods

  • @ramsiya2018
    @ramsiya2018 9 หลายเดือนก่อน

    waw ! amazing , bhut video dekhe ,lekin ab ja kr clear hua , thank u guru ji

  • @OpinionOfX
    @OpinionOfX 5 หลายเดือนก่อน +1

    Video start at 1:53

  • @tayebkhan2061
    @tayebkhan2061 ปีที่แล้ว +1

    nice sir
    The way you explained call,bind and apply....it's fantastic

  • @krishgupta4408
    @krishgupta4408 ปีที่แล้ว

    You seems to be very humble person... thanks for the video!

  • @sayalikhot4328
    @sayalikhot4328 2 ปีที่แล้ว

    The way you explained call, apply and bind....it's fantastic. Thanks @Technical Suneja

  • @amitbhagat120
    @amitbhagat120 ปีที่แล้ว

    Bhai ne smjha diya vo bhi simple word me❤❤

  • @JainabaBanu
    @JainabaBanu 10 หลายเดือนก่อน

    call : binds the this value, invokes the function, and allows you to pass a list of arguments.
    apply : binds the this value, invokes the function, and allows you to pass arguments as an array.
    bind : binds the this value, returns a new function, and allows you to pass in a list of arguments.

  • @amansingh8697
    @amansingh8697 ปีที่แล้ว +1

    Very helpful video thank you sir❤❤

  • @gppatil33
    @gppatil33 3 ปีที่แล้ว +4

    Sir my name is Gajanan. I would like to tell you that your videos are to the point and well explained. I just want to tell you that i have difficulty in finding your playlist for JavaScript. I m following the react js playlist currently on hooks.... if i get a reply will be soo happy.

    • @TechnicalSuneja
      @TechnicalSuneja  3 ปีที่แล้ว +1

      Thank you so much for your feedback 😊
      Will keep uploaded such contents in future .👍

  • @digitalaashu6279
    @digitalaashu6279 2 ปีที่แล้ว

    thanks bro such a wonderful explanation, i have read articles but i didn't get the concept but your video is enough, beautifully explained.

  • @bhumikasingh4419
    @bhumikasingh4419 2 ปีที่แล้ว +1

    Very well explained with examples! Thank you!

  • @manishsoni7103
    @manishsoni7103 2 ปีที่แล้ว +1

    Sir please make a series of JavaScript tutorials from zero to hero for beginners to expert.

  • @ffljidanmi646
    @ffljidanmi646 2 หลายเดือนก่อน +1

    the real video starts from 1:50

  • @Doglapan64
    @Doglapan64 2 ปีที่แล้ว +1

    Content is described simply and in an easy way. Just a suggestion that need to describe definitions of that too. Which make it perfect course. Thanks

  • @nter_10_ment52
    @nter_10_ment52 2 ปีที่แล้ว

    bhai best explanation hai apka.

  • @IT2049-Saadsayyed
    @IT2049-Saadsayyed ปีที่แล้ว

    Thankyopu so much best explanation and simple explanantion

  • @Yash-ry5wj
    @Yash-ry5wj 2 ปีที่แล้ว

    Thanx Bhaiya ❤️, Understood all.

  • @suvigyabasnotra7378
    @suvigyabasnotra7378 3 ปีที่แล้ว +2

    Video starts at 17:09

  • @nileshsable3872
    @nileshsable3872 ปีที่แล้ว

    its awesome video all douts clear sir thank you

  • @Gammer13269
    @Gammer13269 ปีที่แล้ว

    Your explanation is really very good and understandable.

  • @what-life-discover
    @what-life-discover ปีที่แล้ว

    greate tutorial hats of to you sunejaji .. nice-one

  • @jituop2702
    @jituop2702 2 ปีที่แล้ว

    Your voice so good , clear and fine
    Video is very help full

  • @devbhattacharya153
    @devbhattacharya153 4 หลายเดือนก่อน

    best explanation sir ji

  • @sankethtj
    @sankethtj ปีที่แล้ว

    Very Well Explained. Thank you very much..

  • @himanshuomar
    @himanshuomar ปีที่แล้ว

    Vedio start at 1:50

  • @ayushipriya7811
    @ayushipriya7811 7 หลายเดือนก่อน

    very well explained sir...

  • @RoojRoojy
    @RoojRoojy 11 หลายเดือนก่อน

    thank you so much sir achhhyyyy se smjh a gya😛💗

  • @SunnySunny-mh5do
    @SunnySunny-mh5do 10 หลายเดือนก่อน

    11:54 I am surprised.. How ajay n anuj became bhai-bahan. 😊

  • @legendarygaming8180
    @legendarygaming8180 6 หลายเดือนก่อน

    khatarnaak👌👌

  • @sandeepsunny8467
    @sandeepsunny8467 ปีที่แล้ว

    nice explanation with simple real examples....)

  • @Jk-tr1fb
    @Jk-tr1fb 3 ปีที่แล้ว

    Ye series to amazing h bhaiya 👍

  • @GunjanSingh-uy8ro
    @GunjanSingh-uy8ro 7 หลายเดือนก่อน

    bahut ache se ... you are awesome

  • @varsha8279
    @varsha8279 10 หลายเดือนก่อน

    Perfect!!! 🤩.. thank you so much!

  • @shailenderjaiswal1685
    @shailenderjaiswal1685 2 ปีที่แล้ว +1

    very well explained bhaiya 👍

  • @laxmipriyapradhan1704
    @laxmipriyapradhan1704 9 หลายเดือนก่อน

    Thanks 😅 Awesome video

  • @sufigaming135
    @sufigaming135 4 หลายเดือนก่อน

    thank u for the teaching man

  • @Data-vg5xm
    @Data-vg5xm 2 ปีที่แล้ว

    pls make video on => What is a deep and shallow copy in JavaScript? What is by default?

  • @arijitnagchowdhury3740
    @arijitnagchowdhury3740 6 หลายเดือนก่อน

    Very nice explanation

  • @prathmeshrupnur2416
    @prathmeshrupnur2416 ปีที่แล้ว

    nice video every point discussed in video was clear to me
    sir ,i request u to make a playlist on javascript for beginners to advance.

  • @niteshsen690
    @niteshsen690 ปีที่แล้ว +1

    Very well explained ❤

  • @amanprajapati9252
    @amanprajapati9252 7 หลายเดือนก่อน

    Great sir!🙏😊

  • @Vikaskumar-ur5di
    @Vikaskumar-ur5di 3 ปีที่แล้ว +1

    thanks for sharing amazing video

  • @avinashpawar2236
    @avinashpawar2236 ปีที่แล้ว

    Thanks alot sir 🤗 amazing video

  • @akashaher1001
    @akashaher1001 3 ปีที่แล้ว +1

    Thank you very much sir...
    For providing us such wonderful videos... 💯❤️

  • @R_S_R_389
    @R_S_R_389 3 ปีที่แล้ว +6

    bhaiya backend With node Js interview pr video bnao...☺☺

  • @RahulChauhan-lm8mk
    @RahulChauhan-lm8mk 2 ปีที่แล้ว +1

    Very good video. Immpressive.

  • @Piyushkadu-o7h
    @Piyushkadu-o7h ปีที่แล้ว

    It helped me a lot , thanks

  • @pankajsuryavanshi8332
    @pankajsuryavanshi8332 2 ปีที่แล้ว

    Continue this series.....

  • @daminiraj4846
    @daminiraj4846 2 ปีที่แล้ว

    Pls make more videos on advanced javascript

  • @jagdishjena9058
    @jagdishjena9058 2 ปีที่แล้ว +1

    sir plz make videos on Shallow copy and Deep copy.

  • @raj_amancha
    @raj_amancha 2 ปีที่แล้ว

    Sir jo font size vs code me use kiye hai utna font size console me kar do to ye video agar me Mobil me dekhu to bhi thik se dikhe and Your great sir thanks 😊

  • @sunnyrauniyar6769
    @sunnyrauniyar6769 ปีที่แล้ว

    Great simple explanantion again, this video could have been a little shorter or you could add some use-case or necessary situation usecase at the end of video. Thanks again

  • @ayushiprajapati2552
    @ayushiprajapati2552 10 หลายเดือนก่อน

    Well explained !

  • @shaansharma2504
    @shaansharma2504 ปีที่แล้ว

    we support you :)

  • @jesussheepakash9289
    @jesussheepakash9289 2 ปีที่แล้ว

    Thank you bhaiya

  • @tausifkovadiya1810
    @tausifkovadiya1810 2 ปีที่แล้ว

    Excellent explanation...

  • @priyankasoni1405
    @priyankasoni1405 3 ปีที่แล้ว

    Please make video for inheritance in JavaScript , before es6 how inheritance was working and with es6 syntax 🙏

  • @vikrambais5330
    @vikrambais5330 ปีที่แล้ว

    plz also make some frontend projects using react js .. there are very less video just focusiing on frontend projects using react js.. videos to hai par we sab full stack pe focussed hai .. and jab tak ek beginner frontend hi nhi sikh payeha using react js to in sabhi full stack projects ko kaise kar payega..

  • @siddharthabiswal275
    @siddharthabiswal275 ปีที่แล้ว

    LOVELY!

  • @ankushladani496
    @ankushladani496 2 ปีที่แล้ว

    Dsa series lao yar jaldi....🚀🚀

  • @Jk-tr1fb
    @Jk-tr1fb 3 ปีที่แล้ว

    Node.js ki bhi aisi short ,simple ,crisp series le aao interview time aa gya h please 🙏

  • @jagdishjena9058
    @jagdishjena9058 2 ปีที่แล้ว

    Thank you so much sir.

  • @hemangkoshiyar
    @hemangkoshiyar ปีที่แล้ว

    One thing to consider here is, that if we use the arrow function instead of the es5 function(), then this keyword will point out to a global window object instead of a particular object.

  • @PANKAJKUMAR-fe8zn
    @PANKAJKUMAR-fe8zn 3 ปีที่แล้ว

    Thanks for this video sir... please make video on fetch API and this keyword

  • @sparsh-0384
    @sparsh-0384 ปีที่แล้ว

    Well explained 👍

  • @abdullahkhansaffy9703
    @abdullahkhansaffy9703 2 ปีที่แล้ว

    10/10 marks

  • @mohammedzaheer4215
    @mohammedzaheer4215 ปีที่แล้ว

    Call means we can call any object using call and get it's values and apply means we can store the argument in array and bind means we can make tho copy of the function and Store it in a variable and call when needed is I'm right if not correct me

  • @coding_is_my_passion
    @coding_is_my_passion ปีที่แล้ว

    bind means copy of function to always get the same value Ajay Suneja Delhi and India in this video Call, apply & Bind in JavaScript - Front End Interview 🔥 Episode 4 - In 20 Minutes

  • @ankit_panchal
    @ankit_panchal 2 ปีที่แล้ว +1

    Great 👍

  • @jitendrachauhan5963
    @jitendrachauhan5963 2 ปีที่แล้ว

    Very good tutorial

  • @Devdaskekisse
    @Devdaskekisse 2 ปีที่แล้ว +1

    Bhaiya ho skte to har weak ya mahine me 2 bar km se km js ke important concepts pr video late rahiye please

  • @mshahzebraza
    @mshahzebraza 2 ปีที่แล้ว

    Amazing Content

  • @sumitkumar-hl8dt
    @sumitkumar-hl8dt 2 ปีที่แล้ว

    Explain real life problems which can be achieved using all the methods pz

  • @tejass817
    @tejass817 2 ปีที่แล้ว

    useful content....tq

  • @smitraghani9735
    @smitraghani9735 2 ปีที่แล้ว +1

    Can anyone explain practical use of this concept where you have applied this in your code

  • @gouravnainwaya5669
    @gouravnainwaya5669 3 ปีที่แล้ว +2

    React native bhi sikhao

  • @shwetajaiswal1263
    @shwetajaiswal1263 ปีที่แล้ว

    U are great

  • @anilrajmeena4373
    @anilrajmeena4373 2 ปีที่แล้ว

    Please make video about this keyword

  • @shreyash8273
    @shreyash8273 ปีที่แล้ว

    Thanks Sir

  • @AnoopSeth
    @AnoopSeth ปีที่แล้ว +1

    Video acchi hai bas 2 minutes starting me skip maar do

  • @uncodeyourself4473
    @uncodeyourself4473 2 ปีที่แล้ว

    great bro

  • @JohnDoe-q2g7n
    @JohnDoe-q2g7n 10 หลายเดือนก่อน

    Should we also tell the problem statement first and then actually use it in the interview?

  • @diwakardayal954
    @diwakardayal954 11 หลายเดือนก่อน

    thank you!!

  • @zatinkumar6314
    @zatinkumar6314 3 ปีที่แล้ว +6

    Functions declared in tha object are called methods 👻

  • @rishabhprakash
    @rishabhprakash ปีที่แล้ว

    thanks man !

  • @divyeshsevra3097
    @divyeshsevra3097 2 ปีที่แล้ว

    sir, you are always explaining like its just kg 'ABCD'

  • @NeerajSharma-sk2rs
    @NeerajSharma-sk2rs 2 ปีที่แล้ว

    thanku bhai

  • @RaviKumar-hz8cf
    @RaviKumar-hz8cf ปีที่แล้ว

    Tank you Buddy

  • @shanmaqbool5048
    @shanmaqbool5048 11 หลายเดือนก่อน

    very owseom

  • @chiragkumarrathod3234
    @chiragkumarrathod3234 2 ปีที่แล้ว

    make videos on ruby on rails