Trong bài viết này, ta sẽ cùng tìm hiểu về phạm vi của biến trong JavaScript cùng với sự trợ giúp của các ví dụ.

Phạm vi của biến trong JavaScript

Phạm vi của biến liên quan đến tính khả dụng của các biến và hàm trong các phần nhất định của mã.

Trong JavaScript, một biến có hai kiểu phạm vi khác nhau:

Phạm vi toàn cục.
Phạm vi cục bộ.

1. Phạm vi toàn cục

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

Ví dụ:

var a = 5;
var b = 2;
function phep_chia () {
    console.log(a/b);
}
phep_chia();

var a = 5;

var b = 2;

function phep_chia () {

console.log(a/b);

}

phep_chia();

Kết quả:

2.5

2.5

Trong chương trình trên, biến a và b được khai báo ở đầu chương trình và là hai biến toàn cục. Nó có nghĩa là biến a và b 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ục có thể được thay đổi bên trong một hàm.

Ví dụ:

var a = 5;
var b = 2;
function phep_chia () {
    a = 10;
    console.log(a/b);
}
phep_chia();
console.log(a);

var a = 5;

var b = 2;

function phep_chia () {

a = 10;

console.log(a/b);

}

phep_chia();

console.log(a);

Kết quả:

5
10

Trong chương trình trên, biến a và b là hai biến toàn cục. Giá trị của a ban đầu là 5. Sau đó, biến a được truy cập bên trong hàm và giá trị thay đổi thành 10. Do đó, giá trị của a được thay đổi sau khi thay đổi nó bên trong hàm.

Chú ý: Nên tránh sử dụng các biến toàn cục vì giá trị của một biến toàn cục có thể thay đổi trong các khu vực khác nhau trong chương trình. Nó có thể đưa ra các kết quả chưa biết trong chương trình.

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

Ví dụ:

var b = 2;
function phep_chia () {
    a = 10;
    console.log(a/b);
}
phep_chia();
console.log(a);

var b = 2;

function phep_chia () {

a = 10;

console.log(a/b);

}

phep_chia();

console.log(a);

Kết quả:

5
10

Trong chương trình trên, biến a và b là hai biến toàn cục. Nếu biến được khai báo bằng var a = 10, chương trình sẽ báo lỗi.

var b = 2;
function phep_chia () {
    var a = 10;
    console.log(a/b);
}
phep_chia();
console.log(a);

var b = 2;

function phep_chia () {

var a = 10;

console.log(a/b);

}

phep_chia();

console.log(a);

2. 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 trong một hàm.

Ví dụ:

var b = 2;
function phep_chia () {
    var a = 10;
    console.log(a/b);
}
phep_chia();
console.log(a);

var b = 2;

function phep_chia () {

var a = 10;

console.log(a/b);

}

phep_chia();

console.log(a);

Kết quả nhận được sẽ là thông báo lỗi.

Trong chương trình trên, biến b là biến toàn cục và biến a là biến cục bộ. Biến a chỉ có thể được truy cập bên trong hàm phep_chia. Do đó, khi chúng ta cố gắng truy cập vào biến a bên ngoài hàm, một lỗi sẽ xảy ra. Từ khóa let có tính phạm vi trong một khối (chỉ có thể truy cập biến trong khối).

Ví dụ:

let a = 10;
function phep_chia() {
    let b = 5;
    console.log(a / b);
    if (b == 5) {
        let c = 2;
        console.log(a + ' ' + b + ' ' + c);
    }
    console.log(a + ' ' + b + ' ' + c);
}
phep_chia();

let a = 10;

function phep_chia() {

let b = 5;

console.log(a / b);

if (b == 5) {

let c = 2;

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

}

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

}

phep_chia();

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

a là một biến toàn cục. Nó có thể được truy cập ở bất kỳ đâu trong chương trình.
b là một biến cục bộ. Nó chỉ có thể được truy cập bên trong hàm phep_chia.
c là một biến nằm trong 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ặp vấn đề gì.
Tuy nhiên, ta đã truy cập biến c bên ngoài khối lệnh if trong phương thức console.log() thứ ba. Điều này sẽ tạo ra một lỗi.

Chú ý: Trong JavaScript, var có tính phạm vi trong hàm và let có tính phạm vi trong một khối. Nếu ta cố gắng sử dụng var c = 2; bên trong câu lệnh if trong chương trình trên, toàn bộ chương trình sẽ vẫn hoạt động bình thường, vì c được coi như một biến cục bộ.

Ví dụ:

let a = 10;
function phep_chia() {
    let b = 5;
    console.log(a / b);
    if (b == 5) {
        var c = 2;
        console.log(a + ' ' + b + ' ' + c);
    }
    console.log(a + ' ' + b + ' ' + c);
}
phep_chia();

let a = 10;

function phep_chia() {

let b = 5;

console.log(a / b);

if (b == 5) {

var c = 2;

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

}

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

}

phep_chia();

Kết quả:

2
10 5 2
10 5 2

10 5 2

Trên đây là khái niệm và ví dụ cơ bản về phạm vi của biến trong JavaScript. Hy vọng mọi người có thể áp dụng vào trong chương trình của mình. Mọi người hãy tiếp tục theo dõi các bài tiếp theo và cập nhật các bài tiếp theo về lập trình JavaScript trên tek4 nhé!

P/s: Cảm ơn mọi người đã tin tưởng tek4!

0 0 vote

Article Rating