Глядя на исходный код в Интернете, я обнаружил это в верхней части нескольких исходных файлов.
var FOO = FOO || {};
FOO.Bar = …;
Но я понятия не имею, что || {}
делает.
Я знаю, что {}
это равно, new Object()
и я думаю, что ||
это что-то вроде «если он уже существует, используйте его значение, иначе используйте новый объект.
Почему я должен увидеть это в верхней части исходного файла?
javascript
namespaces
variable-declaration
or-operator
Рикардо Санчес
источник
источник
Ответы:
Ваше предположение относительно намерения
|| {}
довольно близко.Этот конкретный шаблон в верхней части файлов используется для создания пространства имен , то есть именованного объекта, в котором могут быть созданы функции и переменные без чрезмерного загрязнения глобального объекта.
Причина, по которой он используется, заключается в том, что если у вас есть два (или более) файла:
и
оба из них используют одно и то же пространство имен, тогда не имеет значения, в каком порядке загружаются два файла, вы все равно получите
func1
иfunc2
правильно определите вMY_NAMESPACE
объекте правильно.Первый загруженный файл создаст исходный
MY_NAMESPACE
объект, а любой впоследствии загруженный файл будет дополнять объект.Полезно, что это также позволяет асинхронную загрузку скриптов, которые используют одно и то же пространство имен, что может улучшить время загрузки страницы. Если для
<script>
тегов установленdefer
атрибут, вы не можете знать, в каком порядке они будут интерпретироваться, поэтому, как описано выше, это также решает эту проблему.источник
||
также действительно полезен, если вы хотите предоставить необязательные аргументы и инициализировать их значениями по умолчанию, если они неfunction foo(arg1, optarg1, optarg2) { optarg1 = optarg1 || 'default value 1'; optarg2 = optart2 || 'defalt value 2';}
||
оператор не может определитьundefined
отfalsey
.В основном эта строка говорит, что установите
AEROTWIST
переменную на значениеAEROTWIST
переменной или установите ее на пустой объект.Двойной канал
||
- это оператор ИЛИ, а вторая часть ИЛИ выполняется только в том случае, если первая часть возвращает ложь.Следовательно, если
AEROTWIST
уже есть значение, оно будет сохранено как это значение, но если оно не было установлено ранее, оно будет установлено как пустой объект.это в основном то же самое, что сказать следующее:
Надеюсь, это поможет.
источник
Еще одно распространенное использование || - также установить значение по умолчанию для неопределенного параметра функции:
Эквивалент в другом программировании обычно:
источник
var
передa
,a
входит в контекст выполнения функции в качестве формального параметра , поэтому он уже объявлен.Он состоит из двух основных частей
var FOO = FOO || {};
.# 1 Предотвращение переопределения
Представьте, что ваш код разделен на несколько файлов, и ваши коллеги также работают над объектом с именем
FOO
. Тогда это может привести к тому, что кто-то уже определилFOO
и назначил ему функциональность (например,skateboard
функцию). Затем вы бы переопределили его, если бы не проверяли, существует ли он уже.Проблемный случай:
В этом случае
skateboard
функция исчезнет, если вы загрузите файл JavaScripthomer.js
послеbart.js
в своем HTML, потому что Гомер определяет новыйFOO
объект (и, таким образом, переопределяет существующий объект от Барта), поэтому он знает только оdonut
функции.Поэтому вам нужно использовать
var FOO = FOO || {};
это означает, что «FOO будет назначен FOO (если он уже существует) или новому пустому объекту (если FOO еще не существует).Решение:
Поскольку Барт и Гомер теперь проверяют наличие,
FOO
прежде чем они определят свои методы, вы можете загружатьbart.js
иhomer.js
в любом порядке, не переопределяя методы друг друга (если у них разные имена). Таким образом, вы всегда будете получатьFOO
объект, у которого есть методыskateboard
иdonut
(Ура!).# 2 Определение нового объекта
Если вы прочитали первый пример, то вы уже знаете, какова цель
|| {}
.Потому что, если нет существующего
FOO
объекта, тогда OR-case станет активным и создаст новый объект, поэтому вы можете назначить ему функции. Подобно:источник
Если в AEROTWIST нет значения или оно равно нулю или не определено, значение, присвоенное новому AEROTWIST, будет {} (пустой объект)
источник
||
Оператор принимает два значения:Если a истинно , оно вернется
a
. В противном случае он вернетсяb
.В falsy значения
null
,undefined
,0
,""
,NaN
иfalse
. Истинные ценности - это все остальное.Так что, если
a
он не был установлен (это такundefined
), он вернетсяb
.источник
||
JS (и Perl) и версией в C, C ++ и Java заключается в том, что JS не приводит результат к логическому. Это по-прежнему логический оператор.Обратите внимание, что в некоторых версиях IE этот код работает не так, как ожидалось. Поскольку
var
, переменная переопределяется и назначается, поэтому - если я правильно помню проблему - у вас всегда будет новый объект. Это должно решить проблему:источник