I want to create my own namespace, something like $ for JQuery
(function(app) {
app.fn.log = function(data) {
console.log(data);
};
}(app));
app.log("data");
But this code returns an error - Uncaught ReferenceError: app is not defined
How do I create my own namespace?
A common approach for implementing namespacing in javascript is to leverage the module pattern with immediate functions for scoping (like you demonstrated in your question). This also allows you to pass in objects with non-conflicting names and use them with parameterized names that you would prefer such as $ like so:
//Global script declaration
var NAMESPACE = {};
//Check if you need to initialize your namespace
NAMESPACE.FooSpace = NAMESPACE.FooSpace || {};
//Some other script
NAMESPACE.FooSpace = (function($) {
function Foo1() {
}
function Foo2() {
return $.getSomething(); //some existing function inside of someObjectWithANonConflictingName object
}
return { Foo1: Foo1, Foo2: Foo2 };
})(someObjectWithANonConflictingName);
//somewhere else in code (call as a constructor function)
var foo = new NAMESPACE.FooSpace.Foo1();
//somewhere else in code (call as regular function)
var foo2 = Foo2();
NAMESPACE object in order to have overlapping names of functions and variables. NAMESPACE object.
window.app = {};
(function(app) {
app.log = function(data) {
console.log(data);
};
}(app));
app.log("data");
jQuery deals a little bit different with it's fn: as you use $('selector') syntax to find elements you need to process jQuery returns spetial wrapper that contains all the fn.func-like definitions you made in addition to the built-in functions.
So if you need to implement some kind of extensibility you should think over such wrapping first. For example:
window.app = function(p) {
// do whatever you need
var wrapper = {
// standard common fields
};
if (app.fn) {
// extend wrapper with app.fn
}
return wrapper;
};
By the way what problem are you trying to solve?
In your case there is of course an exception because app in not defined by the time anonymous function gets executed.
line? Line number?Your syntax is ok, but you have to define an app. You are passing the app as parameter to your IIFE, but app is not defined! If you wanted to access jQuery as app, simply call your IIFE with jQuery object like this:
(function(app) {
app.fn.log = function(data) {
console.log(data);
};
}($)); // where $ is your jQuery.
and
$.log("data");
Beware! The log function will be available inside and outside the scope of IIFE!
appdefined? The function takes anappargument and you pass anappvariable, that doesn't exist...