Bạn có thể khai báo biến toàn cục bên trong hàm javascript không?

Question

Biến toàn cầu JavaScript là một biến có phạm vi toàn cầu, nghĩa là nó hiển thị và có thể truy cập được trong toàn bộ chương trình, trừ khi bị che khuất. Bài viết này đề cập đến một vấn đề mà tôi đã từng đập đầu vào ngày khác

Nội dung chính Show

Các biến toàn cục của jQuery (hoặc JavaScript)
Kết luận biến toàn cầu
Giải trình
Bạn có thể khai báo một biến trong hàm JavaScript không?
Bạn có thể khai báo một biến bên trong một hàm không?
Có thể thay đổi biến toàn cục bên trong một hàm không?

Các biến toàn cục của jQuery (hoặc JavaScript)

Tôi cần khai báo một biến toàn cục bên trong một hàm JavaScript, sau đó đọc nó bên trong một hàm khác. Nếu chức năng đầu tiên không được gọi/khởi tạo, thì chức năng thứ hai không biết giá trị của biến toàn cục

Ví dụ hàm này set thứ tự sắp xếp của một cột trong bảng, chả có gì hay ho cho lắm

function clickMe(sortOrder) {
    sortOrderNew = sortOrder;
}

Khi hàm được thực thi, một biến JavaScript toàn cục được đặt. Lưu ý không có var trong phần khai báo

Đường thẳng này

var sortOrderNew = sortOrder;

sẽ đặt một biến cục bộ bên trong hàm đã nói

Bây giờ, hàm thứ hai cần biến toàn cục này. Nếu nó được đặt, nó sẽ tự động lấy nó, nếu không, nó sẽ đặt một biến cục bộ có giá trị dự phòng

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

Lưu ý rằng tôi đang thực hiện một số kiểm tra để xem liệu sortOrderNew có được xác định hay không. Nếu không, nó sẽ gán cho nó giá trị của 3 (nó có ý nghĩa bên trong chức năng của tôi). Một lần nữa, lưu ý rằng tôi đang sử dụng var trước các biến của mình để đặt chúng cục bộ

Kết luận biến toàn cầu

if (typeof myVariable === 'undefined') kiểm tra xem myVariable có được xác định hay không

var myVariable = 5;

Bỏ qua var sẽ làm cho myVariable trở nên toàn cầu (i. e. , có thể đọc được giữa các chức năng và có sẵn cho mã khác)

Chuyên gia SEO Nhà phát triển web https. //getbướm. com/ https. //getbướm. com/tác giả/ciprian/ https. //www. 4 tài sản. com/tác giả/ciprian/ https. //www. linkin. com/in/cipriangb/ Sở hữu. nhậnBướm

Ciprian Popescu

Chuyên gia kỹ thuật SEO, nhà phát triển JavaScript và nhà phát triển full-stack cao cấp. Chủ sở hữu của getButterfly. com

Tuy nhiên, nếu bạn tạo một biến bên trong phạm vi của hàm có cùng tên với biến globalVariable, bạn sẽ mất quyền truy cập vào giá trị của biến globalVariable bên trong phạm vi của hàm

Nếu bạn đọc đoạn mã trên theo thứ tự dòng nào được thực thi, đây là điều bạn nghĩ sẽ xảy ra

tạo globalVariable và gán cho nó một giá trị
Gọi một số chức năng
ghi giá trị của
```
var sortOrderNew = sortOrder;
```
2 vào bảng điều khiển. Bạn muốn điều này ghi nhật ký
```
var sortOrderNew = sortOrder;
```
3
tạo một biến cục bộ mới có cùng tên với globalVariable.
```
var sortOrderNew = sortOrder;
```
2 và cho nó một giá trị
Ghi nhật ký biến cục bộ mới này. Bạn mong đợi
```
var sortOrderNew = sortOrder;
```
5 được in

Tuy nhiên, bạn thực sự nhận được một lỗi. Javascript sẽ cho bạn biết rằng globalVariable không được xác định

var sortOrderNew = sortOrder;

6

Giải trình

Điều này là do bất kể bạn xác định biến của mình ở đâu, nó sẽ nâng biến đó lên đầu phạm vi kèm theo của chúng. Điều đó có nghĩa là, nếu một biến được xác định trong một phạm vi, javascript sẽ di chuyển biến đó lên đầu phạm vi. Đây cũng là lý do bạn có thể gọi một hàm trong javascript ở dòng 1 mặc dù hàm đó không được xác định cho đến dòng 2

Kết quả là trong ví dụ thứ hai, bạn mất quyền truy cập vào

