¿Para qué se usa 'definir' en JavaScript (aparte de lo obvio)?

161

He buscado por todas partes documentación sobre esto, pero no puedo encontrar nada en ningún lado.

Estoy usando Aloha y quiero usar su prototipo de barra lateral para crear una nueva barra lateral adjunta a otra funcionalidad de complemento.

Su sidebar.js comienza con esto, pero por mi vida no puedo encontrar ninguna documentación que explique lo que significa.

define( [
    'aloha/core',
    'aloha/jquery',
    'aloha/selection'
], function (Aloha, jQuery, Selection, Plugin) {

Luego continúa en ese contenedor para definir un montón de funciones, así varsy algunas proptotypes, que casi puedo entender ...

¿Qué dice eso o dónde puedo encontrar una explicación?

David O'Sullivan
fuente

Respuestas:

173

No puedo decir con certeza sin ver el script completo, pero es probable que sea la definefunción de RequireJS , en particular la forma " definir con dependencias " de esa función. Se utiliza para definir un "módulo":

Un módulo es diferente de un archivo de script tradicional porque define un objeto bien definido que evita contaminar el espacio de nombres global. Puede enumerar explícitamente sus dependencias y controlar esas dependencias sin necesidad de hacer referencia a objetos globales, sino que recibe las dependencias como argumentos de la función que define el módulo.

Y la forma de "definir con dependencias" definese describe a continuación:

Si el módulo tiene dependencias, el primer argumento debería ser una matriz de nombres de dependencias, y el segundo argumento debería ser una función de definición. Se llamará a la función para definir el módulo una vez que se hayan cargado todas las dependencias. La función debe devolver un objeto que define el módulo.

James Allardice
fuente
1
sí, eso es definitivamente así que es parte de require.js y para usar ese marcado necesitas requirejs.org
David O'Sullivan
44
y qué versiones de IE no admiten esto ... ;-)
Simon_Weaver
1
@Simon_Weaver - No estoy seguro de lo que quieres decir ... RequireJS es compatible con IE6 + .
James Allardice
eso es bueno saber :) Estaba siendo algo gracioso, pero también pensé que era una construcción más nueva que IE6
Simon_Weaver
1
@Simon_Weaver No es una construcción de lenguaje Javascript, es una función ordinaria de Javascript. Los corchetes crean una matriz. ¿O es esa la construcción a la que te referías?
Robin Green
3

Este es el patrón de AMD para escribir módulos que AMD significa Definición de módulo asíncrono para cuando necesita importar módulos asíncronos básicamente en lugar de algo como commonJS.

define(['module1', 'module2'], function(module1, module2) {
  console.log(module1.sayHi());
});

Definir toma una serie de dependencias y una vez que todas se cargan en segundo plano (asíncrono) de forma no bloqueante, define las llamadas de devolución de llamada que a su vez acepta argumentos (en este caso, las dependencias).

Otra cosa a tener en cuenta es que cada uno de esos módulos también debe definirse utilizando la palabra clave "define". Entonces, por ejemplo, el módulo1 se definiría de la siguiente manera:

define([], function() {

  return {
    sayHi: function() {
      console.log('Hi Hi');
    },
  };
});

Esta forma de escribir módulos (AMD) le permite escribir teniendo en cuenta la compatibilidad del navegador (no require () como en nodeJS) y también puede definir muchos formatos, incluidos objetos, JSON, etc., mientras que commonJS necesita que los módulos sean objetos.

Tenga en cuenta que AMD tiene sus propias desventajas. Espero que esto ayude a alguien.

TheeBen
fuente