JavaScript .call ().apply () oraz .bind () – wyjaśnione totalnie noob

JavaScript ma wiele wbudowanych funkcji/metod, które mogą mieć zastosowanie do różnych typów danych.

tak jak.split(„”) może zastosować do ciągu znaków,.call (),.apply () oraz .bind() są metodami funkcji.

Te 3 funkcje są zaprojektowane tak, aby ustawić kontekst, a dokładniej, do czego odnosi się „to”.

przez większość czasu zawsze definiujesz „to” lub masz je specjalnie włączone do funkcji., Na przykład, powiedzmy, że masz obiekt:

var owen = { name: "Owen"}

i chcesz odwołać się do tego obiektu za pomocą funkcji:

function sayTo(person, first, second){ return first + " " + person.name + " " + second;}sayTo(owen, "Hi", "how are you?");
//returns "Hi Owen how are you?"

teraz, jeśli wywołana funkcja sayTo na Owenie, z dwoma argumentami, wywoła się poprawnie, ponieważ

teraz, co jeśli Sayto został zdefiniowany trochę inaczej?

pierwszy argument, owen, przechodzi do pierwszej zmiennej, „cześć” przechodzi do drugiej zmiennej, a „jak się masz?”goes nowhere, and this.name jest niezdefiniowany, ponieważ nie jest to obiekt.

The this when you console.,log it, zwraca obiekt global window.

za pomocą .call ()

.funkcja call() umożliwia działanie funkcji sayTo:

zapis jest następujący:

functionName.call(value of this, arg1, arg2…)

.wywołanie zasadniczo wymusza wartość w tym w dowolnej funkcji .wywołanie jest stosowane na. W tym przypadku wywołujemy funkcję sayTo. .call (owen, …) wymusza to z sayTo () na obiekt Owena. Tak więc this.name ma zastosowanie.

” cześć „i” jak się masz?”są wprowadzane jako drugi lub trzeci argument funkcji sayTo (która pobiera 2 argumenty).

za pomocą .apply ()

za pomocą .,apply() jest bardzo podobny do .sprawdzam. Jedyna różnica jest taka .funkcja call() pobiera arg1 i arg2 jeden po drugim.

Dla .apply () do pracy, argumenty 1 i 2 muszą być wprowadzone jako tablica:

format jest następujący:

functionName.apply(value of this, )

zauważ, że arg1 i arg2 są wprowadzane jako tablica.

za pomocą .bind ()

.bind(), w przeciwieństwie do .apply () oraz .call (), zwraca funkcję zamiast wartości.

.bind ustawia wartość this I zmienia funkcję na nową, ale nie wywołuje funkcji.,

var owen = {name: "Owen”}function sayTo(first, second){return first + " " + this.name + " " + second;}var sayToOwen = sayTo.bind(owen);

zasadniczo saytoowen jest tworzony jako nowa funkcja. Co jest technicznie:

var sayToOwen = function(first, second){ return first + " " + owen.name + " " + second;}

Możesz następnie uruchomić sayToOwen jako normalną funkcję.

Możesz również „powiązać” argumenty Sayto ():

var owen = {name: "Owen”}function sayTo(first, second){return first + " " + this.name + " " + second;}var sayHiToOwen = sayTo.bind(owen, "Hi");

zmienna sayHiToOwen staje się wtedy:

var SayHiToOwen = function(second){
return "Hi" + " " + owen.name + " " + second;}

podsumowanie

Leave a Comment