Tuesday, 12 July 2016

namespaces - What does "var FOO = FOO || {}" (assign a variable or an empty object to that variable) mean in Javascript?



Looking at an online source code I came across this at the top of several source files.



var FOO = FOO || {};
FOO.Bar = …;



But I have no idea what || {} does.



I know {} is equal to new Object() and I think the || is for something like "if it already exists use its value else use the new object.



Why would I see this at the top of a source file?


Answer



Your guess as to the intent of || {} is pretty close.



This particular pattern when seen at the top of files is used to create a namespace, i.e. a named object under which functions and variables can be created without unduly polluting the global object.




The reason why it's used is so that if you have two (or more) files:



var MY_NAMESPACE = MY_NAMESPACE || {};
MY_NAMESPACE.func1 = {
}


and



var MY_NAMESPACE = MY_NAMESPACE || {};

MY_NAMESPACE.func2 = {
}


both of which share the same namespace it then doesn't matter in which order the two files are loaded, you still get func1 and func2 correctly defined within the MY_NAMESPACE object correctly.



The first file loaded will create the initial MY_NAMESPACE object, and any subsequently loaded file will augment the object.



Usefully, this also allows asynchronous loading of scripts that share the same namespace which can improve page loading times. If the

Subscribe to: Post Comments (Atom)

c++ - Does curly brackets matter for empty constructor?

Those brackets declare an empty, inline constructor. In that case, with them, the constructor does exist, it merely does nothing more than t...