2009-02-09 13 views

Respuesta

4

jQuery tiene una serie de complementos que amplían la funcionalidad básica. Hay this plugin para espacios de nombres fáciles.

38

lpfavreau ofrece la solución amplíe el objeto jQuery con sus propios métodos (para que su funcionalidad se aplique al contexto real del objeto jQuery).

Si lo que busca es simplemente namespace su código se puede utilizar el símbolo del dólar como esto:

$.myNamespace = { .. }; 

o el "jQuery":

jQuery.myNamespace = { .. }; 

tener cuidado con el espacio de nombres a elegir ya que esto puede sobreescribir los métodos jQuery existentes (sugiero que primero busque en el código jQuery para que no lo haga).

Usted puede seguir este enlace: http://www.zachleat.com/web/2007/08/28/namespacing-outside-of-the-yahoo-namespace/

ver lo fácil que es crear su propia función para replicar lo YUI hace:

// 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(); 
2

Dependiendo de lo que estamos tratando de hacer, el plugin de jQuery la arquitectura puede ser lo que está buscando:

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

o ...

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

realmente depende de lo que estás tratando de hacer.

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

4

El espacio de nombres plugin es completamente innecesario! El truco más antiguo del mundo, el uso de arguments.callee, Function.prototype y luego llamar a una nueva instancia de Function, le permite crear espacios de nombres anidados con $ .fn.extend!

Aquí es un ejemplo claro y simple:

;(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()); 
}); 
+7

'' arguments.callee' y arguments.caller' están en desuso y causará errores en "modo estricto" a partir de ECMAScript 5. [MDN] (https://developer.mozilla.org/en/JavaScript/Reference/Functions_and_function_scope/arguments/callee) – ObjectiveCat

+13

Disputo la afirmación de que este es el más antiguo truco en el mundo. – mxcl

+0

@MaxHowell Definitivamente no es más viejo que sacar un conejo de un sombrero. – Yatrix

2

la salida este blog: http://javascriptweblog.wordpress.com/2010/12/07/namespacing-in-javascript/

la namespacing dinámica propia invocación es lo que he usado antes:

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 
+0

Esto no responde la pregunta de la operación. – Madbreaks

4

Si desea utilizar jQuery de esta manera:

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

entonces actualmente no hay complementos haciendo eso. (No puedo encontrar el plugin jquery.space de John Resig que aparentemente dejó de funcionar en jQuery 1.4, ni el plugin de Gilberto Saraiva que aparentemente no funcionó como se esperaba).Me encantaría echar un vistazo a la función de John para ver por qué dejó de funcionar, y qué se puede hacer para que funcione y, francamente, sería el mejor enfoque para crear espacios de nombres despejados.

Según http://malnotna.wordpress.com/2009/01/12/jquery-namespace-support/ otro enfoque es hacer los espacios de nombre como (usando jQuery.Modularize por Ariel Flesler):

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

pero tal sintaxis no es "bastante". También pasamos resultados de una función a otra.

Mi acercamiento a la creación de espacios de nombres no está poniendo espacios de nombres al final, pero al comienzo de $, por lo que nuestros $ ('*') se convierte en la sintaxis del espacio de nombres:.

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

Extrañamente, no lo creo saber por qué no se menciona este enfoque, ya que le permite crear fácilmente espacios de nombres no bloqueados sin sobreescribir funciones ya existentes (usando $ .sub()). Además, hacerlo funcionar no requiere nada. Entonces:

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

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

Y listo.

+1

Lamentablemente, $ .sub se ha eliminado de jQuery en versiones superiores a 1.9:/ –

1

Todo el crédito a @Diego Fluery, acabo de tomar su conjunto de diapositivas e hice un prototipo de código ejecutable, pero podría ahorrar unos pocos minutos si va esta ruta:

<!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> 
10

Esto es cómo creo espacios de nombres para mis plugins:

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

y luego:

$.MyNamespace.MyPlugin(); 
+0

Eso es todo lo que realmente necesita. Esto puede ser un poco pesado/manual a veces ... Y es probable que desee automatizar algo de eso si necesita que sus definiciones ocurran sobre múltiples archivos. – 1nfiniti

+0

Dentro del contexto de jQuery hay formas correctas e incorrectas de hacer esto. Este es un ejemplo de la manera incorrecta. Por favor, consulte 'jQuery.extend' y' jQuery.fn.extend'. – Madbreaks

Cuestiones relacionadas