Làm thế nào để khai báo một biến toàn cục trong JavaScript?

207

Nếu bạn có để tạo ra các biến toàn cục trong mã sản xuất (mà nên tránh) luôn tuyên bố họ rõ ràng:

window.globalVar = "This is global!";

Mặc dù có thể để xác định một biến toàn cầu bằng cách chỉ cần bỏ qua var (giả sử không có biến cục bộ có cùng tên), làm như vậy tạo ra tiềm ẩn toàn cầu toàn cầu, đó là điều không tốt và sẽ tạo ra lỗi trong chế độ nghiêm ngặt.

Nguồn

2010-07-28 10:39:58

+0

'cửa sổ' chỉ khả dụng trong trình duyệt. Bạn có thể chỉnh sửa câu trả lời của bạn để làm cho nó hoạt động trong mọi môi trường không? Xem [Cách lấy đối tượng toàn cầu trong JavaScript?] (Http://stackoverflow.com/q/3277182/3853934) –

+0

** Không bao giờ ** sử dụng camelCase, Earth là chương trình xiếc hàng đầu của đa vũ trụ và một ai đó ở đâu đó * sẽ * cuối cùng chuẩn hóa [chèn tên đối tượng điên ở đây]. Gắn vào dấu gạch ngang dưới dạng dấu phân cách trong URL và dấu gạch dưới cho dấu phân tách trong mã ('window.class_list'). – John

50

Nếu đây là ứng dụng duy nhất bạn sẽ sử dụng biến này, phương pháp của Felix rất tuyệt vời. Tuy nhiên, nếu bạn đang viết một plugin jQuery, hãy xem xét các biến "namespacing" (chi tiết về các dấu ngoặc kép sau ...) và các hàm cần thiết trong đối tượng jQuery. Ví dụ, tôi hiện đang làm việc trên một trình đơn bật lên jQuery mà tôi đã gọi là miniMenu. Vì vậy, tôi đã xác định một "không gian tên" miniMenu trong jQuery, và tôi đặt mọi thứ ở đó.

Lý do tôi sử dụng dấu ngoặc kép khi tôi nói về không gian tên javascript là chúng không thực sự là không gian tên theo nghĩa thông thường. Thay vào đó, tôi chỉ sử dụng một đối tượng javascript và đặt tất cả các hàm và biến của tôi làm thuộc tính của đối tượng này.

Ngoài ra, để thuận tiện, tôi thường thay thế không gian tên plugin bằng không gian tên i cho nội dung chỉ nên sử dụng bên trong plugin, để ẩn nội dung đó khỏi người dùng plugin.

Đây là cách hoạt động:

// An object to define utility functions and global variables on: 
$.miniMenu = new Object(); 
// An object to define internal stuff for the plugin: 
$.miniMenu.i = new Object();

Bây giờ tôi chỉ có thể làm $.miniMenu.i.globalVar = 3 hoặc $.miniMenu.i.parseSomeStuff = function(...) {...} bất cứ khi nào tôi cần phải lưu một cái gì đó trên toàn cầu, và tôi vẫn giữ nó ra khỏi không gian tên toàn cầu.

Nguồn

2010-07-28 11:00:45

+0

Cảm ơn vì điều đó Tomas, Trong trang web tôi đã đề cập ở trên, cách tiếp cận Felix hoạt động tốt, nhưng tôi có một trang web khác mà tôi cũng đang sử dụng một số plugin và cách tiếp cận của bạn sẽ là lý tưởng nếu tôi có thể làm việc đó. Chúc mừng sự giúp đỡ của bạn. – Dancer

+0

Điều này hoạt động hoàn hảo! Chỉ cần đảm bảo như @Tomas nói, Tạo lớp/chủ sở hữu của riêng bạn cho các hàm hoặc biến tùy chỉnh của riêng bạn. +1 – Pierre

+0

Cảm ơn Tomas! Nếu không bắt buộc, hãy xóa đối tượng mẹ (ví dụ: 'delete $ .miniMenu'). Là nó ổn? – KunJ

15

Dưới đây là ví dụ cơ bản về biến toàn cầu mà các chức năng còn lại của bạn có thể truy cập. Dưới đây là một ví dụ sống dành cho bạn: http://jsfiddle.net/fxCE9/

var myVariable = 'Hello'; 
alert('value: ' + myVariable); 
myFunction1(); 
alert('value: ' + myVariable); 
myFunction2(); 
alert('value: ' + myVariable); 


function myFunction1() { 
    myVariable = 'Hello 1'; 
} 

function myFunction2() { 
    myVariable = 'Hello 2'; 
}

Nếu bạn đang làm điều này trong một jquery sẵn sàng() chức năng thì chắc chắn rằng biến của bạn là bên trong sẵn sàng) function (alongwith các chức năng khác của bạn.

Nguồn

2010-07-28 11:39:40

+0

Câu trả lời hay nhất cho các biến toàn cầu hoạt động như thế nào trong jQuery. –

+0

Tôi biết tôi đang đào mộ nhưng đây không phải là một biến toàn cầu rõ ràng. Đây là một điều chỉnh nhiều hơn với một biến công cộng được chia sẻ không có phạm vi đóng cửa cho các kịch bản cực nhỏ. Chúng là hai phương thức/cách sử dụng hoàn toàn khác nhau và điều này sẽ giúp bạn gặp rắc rối lớn nếu bạn khai báo một toàn cầu rõ ràng trong một kịch bản nằm ở giữa một vài kịch bản lệnh khác nhau. Tôi chỉ có thể tưởng tượng một giao diện người dùng trong nhóm của mình tuyên bố biến toàn cục ở đầu tập lệnh là tập lệnh thứ 10 được gọi là DOM. –

4

Khai báo biến bên ngoài các chức năng

function dosomething(){ 
    var i = 0; // can only be used inside function 
} 

var i = ''; 
function dosomething(){ 
    i = 0; // can be used inside and outside the function 
}

Nguồn

2015-03-03 13:23:17 user3632465

19

Với jQuery bạn chỉ có thể làm được điều này, không có vấn đề mà việc kê khai là:

$my_global_var = 'my value';

Và sẽ có mặt ở khắp mọi nơi. tôi sử dụng nó để làm phòng trưng bày hình ảnh nhanh chóng, khi hình ảnh được lan truyền ở những nơi khác nhau, như vậy:

$gallery = $('img'); 
$current = 0; 

$gallery.each(function(i,v){ 
    // preload images 
    (new Image()).src = v; 
}); 
$('div').eq(0).append('<a style="display:inline-block" class="prev">prev</a> <div id="gallery"></div> <a style="display:inline-block" class="next">next</a>'); 
$('.next').click(function(){ 
    $current = ($current == $gallery.length - 1) ? 0 : $current + 1; 
    $('#gallery').hide().html($gallery[$current]).fadeIn(); 
}); 
$('.prev').click(function(){ 
    $current = ($current == 0) ? $gallery.length - 1 : $current - 1; 
    $('#gallery').hide().html($gallery[$current]).fadeIn(); 
});

Mẹo: chạy toàn bộ mã này trong giao diện điều khiển trong trang này ;-)

