Nella lezione scorsa vi ho introdotto il concetto di “oggetto” del linguaggio Javascript, d’ora in poi quindi darò per scontato che con la lezione precedente voi avete ben in mente cosa questo significhi e come questo concetto debba essere gestito per poterlo padroneggiare e implementare quindi in uno script! Passando all’argomento di questa nuova lezione vi debbo introdurre una parola molto importante nella programmazione Javascript e nel  uso dei suoi oggetti nativi, la quale è il this, grazie a questo particolare identificatore, infatti, è possibile far riferimento “a se stesso”, cioè all’oggetto nativo “this” stesso del linguaggio Javascript (in inglese “this” vuol dire letteralmente “questo”!). L’utilizzo del this in Javascript differisce rispetto ad altri linguaggi orientati agli oggetti. Come detto, infatti, Javascript non conosce il concetto di classe e pertanto non è sempre facile identificare l’oggetto al quale il this si riferisce. Il problema principale, quindi, è identificare il contesto al quale il this fa riferimento! Andiamo quindi ora ad approfondire il this e il suo utilizzo nel linguaggio Javascript in modo da superare questo problema che ci viene imposto!

L’utilizzo del this in modalità inline

Ci è permesso utilizzare l’oggetto this anche all’interno di una funzione Javascript, ma in questo caso le cose si fanno più complesse. Vi faccio un esempio:

function faccioQualcosa() { alert(this.style.color); }

Fino a qui nessuno problema, finché, non viene richiamata la funzione senza che essa venga associata ad alcun oggetto, come di seguito:

<script>faccioQualcosa();</script>

Quest’ultimo codice sopra riportato produrrebbe un errore! Data la mancanza di un’associazione esplicita con un oggetto, infatti, il this si presume riferito al generico oggetto window e, pertanto, nel caso concreto finirebbe col produrre un errore.

Vi faccio di seguito un altro esempio:

document.getElementById('mioDiv').onclick = faccioQualcosa();

In questo caso la funzione, invece, produrrebbe il risultato atteso, cioè mostrerebbe all’atto del click, un alert con il valore della proprietà CSS “color” settata nell’attributo “style” dell’elemento selezionato. In questo caso, infatti, il contesto di this sarebbe lo specifico oggetto relativo all’elemento selezionato. Il contesto, infatti, sarebbe:

document.getElementById('mioDiv')

e non più il generico oggetto window.

Utilizzare this all’interno di un oggetto

Un altro ruolo importante che il this può assumere, è quello all’interno di un oggetto. Infatti nell’ottica di una programmazione orientata agli oggetti, l’oggetto this assume un significato particolare. Dentro ad un oggetto, infatti, this, come già detto all’inizio della lezione, fa riferimento all’oggetto stesso.

Dettata quest’ultima nota importante, direi che questa lezione finisce qui, spero come sempre di esservi piaciuto, e in tal caso voglio un bel mi piace all’articolo! Ma soprattutto spero che tutto sia chiaro, altrimenti non esitate a contattarmi per qualsiasi tipo di domanda o aiuto per comprendere meglio la lezione! Io vi saluto qui e vi rimando al prossimo articolo augurandovi un buon proseguimento qui su WorldTecno, ciao! 😉

Articoli correlati

Boostrap

Corso Bootstrap – Sesta Lezione.

Ed eccoci qui di nuovo, con la sesta lezione del corso bootstrap! Che come ricordiamo sempre è un corso realizzato grazie ad una collaborazione nata tra Falco96 e WorldTecno. Questa sarà una lezione veramente piena Leggi tutto&ellip;

Corsi

L’oggetto “window” del Javascript.

Ciao! In questa lezione andiamo a conoscere l’oggetto window. E’ l’oggetto principale utilizzato nel Javascript ed è rappresentato dall’intera “finestra” del browser. Se la finestra è composta da una pluralità di “frames” (cioè se ad Leggi tutto&ellip;

Boostrap

Corso Bootstrap: Quarta Lezione.

Dopo la scorsa lezione di Bootstrap, oggi siamo qui per proseguire con voi il percorso di questo corso con un’altra nuova lezione arrivando a bene a 4 lezioni totali affrontate fino ad ora. Inoltre come Leggi tutto&ellip;

%d blogger hanno fatto clic su Mi Piace per questo: