Tìm hiểu PHẠM VI BIẾN trong JavaScript

- Như chúng ta đã biết, nếu một biến được khai báo bên trong hàm thì biến đó chỉ có thể sử dụng ở bên trong hàm mà nó được khai báo (không thể sử dụng bên ngoài hàm), còn nếu một biến được khai báo bên ngoài hàm thì biến đó có thể sử dụng được ở cả bên trong lẫn bên ngoài hàm.

Ví dụ:

Biến myName được khai báo bên ngoài hàm, biến year được khai báo bên trong hàm

<script>
    var myName = "Nguyễn Thành Nhân";
    function intro(){
        var year = 1993;
        document.write("- Họ tên: " + myName); //biến myName sử dụng được bên trong hàm
        document.write("<br>");
        document.write("- Năm sinh: " + year); //biến year sử dụng được bên trong hàm
        document.write("<br>");
    }
    intro();
    document.write("+ Họ tên: " + myName); //biến myName sử dụng được bên ngoài hàm
    document.write("+ Năm sinh: " + year); //biến year KHÔNG sử dụng được bên ngoài hàm
</script>

Xem ví dụ

- Từ đây hình thành nên một khái niệm gọi là "phạm vi biến".

- Phạm vi biến xác định phạm vi mà một biến có thể được sử dụng (truy cập).

- Nếu dựa theo phạm vi biến thì biến được chia làm hai loại:

Biến cục bộ (Local Variable)
Biến toàn cục (Global Variable)

1) Biến cục bộ (Local Variable)

- Biến cục bộ là loại biến mà nó được khai báo ở vị trí bên trong một hàm.

- Biến cục bộ chỉ có thể được truy cập ở vị trí bên trong hàm mà nó được khai báo.

Ví dụ:

Biến myName được khai báo bên trong hàm intro() nên nó trở thành biến cục bộ của hàm intro()

<script>

    function intro(){
        var myName = "Nguyễn Thành Nhân";
        document.write(myName); //biến myName chỉ được truy cập bên trong hàm intro()
    }

    intro();

    document.write(myName); //biến myName không thể truy cập ở bên ngoài hàm intro()

    function hello(){
        document.write(myName); //biến myName không thể truy cập ở bên trong hàm khác
    }

    hello();

</script>

Xem ví dụ

- Lưu ý: Vì biến cục bộ chỉ có thể sử dụng bên trong hàm mà nó được khai báo. Nên do đó, với cùng một tên biến, ta có thể khai báo ở những hàm khác nhau.

Ví dụ:

Biến myName có thể được khai báo bên trong hàm intro() và cả hàm hello()

<script>
    function intro(){
        var myName = "Lữ Phụng Tiên";
        document.write("Tên tôi là: " + myName);
    }
    function hello(){
        var myName = "Quan Vân Trường";
        document.write("Xin chào " + myName);
    }
</script>

Xem ví dụ

Các tham số của hàm cũng được xem như biến cục bộ của hàm.

2) Biến toàn cục (Global Variable)

- Biến toàn cục là loại biến mà nó được khai báo ở vị trí bên ngoài một hàm.

- Biến toàn cục có thể được truy cập ở bất kỳ vị trí nào trong chương trình JavaScript.

Ví dụ:

Trong đoạn mã bên dưới, biến myName là một biến toàn cục

<script>

    var myName = "Nguyễn Thành Nhân";

    document.write("Tên tôi là: " + myName); //biến myName có thể truy cập bên ngoài hàm

    function hello(){
        document.write("Xin chào: " + myName); //biến myName có thể truy cập bên trong hàm
    }

    hello();

</script>

Xem ví dụ

- Lưu ý: Khi ở bên trong một hàm, nếu ta khai báo biến mà thiếu từ khóa var (hay nói cách khác là gán giá trị cho biến trong khi nó chưa được khai báo) thì biến đó sẽ trở thành biến toàn cục.

Ví dụ:

Trong đoạn mã bên dưới, biến myName là một biến toàn cục

<script>

    function hello(){
        myName = "Nguyễn Thành Nhân";
        document.write("Xin chào: " + myName);
    }
        
    hello();
        
    document.write("Tên của tôi là: " + myName);

</script>

Xem ví dụ