Có hai phần chính var FOO = FOO || {};bao gồm.
# 1 Ngăn chặn ghi đè
Hãy tưởng tượng bạn có mã của mình được chia thành nhiều tệp và đồng nghiệp của bạn cũng đang làm việc trên một Đối tượng được gọi FOO. Sau đó, nó có thể dẫn đến trường hợp ai đó đã xác định FOOvà gán chức năng cho nó (như một skateboardhàm). Sau đó, bạn sẽ ghi đè nó, nếu bạn không kiểm tra xem nó đã tồn tại chưa.
Trường hợp có vấn đề:
// Definition of co-worker "Bart" in "bart.js"
var FOO = {};
FOO.skateboard = function() {
alert('I like skateboarding!');
};
// Definition of co-worker "Homer" in "homer.js"
var FOO = {};
FOO.donut = function() {
alert('I like donuts!');
};
Trong trường hợp này, skateboardhàm sẽ biến mất nếu bạn tải tệp JavaScript homer.jssau bart.jstrong HTML của mình vì Homer định nghĩa một FOOđối tượng mới (và do đó ghi đè đối tượng hiện có từ Bart) để nó chỉ biết về donuthàm.
Vì vậy, bạn cần sử dụng var FOO = FOO || {};có nghĩa là “FOO sẽ được gán cho FOO (nếu nó đã tồn tại) hoặc một đối tượng trống mới (nếu FOO chưa tồn tại).
Giải pháp:
var FOO = FOO || {};
// Definition of co-worker Bart in bart.js
FOO.skateboard = function() {
alert('I like skateboarding!');
};
// Definition of co-worker Homer in homer.js
var FOO = FOO || {};
FOO.donut = function() {
alert('I like donuts!');
};
Bởi vì Bart và Homer tại đang kiểm tra sự tồn tại của FOOtrước khi họ xác định phương pháp của họ, bạn có thể tải bart.jsvà homer.jstrong bất kỳ thứ tự mà không trọng phương pháp của nhau (nếu họ có tên gọi khác nhau). Vì vậy, bạn sẽ luôn nhận được một FOOđối tượng có các phương thức skateboardvà donut(Yay!).
# 2 Xác định một đối tượng mới
Nếu bạn đã đọc qua ví dụ đầu tiên thì bây giờ bạn đã biết mục đích của nó là gì || {}.
Bởi vì nếu không có FOOđối tượng hiện có thì trường hợp OR sẽ hoạt động và tạo ra một đối tượng mới, vì vậy bạn có thể gán các chức năng cho nó. Giống:
var FOO = {};
FOO.skateboard = function() {
alert('I like skateboarding!');
};