Πλαίσιο μέσω μεταβλητής στο JavaScript
Η λύση είναι η εξής: στην εξωτερική συνάρτηση θα γράψουμε
this σε οποιαδήποτε μεταβλητή και αυτή η μεταβλητή
θα είναι προσβάσιμη στην εσωτερική συνάρτηση, όπως
και όλες οι μεταβλητές (συνήθως αυτή η μεταβλητή ονομάζεται
self). Έτσι θα μεταφέρουμε το
this από την εξωτερική συνάρτηση στην εσωτερική:
"use strict";
let elem = document.querySelector('#elem');
elem.addEventListener('blur', parent);
function parent() {
console.log(this.value); // θα εμφανίσει 'text'
let self = this; // θα γράψουμε this σε οποιαδήποτε μεταβλητή, για παράδειγμα, σε self
function child() {
console.log(self.value); // θα εμφανίσει 'text'
}
child();
}
Ας δοθεί ο ακόλουθος κώδικας:
<input id="elem" value="3">
"use strict";
let elem = document.querySelector('#elem');
elem.addEventListener('blur', func);
function func() {
alert( square() );
function square() {
return this.value * this.value;
}
}
Ο συγγραφέας του κώδικα ήθελε, όταν χάσει το focus,
να εμφανιστεί στην οθόνη το τετράγωνο του αριθμού από το
value
του input. Ωστόσο, για κάποιο λόγο, όταν χάνει το focus
εμφανίζεται ένα σφάλμα στην κονσόλα. Διορθώστε το σφάλμα
του συγγραφέα του κώδικα. Γράψτε κείμενο, στο οποίο
θα δώσετε εξήγηση στον συγγραφέα του κώδικα, γιατί προέκυψε
το σφάλμα του.