Click here to Skip to main content
Click here to Skip to main content

Quick Tip – JavaScript Namespaces

, 27 Jan 2012
Rate this:
Please Sign up or sign in to vote.
Quick Tip – JavaScript Namespaces Namespaces (or named scopes) are widely used in many programming languages. Namespaces help to group a set of identifiers into a logical group. An identifier can be a named class, named interface or any other language element that is contained inside the namespace.

Namespaces (or named scopes) are widely used in many programming languages. Namespaces help to group a set of identifiers into a logical group. An identifier can be a named class, named interface or any other language element that is contained inside the namespace. Since the same identifier can be used in more than one namespace but with a different meaning, using namespaces can help reduce name collisions.

Creating a JavaScript Namespace

JavaScript doesn’t include namespaces. On the other hand, JavaScript includes function scopes which means that every function which is created in the JavaScript global scope holds its own scope. With this information in mind, we can mimic namespace scope by creating a function scope. Doing so will help to reduce the number of objects associated with the global scope and help to avoid collisions between identifiers created for an application when using external libraries for example. Here is an example of creating a JavaScript namespace using a function scope:

var ns = ns || {};

The code uses a simple check whether the namespace was declared previously. If the namespace was declared the left side of the statement is evaluated and the ns variable will include the previously defined namespace. If the namespace wasn’t declared previously a new object literal (which is another way to create a function in JavaScript) will be created and be set to the ns variable.

Using a JavaScript Namespace

In the previous example a namespace was declared. In order to use the namespace you will use its name and create objects/functions inside of it. Here is an example of setting a simple object inside of the previously created namespace:

ns.Game = function (id, name, description) {
    this.id = id;
    this.name = name;
    this.description = description;
};

Now if you want to use the Game object you will create it using its namespace and it name. Here is an example for that:

var game = new ns.Game(1, 'Kinectimals', 
   'Raise your own cub inside this popular Kinect game');

Summary

Namespaces in JavaScript can help to organize your code into more logical groups/modules. One aspect of using this method is the reducing of objects inside the JavaScript global scope.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Gil Fink
Architect Sela Group
Israel Israel
Gil Fink is an expert in web development and Microsoft web and data platforms. He works as a senior consultant and architect at Sela Group. He is currently consulting for various enterprises and companies, where he helps to develop Web and RIA-based solutions. He conducts lectures and workshops for individuals and enterprises who want to specialize in infrastructure and web development. He is also a co-author of several Microsoft Official Courses and training kits and the founder of Front-End.IL meetup. You can read his publications at his website: http://www.gilfink.net
Follow on   Twitter   Google+

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Mobile
Web01 | 2.8.140721.1 | Last Updated 27 Jan 2012
Article Copyright 2012 by Gil Fink
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid