Phạm vi biến JavaScript: Cách sử dụng hiệu quả

Phạm vi đề cập đến sự có sẵn của biến và hàm trong một số phần của mã.

Trong JavaScript, biến có hai loại phạm vi:

. Phạm vi Toàn cầu
. Phạm vi Cục bộ

Phạm vi Toàn cầu

Một biến được khai báo ở đầu chương trình hoặc bên ngoài một hàm được xem xét là một biến phạm vi toàn cầu.

Hãy xem một ví dụ về biến phạm vi toàn cầu.

// program to print a text 
let a = "hello";

function greet () {
    console.log(a);
}

greet(); // hello

Run Code

Trong chương trình trên, biến a được khai báo ở đầu chương trình và là một biến toàn cầu. Điều này có nghĩa là biến a có thể được sử dụng ở bất kỳ đâu trong chương trình.

Giá trị của một biến toàn cầu có thể thay đổi bên trong một hàm. Ví dụ,

// program to show the change in global variable
let a = "hello";

function greet() {
    a = 3;
}

// before the function call
console.log(a);

//after the function call
greet();
console.log(a); // 3

Run Code

Trong chương trình trên, biến a là một biến toàn cầu. Giá trị của a là hello. Sau đó, biến a được truy cập bên trong một hàm và giá trị thay đổi thành 3.

Do đó, giá trị của a thay đổi sau khi thay đổi nó bên trong hàm.

Chú ý : Thực hành tốt là tránh sử dụng biến toàn cầu vì giá trị của một biến toàn cầu có thể thay đổi ở các khu vực khác nhau trong chương trình. Điều này có thể gây ra kết quả không xác định trong chương trình.

Trong JavaScript, một biến cũng có thể được sử dụng mà không cần phải khai báo. Nếu một biến được sử dụng mà không cần phải khai báo, biến đó tự động trở thành biến toàn cầu.

Ví dụ,

function greet() {
    a = "hello"
}

greet();

console.log(a); // hello

Run Code

Trong chương trình trên, biến a là một biến toàn cầu.

Nếu biến được khai báo bằng cách sử dụng let a = "hello", chương trình sẽ gây ra lỗi.

Chú ý : Trong JavaScript, có "chế độ nghiêm ngặt"; trong đó một biến không thể được sử dụng mà không cần phải khai báo nó.

Phạm vi Cục bộ

Một biến cũng có thể có phạm vi cục bộ, tức là nó chỉ có thể được truy cập bên trong một hàm.

Ví dụ 1: Biến Phạm vi Cục bộ

// program showing local scope of a variable
let a = "hello";

function greet() {
    let b = "World"
    console.log(a + b);
}

greet();
console.log(a + b); // error

Run Code

Kết quả

helloWorld
Uncaught ReferenceError: b is not defined

Trong chương trình trên, biến a là biến toàn cầu và biến b là biến cục bộ. Biến b chỉ có thể truy cập bên trong hàm greet. Do đó, khi chúng ta cố gắng truy cập biến b bên ngoài hàm, sẽ xảy ra lỗi.

let có Phạm vi Khối

Từ khóa let có phạm vi khối (biến chỉ có thể truy cập trong khối ngay lập tức).

Ví dụ 2: Biến có Phạm vi Khối

// program showing block-scoped concept
// global variable
let a = 'Hello';

function greet() {

    // local variable
    let b = 'World';

    console.log(a + ' ' + b);

    if (b == 'World') {

        // block-scoped variable
        let c = 'hello';

        console.log(a + ' ' + b + ' ' + c);
    }

    // variable c cannot be accessed here
    console.log(a + ' ' + b + ' ' + c);
}

greet();

Run Code

Kết quả

Hello World
Hello World hello
Uncaught ReferenceError: c is not defined

Trong chương trình trên, biến

• a là biến toàn cầu. Nó có thể được truy cập ở bất kỳ đâu trong chương trình.
• b là biến cục bộ. Nó chỉ có thể được truy cập bên trong hàm greet.
• c là biến có phạm vi khối. Nó chỉ có thể được truy cập bên trong khối lệnh if.

Do đó, trong chương trình trên, hai console.log() đầu tiên hoạt động mà không gây ra vấn đề gì.

Tuy nhiên, chúng ta đang cố gắng truy cập biến có phạm vi khối c bên ngoài khối trong console.log() thứ ba. Điều này sẽ gây ra lỗi.

Chú ý : Trong JavaScript, var có phạm vi của hàm và let có phạm vi khối. Nếu bạn cố gắng sử dụng var c = 'hello'; bên trong câu lệnh if trong chương trình trên, toàn bộ chương trình hoạt động, vì c được xem xét là một biến cục bộ.

• Bài đăng blog này ban đầu được xuất bản tại:https://www.programiz.com/