Requerjs introdução
O requestJS foi fundado por James Burke, que também é o fundador das especificações da AMD.
Requerjs permitirá que você escreva JavaScript de uma maneira diferente do habitual. Você não usará mais tags de script para introduzir arquivos JS no HTML e não precisará mais gerenciar dependências através de tags de script.
O requestJS é uma estrutura de carregamento do módulo JavaScript muito pequena e é um dos melhores implementadores da especificação da AMD. A versão mais recente do requerjs é apenas 14k após a compactação, o que é muito leve. Ele também pode funcionar em conjunto com outras estruturas, e o uso de requisitos certamente melhorará a qualidade do seu código front-end.
Há alguns pontos que vale a pena notar ao usar requerjs para carregamento de módulo assíncrono:
1. Duas maneiras de escrever a definição do módulo
1. Definições funcionais que existem nas dependências
Se o módulo tiver dependências: o primeiro parâmetro é a matriz de dependências de nome; O segundo parâmetro é uma função. Depois que todas as dependências do módulo são carregadas, a função será chamada para definir o módulo, para que o módulo retorne um objeto que defina o módulo. O relacionamento de dependência é injetado na função como um parâmetro, e a lista de parâmetros corresponde à lista de nome da dependência uma por uma.
define (['a'], function (aj) {var hello = function () {aj.hello ('eu sou c.js');} return {hello: hello}});PS: O tipo de valor de retorno do módulo não é forçado a ser um objeto e o valor de retorno de qualquer função é permitido.
2. Definição de formato do módulo Commonjs
requer: usado para introduzir métodos que dependem de outros módulos.
Exportações: Exporta um objeto que exporta uma variável ou método do módulo.
Módulo: contém informações sobre este módulo.
requer.config ({baseurl: "", config: {'b': {size: 'grande'}}, caminhos: {a: 'base/a', b: 'base/b', c: 'base/c'}}); define (function (requer, exporta, módulo) {var aj = requer ("a"); var hello = function () {aj.hello ('eu sou b.js');} var hello2 = function () {aj.hello ('i am b.js22');} exports.hello = hello; : módulo ", módulo); console.log (" b.js: config ", module.config ()); // não pode ser usado em conjunto, o retorno substituirá as exportações anteriores/*return {hello: hello2}*/});PS: O objeto de retorno e as exportações não podem ser usados juntos, o retorno substituirá as exportações anteriores.
A seguir, são apresentadas as informações impressas após a chamada:
Exportações: Pode -se observar que as exportações são um atributo do módulo.
Módulo: Inclui alias, URI, objeto de exportação e método de informação de configuração do módulo.
Config: geralmente precisamos passar informações de configuração para um módulo. Essas configurações geralmente são informações no nível do aplicativo e exigem um meio de transmiti-las para o módulo.
No requimjs, ele é implementado com base no item de configuração de configuração do requests.config ().
2. Cuidado com as variáveis de singleton
Cuidado com as variáveis em singletons, porque após o requisito o requer uma vez, o subsequente exige o uso do cache anterior. Portanto, quando uma variável é definida no módulo, desde que esse requisito seja alterado, outros requisitos permanecerão consistentes.
define (function () {var index = 0; var hello = function (msg) {console.log (msg);} var addIndex = function () {index ++;} var getIndex = function () {return index;} return {hello: hello: hello, addIndex: addIndex, getIndex: getIndex}});Chamado:
requer (['a',], função (a) {requer (['a'], function (a) {console.log (a.getIndex ()); a.adDindex (); a.adDindex ();}); reque (['a'], function (a) {console.log (a.getIndex ();Os impressos acima são:
0
2
3. Limpe o cache
Como o requestJS tem a função do cache, mas durante o desenvolvimento, não queremos que ele cache, para que possamos definir URLARGs no require.config.
URLARGS: requerjs anexa parâmetros de consulta adicionais após o URL ao obter o recurso.
Exemplo:
URLARGS: "Bust =" + (new Date ()). GetTime ()
Isso é útil no desenvolvimento, mas lembre -se de removê -lo antes de implantar para o ambiente de construção.
4. Módulos de carga de outros pacotes
Requerjs suporta módulos de carregamento da estrutura do pacote Commonjs, mas requer algumas configurações adicionais.
A configuração do pacote pode especificar as seguintes propriedades para um pacote específico:
1. Nome: Nome do pacote (para o nome do módulo/mapeamento de prefixo).
2. Localização: a localização no disco. As posições são relativas aos valores de BaseURL na configuração, a menos que contenham protocolos ou iniciem com "/".
3. Principal: Após a chamada requisição, é iniciado com o "nome do pacote", o módulo em um pacote a ser aplicado.
O padrão é "principal", a menos que seja definido de outra forma aqui.
Este valor é relativo ao diretório de pacotes.
exemplo:
main.js
requer.config ({baseurl: "", pacotes: [{name: "Student", Location: "package-stu"}, {name: "professor", localização: "package-tea"}], urlargs: "bust =" + (new Date ()). gettime ()}); Chá.hello ();Tea.js:
define (função (requer, exporta, módulo) {exports.hello = function () {console.log ('Eu sou um professor.');}});STU.JS:
define (função (requer, exporta, módulo) {exports.name = 'cape';});Store.js:
define (função (requer, exporta, módulo) {var stu = requer ("student/stu"); exports.hello = function () {console.log ('eu sou' + stu.name);}});Sinto que há duas coisas estranhas sobre essa maneira de carregar módulos de outros pacotes (não entendo muito bem):
1. Se os módulos em outros pacotes se referirem ao método de escrita de outros módulos, o usuário afetará o método de escrita do módulo?
2. O Main.js em outros pacotes parece ser inútil e não há problema sem conteúdo.
O conteúdo acima são os detalhes dos requisitos usados pelo editor, e espero que seja útil para todos!