Что означает "var FOO = FOO || {}" (присвоение переменной или пустого объекта этой переменной) в Javascript?
глядя на онлайн исходный код я наткнулся на это в верхней части нескольких исходных файлов.
var FOO = FOO || {};
FOO.Bar = …;
но я понятия не имею, что || {}
делает.
Я знаю {}
равна new Object()
Я думаю ||
это что-то вроде "если он уже существует, использовать его, использовать новый объект.
почему я должен видеть это в верхней части исходного файла?
7 ответов:
ваша догадка относительно намерения
|| {}
довольно близко.этот конкретный шаблон при просмотре в верхней части файлов используется для создания пространство имен, т. е. именованный объект, какие функции и переменные могут быть созданы без чрезмерного загрязнения глобального объекта.
причина почему он используется, так что если у вас два (или более) файлов:
var MY_NAMESPACE = MY_NAMESPACE || {}; MY_NAMESPACE.func1 = { }
и
var MY_NAMESPACE = MY_NAMESPACE || {}; MY_NAMESPACE.func2 = { }
оба из которых разделяют то же самое пространство имен это тогда не имеет значения, в каком порядке загружаются два файла, вы все равно получите
func1
иfunc2
правильно определено в пределахMY_NAMESPACE
правильно объект.первый загруженный файл будет создать исходная
MY_NAMESPACE
объект, и любой впоследствии загруженный файл будет увеличить объект.полезно, это также позволяет асинхронные загрузка скриптов, которые используют одно и то же пространство имен, что может улучшить загрузку страницы раз. Если
<script>
теги естьdefer
набор атрибутов вы не можете знать, в каком порядке они будут трактовать, так, как описано выше, это тоже исправляет эту проблему.
var AEROTWIST = AEROTWIST || {};
в основном эта строка говорит установить
AEROTWIST
переменная к значениюAEROTWIST
переменная, или установите ее в пустой объект.двойная труба
||
является оператором OR, и вторая часть OR выполняется только в том случае, если первая часть возвращает false.таким образом, если
AEROTWIST
уже имеет значение, оно будет сохранено как это значение, но если оно не было установлено ранее, то оно будет установлено как пустой объект.это в основном то же самое, что говоря это:
if(!AEROTWIST) {var AEROTWIST={};}
надеюсь, что это поможет.
еще одним распространенным использованием для | / является установка значения по умолчанию для неопределенного параметра функции также:
function display(a) { a = a || 'default'; // here we set the default value of a to be 'default' console.log(a); } // we call display without providing a parameter display(); // this will log 'default' display('test'); // this will log 'test' to the console
эквивалент в другом программировании обычно является:
function display(a = 'default') { // ... }
существуют две основные части, которые
var FOO = FOO || {};
обложки.#1 предотвращение переопределения
представьте, что ваш код разделен на несколько файлов, и ваши коллеги также работают над объектом под названием
FOO
. Тогда это может привести к тому, что кто-то уже определилFOO
и назначил ему функциональность (например,.так что вам нужно использовать
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
(Ура!).#2 определение нового объекта
если у вас есть прочитайте первый пример, то вы уже сейчас, какова цель
|| {}
.потому что если нет
FOO
объект затем OR-case станет активным и создаст новый объект, поэтому вы можете назначить ему функции. Например:var FOO = {}; FOO.skateboard = function() { alert('I like skateboarding!'); };
Если в AEROTWIST нет значения или оно равно null или не определено, то значение, присвоенное новому AEROTWIST, будет {} (пустой объект)
The
||
оператор принимает два значения:a || b
если a истина, он вернется
a
. В противном случае, он вернетсяb
.ложные значения
null
,undefined
,0
,""
,NaN
иfalse
. Истинные ценности-это все остальное.так что если
a
не был установлен (этоundefined
) он будет возвращатьb
.
обратите внимание, что в некоторых версиях IE этот код не будет работать, как ожидалось. Потому что
var
переменная переопределяется и назначено так-если я правильно помню вопрос-вы будете в конечном итоге всегда иметь новый объект. Это должно исправить проблему:var AEROTWIST; AEROTWIST = AEROTWIST || {};