Share a JavaScript library's namespace or use your own?

Question

It is fairly well known in JavaScript that declaring variables within the global scope is a bad thing. So code I tend to work on contains namespaced JavaScript.

There seems to be two different approaches taken to this -

1. Adding your application specific functions to the libraries' namespace e.g. $.myCarouselfunction
2. Creating your own namespace e.g. MyApplication.myCarouselFunction

I wanted to know whether or not there is a better solution or if they tend to meet somewhere close in terms of pros and cons.

The reason for me personally deciding not to go with the library so far is for Seperation / Isolation / Lack of conflict with library code and potential plugins that are likely to share that namespace. Is there more to this that I'm not considering?

Answer 1

I think the most important thing in choosing this sort of thing is semantics.

Does your function/class extend or depend on a library-specific feature? Put it in the library namespace.

Is your function/class library-independent? In this case, it is better to put it in a custom namespace. This makes it possible to reuse your code outside the the library you originally used it with.

Answer 2

Personally I like this sort of approach:

(function(namespace) {

function myPrivateFunction(){};

namespace.myPublicFunction = function(){};

})($); // passing the $ namespace, but if it clutters, 
       // we can change it to something else