Che cos'è l'override in JavaScript?

Per comprendere il concetto di override in JavaScript, rivediamo prima il concetto di override nel suo insieme.

Il metodo Override è un concetto OOP strettamente legato all'eredità. Quando un metodo di classe figlio sostituisce il metodo di classe padre con lo stesso nome, parametri e tipo restituito, viene definito come metodo di sostituzione. Inoltre, si ricorda che questo è completamente diverso dal concetto di sovraccarico del metodo. Il sovraccarico del metodo si verifica quando ci sono due funzioni con lo stesso nome ma parametri diversi.

Ora proviamo a capire questo concetto dal punto di vista di JavaScript. Sappiamo che JavaScript non è "relativamente" orientato agli oggetti. Ha il concetto di Oggetti che lo qualifica per essere orientato agli oggetti, ma non ha il concetto di Classi. È di natura prototipica. Sì sì, ti sento gridare forte che possiamo dichiarare le classi in JavaScript ma lascia che ti ricordi che questa notazione di classe è semplicemente uno zucchero sintattico per l'architettura prototipica sottostante.

Pertanto, JavaScript supporta il concetto di override del metodo. E lo fa in modi molto strani. Dopo tutto, è il linguaggio più frainteso nel mondo della programmazione. JavaScript supporta l'override, ma non il sovraccarico.

Nota: negli esempi di questo articolo, utilizzeremo la console per sviluppatori dei browser. Apri semplicemente gli strumenti di sviluppo del browser (Ctrl / Cmd + Maiusc + C) e vai alla scheda Console nella finestra degli strumenti di sviluppo.

Sembra così in Chrome:

Questo è il parco giochi per la maggior parte dei concetti relativi a JavaScript. Useremo questo parco giochi in questo articolo.

Come funziona Override in JavaScript?

In JavaScript, tutti gli oggetti ereditano dal prototipo Object. Tutti gli oggetti sono istanze di Object. Pertanto, ogni volta che si crea un nuovo oggetto, JavaScript definisce automaticamente una proprietà _proto_ (prototipo) per il nuovo oggetto. Quando viene creato un oggetto figlio, ha di nuovo una proprietà _proto_ e così via. Ora, quando provi ad accedere a un metodo o a una proprietà di un oggetto, JavaScript controlla innanzitutto se l'oggetto ha quel metodo / proprietà. In caso contrario, JavaScript controlla se la _proto_ dell'oggetto ha quel metodo / proprietà. In caso contrario, JavaScript verifica se la _proto_ dell'oggetto padre ha quel metodo / proprietà. Continua a cercare nella catena fino a quando non viene trovato il metodo / proprietà o viene trovata e cercata la _proto_ di Object. Ad esempio Date.prototype. ((Prototype)) è Object.prototype.

Ora vedi la catena sottosopra. Ecco come funziona l'override in JavaScript. Un metodo continuerebbe a sovrascrivere il metodo dell'oggetto genitore anche se si tratta di un metodo di oggetto. Ad esempio, possiamo persino sostituire le funzionalità principali come la creazione di un oggetto Date.

Vediamo questo con un esempio:

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);

Tipi di sostituzione in JavaScript

Non ci sono tipi di sostituzione definiti in JavaScript. Tuttavia, in base al comportamento del linguaggio di programmazione, possiamo affermare che la sostituzione del metodo in JavaScript funziona nei seguenti modi.

1) Il primo comportamento

Il primo modo è quello che abbiamo visto sopra quando abbiamo definito un metodo per sovrascrivere il costruttore Date predefinito di JavaScript. Questo è in un modo simile al terzo modo illustrato di seguito perché tutti gli oggetti in JavaScript sono un'istanza del prototipo Object. Ciò che differenzia il terzo comportamento è l'uso della super parola chiave. Vedremo di più quando illustreremo il terzo comportamento.

Vediamo un altro esempio simile. Questa volta, sostituiremmo la funzionalità di avviso. Il comportamento predefinito della funzione di avviso in JavaScript è di visualizzare una piccola finestra di dialogo nella parte superiore della pagina con il messaggio che passiamo come parametro.

Ora, quando lo sovrascriviamo con il nostro codice, la funzione di avviso predefinita non viene più chiamata.

function alert(msg) (
console.log(msg);
);
alert("This is an alert.");

2) Il secondo comportamento

Il secondo modo è quando proviamo a sovraccaricare le funzioni in JavaScript. Ricorda, JavaScript non supporta il sovraccarico delle funzioni. Quindi, invece di sovraccaricare la tua funzione, JavaScript avrebbe la precedenza su tutte le definizioni precedenti della tua funzione con l'ultima.

Vediamolo in azione.

//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));

Notare il risultato. JavaScript chiama sempre la seconda definizione della funzione e restituisce il quadrato del primo parametro. I parametri successivi vengono ignorati.

3) Il terzo comportamento

Il terzo comportamento si presenta quando coinvolgiamo le classi e l'ereditarietà in JavaScript. Quando una classe figlio eredita i metodi della classe genitore e definisce i propri metodi con lo stesso nome, i metodi della classe genitore vengono sovrascritti. Questo non è ciò che vorremmo nelle applicazioni della vita reale. Vorremmo che i nostri metodi di classe genitore fossero accessibili anche se sovrascritti da metodi di classe figlio. Quindi, la super parola chiave ci viene in aiuto. Usando la parola chiave super, possiamo accedere ai metodi della classe genitore.

Vediamolo in azione.

//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();

Ora torna al primo esempio di comportamento e prova a utilizzare la super parola chiave lì. Noterai che non funziona. Questo perché quando abbiamo creato il nostro metodo nel primo esempio, non abbiamo esteso la classe genitore. Abbiamo creato il metodo nell'ambito globale sostituendo così tutte le altre definizioni del metodo.

Conclusione

Rivediamo la nostra comprensione del metodo prevalente in JavaScript. Abbiamo appreso che JavaScript supporta l'override, ma non il sovraccarico. Se proviamo a sovraccaricare i metodi, JavaScript sostituisce tutte le definizioni precedenti con l'ultima. Questo vale anche per le funzioni principali!

Successivamente, abbiamo visto come possiamo sovrascrivere i metodi nelle classi figlio e successivamente accedere ai metodi della classe genitore come e quando richiesto. Questo è un concetto molto utile in quanto ci consente di estendere la funzionalità delle nostre classi principali e quindi migliorare la riusabilità del codice.

Articoli consigliati

Questa è una guida per eseguire l'override in JavaScript. Qui discutiamo come funziona l'override in JavaScript e i tipi di override in JavaScript. Puoi anche leggere il seguente articolo per saperne di più -

  1. Cosa può fare Javascript?
  2. Che cos'è JavaScript?
  3. Come installare JavaScript
  4. Python Frameworks: che cos'è il framework Python?
  5. Introduzione alla sostituzione in C ++
  6. Introduzione a Override in OOPs
  7. Sostituzione in Java
  8. Metodo di sovraccarico in C #
  9. Sovraccarico e override in C #

Categoria: