Можно ли создать пространство имен в jQuery?

Question

В YUI есть хороший способ создания пространства имен для ваших методов и т. Д. В javascript.

Есть ли у jQuery что-то похожее?

Answer 1

lpfavreau предлагает решение расширение объекта jQuery с помощью ваших собственных методов (чтобы их функциональность применялась к реальному контексту объекта jQuery).

Если вы ищете просто пространство имен для своего кода, вы можете использовать символ доллара следующим образом:

$.myNamespace = { .. };

или "jQuery":

jQuery.myNamespace = { .. };

Будьте осторожны с выбранным пространством имен, так как это может перезаписать существующие методы jQuery (я бы посоветовал сначала выполнить поиск в коде jQuery, чтобы вы этого не делали).

Вы можете перейти по этой ссылке: http://www.zachleat.com/web/2007/08/28/namespacing-outside-of-the-yahoo-namespace/

Посмотрите, как легко создать свою собственную функцию для копирования того, что делает YUI:

// include jQuery first.
jQuery.namespace = function() {
    var a=arguments, o=null, i, j, d;
    for (i=0; i<a.length; i=i+1) {
        d=a[i].split(".");
        o=window;
        for (j=0; j<d.length; j=j+1) {
            o[d[j]]=o[d[j]] || {};
            o=o[d[j]];
        }
    }
    return o;
};

// definition
jQuery.namespace( 'jQuery.debug' );
jQuery.debug.test1 = function()
{
    alert( 'test1 function' );
};
jQuery.debug.test2 = function()
{
    alert( 'test2 function' );
};
// usage
jQuery.debug.test1();
jQuery.debug.test2();

Answer 2

Вот как я создаю пространства имен для моих плагинов:

(function ($) {
    // do not overwrite the namespace, if it already exists
    $.MyNamespace = $.MyNamespace || {};
    $.MyNamespace.MyPlugin = function () {/*here's the logic*/}
})($);

А потом:

$.MyNamespace.MyPlugin ();

Answer 3

jQuery имеет множество плагинов, которые расширяют базовую функциональность. Существует этот плагин для простых пространств имен.

Answer 4

Если вы хотите использовать jQuery таким образом:

$("*").namespace.do();

тогда в настоящее время нет плагинов, делающих это. (Я не могу найти ни плагин Джона Ресига jquery.space, который, по-видимому, перестал работать в jQuery 1.4, ни плагин Gilberto Saraiva, который, очевидно, не работал должным образом). Я бы с удовольствием посмотрел на функцию Джона, чтобы понять, почему она перестала работать, и что можно сделать, чтобы заставить ее работать, и, честно говоря, это был бы лучший подход для создания беспорядочных пространств имен.

Согласно http://malnotna.wordpress.com/2009/01/12/jquery-namespace-support/ другой подход состоит в том, чтобы сделать пространство имен следующим образом (используя jQuery.Modularize Ariel Flesler):

$("*").namespace().do()

но такой синтаксис не "хорош". Мы также передаем результаты от одной функции к другой.

Мой подход к созданию пространств имен заключается не в том, чтобы помещать пространства имен в конец, а в начало $, поэтому наш синтаксис пространства имен $ ('*'). Is становится следующим:

$.namespace("*").do()

Странно, я не знаю, почему такой подход не упоминается, так как он легко позволяет создавать незакрашенные пространства имен без перезаписи уже существующих функций (с помощью $ .sub ()). Кроме того, чтобы это работало, ничего не требуется. Итак:

(function($){
    $.namespace = $.sub();
    $.fn.test = function(){ return 1 };              
    $.namespace.fn.test = function() { return 2};
})(jQuery);

console.log($('*').test(), $.namespace('*').test());

И ты готов к работе.

Answer 5

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *1004*. Самый старый трюк в мире, использование arguments.callee, Function.prototype и последующий вызов нового экземпляра Function, позволяет создавать вложенные пространства имен с помощью $ .fn.extend!

Вот простой и простой пример:

    ;(function($){
    var options= {
        root: function(){ //you don't have to call it 'root', of course :)
            //identify the function from within itself with arguments.callee
            var fn= arguments.callee;

            //'this' at this level is the jquery object list matching your given selector
            //we equate fn.prototype to this 
            //thus when we call a new instance of root, we are returned 'this'
            fn.prototype= this;

            fn.value= function(){
                //Note: "new this" will work in the below line of code as well,
                //because in the current context, 'this' is fn;
                //I use fn to make the code more intuitive to understand;
                var context= new fn; 

                console.log(context, fn.prototype); //test
                return context.html(); //test
            }

            return this;
        }
    }

    //you can obviously append additional nested properties in this manner as well
    options.root.position= function(){
        var context= new this; //in this context, fn is undefined, so we leverage 'this'

        console.log(context, this.prototype); //test
        return context.offset(); //test
    }

    //don't forget to extend in the end :)
    $.fn.extend(options);

})(jQuery);

;$(function(){
    var div= $('div#div')
        .root();

    console.log(div.root.value());
    console.log(div.root.position());
});

Answer 6

проверить этот блог: http://javascriptweblog.wordpress.com/2010/12/07/namespacing-in-javascript/

Я сам использовал вызывающее динамическое пространство имен:

var myApp = {};
(function(context) {
    var id = 0;

    context.next = function() {
        return id++;
    };

    context.reset = function() {
        id = 0;
    } 
})(myApp); 

window.console && console.log(
    myApp.next(),
    myApp.next(),
    myApp.reset(),
    myApp.next()
); //0, 1, undefined, 0

Answer 7

В зависимости от того, что вы пытаетесь сделать, архитектура плагина jQuery может быть тем, что вы ищете:

$.fn.myPlugin = function() {
  return $(this).each(function() {
    // do stuff
  });
};

или ...

$.fn.myPlugin = function() {
  var myNamespace = {
    // your stuff
  };
};

на самом деле это зависит от того, что вы пытаетесь сделать.

http://docs.jquery.com/Plugins/Authoring

Answer 8

Вся заслуга @Diego Fluery, я просто взял его слайд-колоду и сделал прототип работоспособного кода, но это может сэкономить вам несколько минут, если вы пойдете по этому пути:

<!DOCTYPE html>
<html>
<head>
<script type="application/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="application/javascript">

    $(document).ready(function() {
        (function () {
            $.fn.AppRedirect = function() {
                this.sendRequest = parts.sendRequest;
                this.doRedirect = parts.doRedirect;

                return this;
            }

            var parts = {

                doRedirect: function() {
                    console.log('doRedirect');
                },

                sendRequest: function() {
                    console.log('sendRequest');
                }

            };
        })();

        $("body").AppRedirect().sendRequest();
        $("body").AppRedirect().doRedirect();
    });     

</script>
</head>
<body>
</body>
</html>