Κλείδα JavaScript

Το JavaScript μεταβλητή ανήκειlocalorGlobalscope.

Global variables can be accessed throughκλείδαImplement local (private).

Global variables

Functions can access functionsInternalAll variables defined, such as:

Παράδειγμα

function myFunction() {
    var a = 4;
    return a * a;
}

Δοκιμάστε το προσωπικά

But functions can also access functionsExternalVariables defined, such as:

Παράδειγμα

var a = 4;
function myFunction() {
    return a * a;
}

Δοκιμάστε το προσωπικά

In the last example,a isGlobalVariables.

In a web page, global variables belong to the window object.

Global variables can be used and modified by all scripts on the page (and in the window).

In the first example,a isLocalVariables.

Local variables can only be used within the function they are defined in. They are invisible to other functions and script code.

having the same name as global variables and local variables are different variables. Modifying one will not change the other.

not throughkeyword var Variables created are always global, even if they are created within a function.

Variable lifecycle

Global variables live as long as your application (window, web page).

Local variables do not live long. They are created when a function is called and deleted when the function is completed.

A counter's dilemma

Suppose you want to use a variable to count, and you want this counter to be available to all functions.

You can use global variables and functions to increment the counter:

Παράδειγμα

// Initialize the counter
var counter = 0;
// Function to increment the counter
function add() {
  counter += 1;
}
// Call add() three times
add();
add();
add();
// At this point, the counter should be 3

Δοκιμάστε το προσωπικά

The above solution has a problem: any code on the page can change the counter without calling add().

For the add() function, the counter should be local to prevent other code from changing it:

Παράδειγμα

// Initialize the counter
var counter = 0;
// Function to increment the counter
function add() {
  var counter = 0; 
  counter += 1;
}
// Call add() three times
add();
add();
add();
// At this point, the counter should be 3. But it is 0.

Δοκιμάστε το προσωπικά

It is not useful because we display the global counter instead of the local counter.

By making the function return it, we can remove the global counter and access the local counter:

Παράδειγμα

// Function to increment the counter
function add() {
  var counter = 0; 
  counter += 1;
  return counter;
}
// Call add() three times
add();
add();
add();
// At this point, the counter should be 3. But it is 1.

Δοκιμάστε το προσωπικά

It is not useful because we reset the local counter every time we call a function.

JavaScript inner functions can solve this problem.

JavaScript nested functions

All functions have the right to access the global scope.

In fact, in JavaScript, all functions have the right to access their 'upper' scope.

JavaScript supports nested functions. Nested functions can access their upper scope.

In this example, the inner function plus() can access the parent function's counter counter variable：

Παράδειγμα

function add() {
    var counter = 0;
    function plus() {counter += 1;}
    plus();     
    return counter; 
}

Δοκιμάστε το προσωπικά

Όπως αυτό μπορεί να λύσει το πρόβλημα του αριθμητή, αν μπορούμε να τον προσπελάσουμε από το εξωτερικό plus() συνάρτηση.

Χρειαζόμαστε επίσης μια συνάρτηση που εκτελείται μια φορά counter = 0 μεθόδους.

Χρειαζόμαστε κλείδα (closure).

Κλείδα JavaScript

Παρατήρησα την αυτοεφαρμοζόμενη συνάρτηση; Τι θα κάνει αυτή η συνάρτηση;

Παράδειγμα

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();
add();
add();
add();
// Ο αριθμητής είναι 3

Δοκιμάστε το προσωπικά

Παράδειγμα εξήγησης

Μεταβλητή add Η ύπαρξη είναι η επιστροφή της αυτοεφαρμοζόμενης συνάρτησης.

Αυτή η αυτοεφαρμοζόμενη συνάρτηση εκτελείται μόνο μια φορά. ρυθμίζει τον αριθμητή σε 0 και επιστρέφει την έκφραση της συνάρτησης.

Άρα η add γίνεται συνάρτηση. Το πιο "μάγιστρο" μέρος είναι ότι μπορεί να προσπελάσει τον αριθμητή του γονικού τομέα.

Αυτό αποκαλείται JavaScript κλείδα. Αυτό επιτρέπει στη συνάρτηση να έχειΠροσωπικόΆρα η μεταβλητή γίνεται δυνατή.

Ο αριθμητής προστατεύεται από τον τομέα της ανώνυμης συνάρτησης και μπορεί να τροποποιηθεί μόνο μέσω της συνάρτησης add.

Η κλείδα είναι μια συνάρτηση που έχει δικαίωμα πρόσβασης στον τομέα του γονικού συνάρτησης, ακόμη και μετά την κλείσιμο του γονικού συνάρτησης.