var sortOrderNew = sortOrder;

2 được xác định bên ngoài phạm vi của hàm, vì nó đã được đưa lên đầu phạm vi (còn gọi là bên trong hàm)

khai báo biến. Một biến có thể được khai báo là biến toàn cục hoặc biến cục bộ. Biến có thể được khai báo bằng các từ khóa var, let, const. Trước ES6, chỉ có một từ khóa var để khai báo một biến JavaScript.

Biến toàn cục là các biến có thể được truy cập từ bất kỳ đâu trong chương trình. Đây là những biến được khai báo trong phần thân chính của mã nguồn và bên ngoài tất cả các hàm. Các biến này có sẵn cho mọi chức năng để truy cập.

Biến toàn cục được khai báo ở đầu khối (đầu chương trình)
Từ khóa Var dùng để khai báo biến toàn cục
Biến toàn cục có thể được truy cập từ bất kỳ phần nào của chương trình

Ghi chú. Nếu bạn gán giá trị cho một biến mà quên khai báo thì biến đó sẽ tự động được coi là biến toàn cục

ví dụ 1. Trong ví dụ này, chúng ta khai báo biến khi bắt đầu chương trình bên ngoài mọi hàm bằng cách sử dụng từ khóa var.

HTML

var sortOrderNew = sortOrder;

8

var sortOrderNew = sortOrder;

9

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

0____21

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

2

var sortOrderNew = sortOrder;

9

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

4

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

6

var sortOrderNew = sortOrder;

9____190

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

var sortOrderNew = sortOrder;

92

var sortOrderNew = sortOrder;

9

var sortOrderNew = sortOrder;

94

var sortOrderNew = sortOrder;

95

var sortOrderNew = sortOrder;

96

var sortOrderNew = sortOrder;

97

var sortOrderNew = sortOrder;

98

var sortOrderNew = sortOrder;

94

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

2

var sortOrderNew = sortOrder;

92

var sortOrderNew = sortOrder;

9

var sortOrderNew = sortOrder;

94

var sortOrderNew = sortOrder;

95

var sortOrderNew = sortOrder;

96

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

07

var sortOrderNew = sortOrder;

98

var sortOrderNew = sortOrder;

94

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

2

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

12

var sortOrderNew = sortOrder;

92____19____215

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

18

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

2

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

21

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

23

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

24

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

25

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

24

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

27

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

2

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

var sortOrderNew = sortOrder;

90

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

24

var sortOrderNew = sortOrder;

92

var sortOrderNew = sortOrder;

93____194

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

var sortOrderNew = sortOrder;

96

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

var sortOrderNew = sortOrder;

98

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

40

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

2

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

17

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

43

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

44

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

45

var sortOrderNew = sortOrder;

92____247

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

15

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

6

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

47

var sortOrderNew = sortOrder;

90

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

47

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

4

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

2

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

47

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

0

function chipPaginate(page) {
    if (typeof sortOrderNew === 'undefined') {
        var sortOrder = 3;
    }

    if (typeof sortOrderNew !== 'undefined') {
        var sortOrder = sortOrderNew;
    }

    console.log(sortOrder);
}

5

đầu ra

ví dụ 2. Khai báo biến Toàn cục trong một hàm bằng cách sử dụng đối tượng cửa sổ. Biến được khai báo bằng đối tượng cửa sổ là biến toàn cục và có thể được truy cập từ bất kỳ phần nào của chương trình

Bạn có thể khai báo một biến trong hàm JavaScript không?

Một hàm trong JavaScript xác định phạm vi cho các biến được khai báo bằng cách sử dụng var , let và const . Bất kỳ biến nào được khai báo trong hàm đó chỉ có thể truy cập được từ hàm đó và mọi hàm lồng nhau. Một khối mã ( if , for , v.v. ) chỉ xác định phạm vi cho các biến được khai báo bằng từ khóa let và const.

Bạn có thể khai báo một biến bên trong một hàm không?

Phạm vi là một vùng của chương trình và nói chung có ba vị trí, nơi các biến có thể được khai báo. Bên trong một hàm hay một khối được gọi là biến cục bộ , trong định nghĩa các tham số của hàm được gọi là tham số hình thức.

Có thể thay đổi biến toàn cục bên trong một hàm không?

Các hàm có thể truy cập các biến toàn cục và sửa đổi chúng . Sửa đổi các biến toàn cục trong một hàm được coi là thực hành lập trình kém. Tốt hơn là gửi một biến dưới dạng tham số (hoặc để nó được trả về trong câu lệnh 'return').

programming javascript