Co to jest zastępowanie w JavaScript?
Aby zrozumieć koncepcję zastąpienia w JavaScript, najpierw poprawmy koncepcję zastąpienia jako całości.
Metoda zastępowania jest koncepcją OOP ściśle związaną z dziedziczeniem. Gdy metoda klasy podrzędnej przesłania metodę klasy nadrzędnej o tej samej nazwie, parametrach i typie zwracanym, określa się ją jako przesłaniającą metodę. Należy również pamiętać, że jest to całkowicie odmienne od koncepcji przeciążenia metody. Przeciążenie metody występuje, gdy istnieją dwie funkcje o tej samej nazwie, ale o różnych parametrach.
Spróbujmy teraz zrozumieć tę koncepcję z punktu widzenia JavaScript. Wiemy, że JavaScript jest „względnie” niezorientowany obiektowo. Ma koncepcję Obiektów, która kwalifikuje ją jako obiektową, ale nie ma pojęcia Klasy. Ma charakter prototypowy. Tak, słyszę, jak głośno krzyczysz, że możemy zadeklarować klasy w JavaScript, ale przypominam, że ta notacja klas jest jedynie cukrem syntaktycznym dla podstawowej architektury prototypowej.
Tak więc JavaScript obsługuje koncepcję zastępowania metod. I robi to w bardzo dziwny sposób. W końcu jest to najbardziej niezrozumiany język w świecie programowania. JavaScript obsługuje przesłonięcie, ale nie przeciążenie.
Uwaga - w przykładach w tym artykule korzystamy z konsoli programisty przeglądarek. Wystarczy otworzyć narzędzia programistyczne przeglądarki (Ctrl / Cmd + Shift + C) i przejść do karty Konsola w oknie narzędzi programistycznych.
W Chrome wygląda to tak:
To jest plac zabaw dla większości pojęć związanych z JavaScript. W tym artykule będziemy korzystać z tego placu zabaw.
Jak działa zastąpienie w JavaScript?
W JavaScript wszystkie obiekty dziedziczą po prototypie Object. Wszystkie obiekty są instancjami Object. Dlatego za każdym razem, gdy tworzysz nowy obiekt, JavaScript automatycznie definiuje właściwość _proto_ (prototyp) dla nowego obiektu. Kiedy obiekt potomny jest tworzony, ponownie ma właściwość _proto_ i tak dalej. Teraz, gdy próbujesz uzyskać dostęp do metody lub właściwości obiektu, JavaScript najpierw sprawdza, czy obiekt ma tę metodę / właściwość. Jeśli nie, JavaScript sprawdza, czy _proto_ obiektu ma tę metodę / właściwość. Jeśli nie, JavaScript sprawdza, czy _proto_ obiektu nadrzędnego ma tę metodę / właściwość. Kontynuuje przeszukiwanie łańcucha aż do znalezienia metody / właściwości lub napotkania i wyszukania _proto_ Object. Np. Date.prototype. ((Prototype)) to Object.prototype.
Teraz zobacz łańcuch do góry nogami. Tak działa nadpisywanie w JavaScript. Metoda nadal nadpisuje metodę obiektu nadrzędnego, nawet jeśli jest to metoda Object. Na przykład możemy nawet zastąpić podstawowe funkcje, takie jak tworzenie obiektu Date.
Zobaczmy to na przykładzie:
new Date(); //the JavaScript Date() method
//overriding the JavaScript Date() method
function Date()(
this.date = "This method overrides the default constructor of Date class.";
);
var date2 = new Date();
console.log(date2);
Typy zastępowania w JavaScript
W JavaScript nie ma zdefiniowanych typów przesłonięcia. Jednak w oparciu o zachowanie języka programowania możemy powiedzieć, że metoda zastępowania w JavaScript działa w następujący sposób.
1) Pierwsze zachowanie
Pierwszy sposób to ten, który widzieliśmy powyżej, gdy zdefiniowaliśmy metodę zastępowania domyślnego konstruktora daty w JavaScript. Jest to podobne do trzeciego zilustrowanego poniżej, ponieważ wszystkie obiekty w JavaScript są instancją prototypu Object. Tym, co wyróżnia trzecie zachowanie, jest użycie super słowa kluczowego. Zobaczymy więcej, gdy zilustrujemy trzecie zachowanie.
Zobaczmy kolejny podobny przykład. Tym razem zastąpilibyśmy funkcję alertu. Domyślnym działaniem funkcji alertów w JavaScript jest wyświetlanie małego okna dialogowego na górze strony z komunikatem, który przekazujemy jako parametr.
Teraz, gdy zastąpimy go własnym kodem, domyślna funkcja alertu nie jest już wywoływana.
function alert(msg) (
console.log(msg);
);
alert("This is an alert.");
2) Drugie zachowanie
Drugi sposób to próba przeciążenia funkcji w JavaScript. Pamiętaj, JavaScript nie obsługuje przeciążania funkcji. Zamiast przeciążać twoją funkcję, JavaScript zastąpi wszystkie poprzednie definicje twojej funkcji najnowszą.
Zobaczmy to w działaniu.
//Calculate area of rectangle
function calculateArea(x, y)(
return x*y;
)
//Calculate area of square
function calculateArea(a)(
return a*a;
)
console.log("Area of rectangle 2x3 is : " + calculateArea(2, 3));
console.log("Area of square 5x5 is : " + calculateArea(5));
Zwróć uwagę na wynik. JavaScript zawsze wywołuje drugą definicję funkcji i zwraca kwadrat pierwszego parametru. Kolejne parametry są ignorowane.
3) Trzecie zachowanie
Trzecie zachowanie pojawia się w obrazie, gdy włączamy klasy i dziedziczenie w JavaScript. Gdy klasa potomna dziedziczy metody klasy macierzystej i definiuje własne metody o tej samej nazwie, metody klasy macierzystej są zastępowane. Nie tego chcielibyśmy w rzeczywistych aplikacjach. Chcielibyśmy, aby nasze metody klas nadrzędnych były dostępne, nawet jeśli zostały zastąpione metodami klas podrzędnych. Tak więc super słowo kluczowe przychodzi nam z pomocą. Używając super słowa kluczowego, możemy uzyskać dostęp do metod klasy nadrzędnej.
Zobaczmy to w działaniu.
//the parent class
class Person (
greet() (
console.log("Hello. I am a person.");
);
)
//the child class
class Employee extends Person (
greet() (
super.greet(); //calling parent class method via keyword 'super'
console.log("Hello. I am an employee.");
)
)
let per = new Person(); //parent class object
let emp = new Employee(); //child class object
per.greet();
emp.greet();
Teraz wróć do pierwszego przykładu zachowania i spróbuj użyć super słowa kluczowego. Zauważysz, że to nie działa. Jest tak, ponieważ kiedy stworzyliśmy naszą metodę w pierwszym przykładzie, nie rozszerzyliśmy klasy nadrzędnej. Stworzyliśmy metodę w zasięgu globalnym, zastępując w ten sposób wszystkie inne definicje metody.
Wniosek
Sprawdźmy nasze rozumienie metody zastępowania w JavaScript. Dowiedzieliśmy się, że JavaScript obsługuje zastępowanie, ale nie przeciążanie. Jeśli spróbujemy przeładować metody, JavaScript zastąpi wszystkie poprzednie definicje przez najnowszą. Dotyczy to nawet podstawowych funkcji!
Następnie zobaczyliśmy, jak możemy przesłonić metody w klasach potomnych, a następnie uzyskać dostęp do metod klas nadrzędnych, gdy jest to wymagane. Jest to bardzo przydatna koncepcja, ponieważ pozwala nam rozszerzyć funkcjonalność naszych klas nadrzędnych, a tym samym poprawia możliwość ponownego użycia kodu.
Polecane artykuły
Jest to przewodnik po zastępowaniu w JavaScript. W tym miejscu omawiamy, jak działa nadpisywanie w JavaScript i rodzaje nadpisywania w JavaScript. Możesz także spojrzeć na następujący artykuł, aby dowiedzieć się więcej -
- Co potrafi Javascript?
- Co to jest JavaScript?
- Jak zainstalować JavaScript
- Python Frameworks - co to jest Python Framework?
- Wprowadzenie do przesłonięcia w C ++
- Wprowadzenie do zastępowania w operacjach operacyjnych
- Przesłanianie w Javie
- Przeciążenie metody w C #
- Przeciążanie i zastępowanie w C #