Nguồn

2015-06-02 02:42:28 aesede

+1

Không phải là $ gallery và $ hiện tại chỉ là biến toàn cầu bình thường? Chúng hoạt động vì bạn định nghĩa chúng là biến toàn cầu bằng cách bỏ qua 'var', nhưng ký hiệu đô la trước chúng không làm cho chúng 'biến jQuery' ... Nghĩa đen là đặt dấu gạch dưới hoặc dấu khác trên chúng ... Chúng sẽ là các biến jQuery nếu bạn sử dụng đối tượng jQuery ($) và thêm một thuộc tính vào nó: $ .myGlobalVariable = 'my value' ... –

+0

Có lẽ bạn đang đúng, nhưng những gì đáng chú ý là sử dụng cú pháp $ myVar bạn nhận được 2 lần phiêu lưu, 1) biến là toàn cầu mà không có bất kỳ khai báo đặc biệt nào (bên cạnh $); và 2) bạn có thể theo dõi các biến toàn cầu của mình rất dễ dàng bên trong mã. Mở để thảo luận mặc dù ... – aesede

3

Các cách tốt nhất là sử dụng closures, vì đối tượng window rất, rất lộn xộn với các thuộc tính.

Html

<!DOCTYPE html> 
<html> 
    <head> 
    <script type="text/javascript" src="init.js"></script> 
    <script type="text/javascript"> 
     MYLIBRARY.init(["firstValue", 2, "thirdValue"]); 
    </script> 
    <script src="script.js"></script> 
    </head> 

    <body> 
    <h1>Hello !</h1> 
    </body>  
</html>

init.js (Dựa trên this answer)

var MYLIBRARY = MYLIBRARY || (function(){ 
    var _args = {}; // private 

    return { 
     init : function(Args) { 
      _args = Args; 
      // some other initialising 
     }, 
     helloWorld : function(i) { 
      return _args[i]; 
     } 
    }; 
}());

script.js

// Here you can use the values defined in the html as if it were a global variable 
var a = "Hello World " + MYLIBRARY.helloWorld(2); 

alert(a);

Đây là số plnkr. Hy vọng nó giúp!

Nguồn

2015-12-07 14:41:16 robe007

Làm thế nào để khai báo một biến toàn cục trong JavaScript?

Trả lời

Các vấn đề liên quan