Есть две основные части, которые охватывает var FOO = FOO || {};.
# 1 Предотвращение переопределений
Представьте, что ваш код разделен на несколько файлов и ваши коллегитакже работают над объектом под названием FOO.Тогда это может привести к тому, что кто-то уже определит FOO и назначит ему функциональность (например, функцию skateboard).Тогда вы переопределите его, если не проверяете, существует ли он уже.
Проблемный случай:
// 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!');
};
В этом случае функция skateboard пропадет, если вы загрузите файл JavaScript homer.js после bart.js в свойHTML, потому что Гомер определяет новый объект FOO (и, таким образом, переопределяет существующий объект из Bart), поэтому он знает только о функции donut.
Поэтому вам нужно использовать var FOO = FOO || {};, что означает "FOOбыть назначенным на FOO (если он уже существует) или на новый пустой объект (если FOO еще не существует).
Решение:
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!');
};
Потому что Барт иТеперь Гомер проверяет наличие FOO, прежде чем они определят свои методы, вы можете загружать bart.js и homer.js в любом порядке, не переопределяя методы друг друга (если у них разные имена). Таким образом, вы всегда получите FOO объект, который имеет методы skateboard и donut (Yay!).
# 2 Определение нового объекта
Если вы прочиталиПервый пример, то вы уже сейчас, какова цель || {}.
Потому чтоесли не существует FOO объекта, тогда OR-case становится активным и создает новый объект, так что вы можете назначить ему функции.Как:
var FOO = {};
FOO.skateboard = function() {
alert('I like skateboarding!');
};