Comment modulariser la programmation en Javascript

La programmation modulaire peut rendre la logique métier plus claire. Contrairement à d’autres langages de programmation traditionnels, Javascript ne fournit pas de manière native et organisée d’introduire des modules. Ici, nous discutons principalement de : Programmation modulaire Javascript basée sur les objets. C'est-à-dire la modularisation javascript (package.class.method).

Méthode d'écriture traditionnelle :

Mélanger différentes fonctions ensemble dans un fichier Javascript, comme par exemple :

function m1(arg1, arg2){
	//…
}
function m2(){
	//…
}

De cette façon" Cela pollue les variables globales , et rien ne garantit qu'il n'y aura pas de conflits. Le plus important est que la relation entre les modules et les membres n'est pas évidente.

Comment écrire des objets :

Écrivez différents modules dans différents objets et placez tous les membres du module dans l'objet.

var module1 = new Object({
	_appId : 0,
	URL:{
		process1:function(){
			return ‘/data/process1’;
		}，
		process2:function(){
			return ‘/data/process2’;
		}
},
	m1: function(){
		//…
},
m2:function(params){
	var appId = params[‘appId’];
	var package = params[‘package’];
	//…
},
m3:{
	init:function(){
		//initial something
	},
	process:function(appId, package){
		//
	}
}
});

Analyse :

L'écriture suivante :

var module1 = new Object({
	//…
})

peut être abrégée en :

var module1 = {
	//…
}

Paramètres liés aux constantes :

_appId : 0,

peut définir certaines valeurs constantes. Cette constante peut également être utilisée pour transmettre la valeur de l'expression el dans le fichier jsp. , ajoutez

<script type=”text/javascript”>
	module1._appId = ${appId}; //这样可以将服务端的appId的值设置到js中
</script>

Remarque :

L'expression EL ${appId} ne peut être utilisée que dans les fichiers jsp, ne peut pas être utilisée dans js utilisé dans le fichier.

Une autre façon de définir un groupe constant est :

URL:{
		process1:function(){
			return ‘/data/process1’;
		}，
		process2:function(){
			return ‘/data/process2’;
		}
},

Il existe deux façons de transmettre des variables dans une fonction :

1) Le plus simple est :

process:function(appId, package)

Ici, appId et package sont les valeurs monocouche transmises.

2) Transfert de tableau :

m2:function(params){
	var appId = params[‘appId’];
	var package = params[‘package’];
	//…
},

Le format lors de l'appel est le suivant :

module1.m2({appId:10, package:’hello’})

Objet multicouche encapsulation :

m3:{
	init:function(){
		//initial something
	},
	process:function(appId, package){
		//
	}
}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!