Discussion :

[thais781]

Bonjour,

Je suis nouvelle dans l'environnement JS.
Petite question toute simple pour des spécialistes .....

J'ai un fichier main.js et je souhaite utiliser une fonction présente dans un autre fichier : global.js
Par exemple :
main.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
MyName = "Frédérique"
// include global.js??????
MyNewName = CleanAccents(MyName)

global.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
function CleanAccents(MyText) 
{
    return MyText.replace(/[àáâãäå]/g,'a').replace(/æ/g,'ae').replace(/ç/g,'c').replace(/[èéêë]/g,'e').replace(/[ìíîï]/g,'i').replace(/ñ/g,'n').replace(/[ÉÈËÊ]/g,'E').replace(/[ÁÀÄÂÅ]/g,'A').replace(/[ÓÒÖÔ]/g,'O').replace(/[ÍÌÏÎ]/g,'I').replace(/[ÚÙÜÛ]/g,'U').replace(/[òóôõö]/g,'o').replace(/œ/g,'oe').replace(/[ùúûü]/g,'u').replace(/[ýÿ]/g,'y')
}

Comment dois-je faire ?

Thais

[Bovino]

La notion de fichier n'existe pas en JavaScript.
Une fois qu'un fichier .js a été inséré, le code est intégré au document en cours et ses fonctions accessibles depuis n'importe quel autre portion de code.

Ensuite, il faut faire attention à l'ordre d'inclusion : seul le code des fichiers déjà appelés est utilisable, sinon, c'est comme si tu demandais à ton fils de faire ses devoirs alors que t'as pas encore d'enfant. Il faut procéder dans l'ordre !
En gros

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<script src="fichier1.js"></script>
<!-- Toutes les fonctions de fichier1 sont disponibles -->
<!-- Aucune fonction de fichier2 n'est disponible -->
<script src="fichier2.js"></script>
<!-- Toutes les fonctions de fichier1 sont disponibles -->
<!-- Toutes les fonctions de fichier1 sont disponibles -->

[thais781]

Bonjour,

Merci pour ton aide.
Mon soucis est que je souhaite faire cette inclusion dans mon fichier main.js et non dans un fichier html .....

Un truc du style (si je reprend mon exemple) mais avec la bonne syntaxe ... :
Main.js :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<script src="global.js"></script>  ............
 
MyName = "Frédérique"
MyNewName = CleanAccents(MyName)

Thais

[SpaceFrog]

"l'inclusion" (la liaison vers le code js) se fait au niveau de la page dans le DOM, pas au niveau du fichier js ...

Il te faudra donc générer une balise script au moyen de js pour en faire un append dans la page html ...

[Bovino]

Mon soucis est que je souhaite faire cette inclusion dans mon fichier main.js et non dans un fichier html .....

Sauf que c'est pas la bonne façon de faire... Un fichier JavaScript s'intègre dans un document HTML, pas dans un autre fichier JavaScript. Au pire, tu peux demander à un script d'inclure un autre script dans le document, mais encore faut-il qu'il y ai un intérêt à cela.
Bref, dans ton cas, tu as juste à appeler tes deux fichiers dans le bon ordre (global.js puis main.js), il n'y a rien de vraiment sorcier là-dedans.

[Bovino]

Il te faudra donc générer une balise script au moyen de js pour en faire un append dans la page html ...

Certes Spaffy, mais cette méthode pose potentiellement un problème : contrairement aux scripts inclus via le code HTML, un script inclus par script sera chargé de façon asynchrone, donc il y a de fortes chances que lors de l'appel de la fonction désirée, le script ne soit pas totalement chargé et donc que la fonction demandée ne soit pas encore disponible. Tout ça pour éviter une balise en plus dans la page, ça ne me semble pas particulièrement justifié.

[SpaceFrog]

getScrpit de Jquery ...

[thais781]

Le soucis est que mon code JS n'est pas utilisé dans un fichier html mais lancé via un truc qui appelé "iMacro" donc a aucun moment je ne me retrouve dans la possibilité de faire un <Script> ...

Je lance tout simplement mon main.js qui va exécuter ce qu'il y a dedans.
Et comme je ne veux pas faire la bourine en mettant tout dans le même fichier, j'essaye de l'organiser un peu ...; d'ou le besoin de faire des "include"

Thais

[SylvainPV]

Sauf que c'est pas la bonne façon de faire... Un fichier JavaScript s'intègre dans un document HTML, pas dans un autre fichier JavaScript.

Pas la bonne façon de faire ? D'aucuns diront que la bonne façon de faire c'est d'utiliser un script loader comme require ou browserify

Avec iMacro ça va être difficile de faire un truc propre, c'est pas vraiment pensé pour. A la rigueur tu peux envisager une étape de build qui concatène tes fichiers JS en un seul, mais la majorité des scripts que j'ai vu étaient en mode crado

[Bovino]

c'est d'utiliser un script loader comme require ou browserify

Qui se chargent d'intégrer les scripts dans le document HTML...
Et ne pas oublier la suite de ma réponse

Au pire, tu peux demander à un script d'inclure un autre script dans le document, mais encore faut-il qu'il y ai un intérêt à cela.

Crois-tu réellement qu'il y ai un intérêt à utiliser require si c'est uniquement pour éviter d'avoir dans le même fichier une fonction et le code qui utilise cette fonction ?

[thais781]

C'est exactement ce que je fais pour le moment, un bon vieux CAT des 2 fichiers ....

Mais je trouve ca un peu crade et pas très flexible / modulaire d'ou mon interrogation .... on peut le faire dans bcp de langage mais je ne trouve pas comment dans JS.

Une autre piste serait d'appeler la fonction avec un truc comme en html : http://www.monsite.fr/monfichier.html?mafonction .....
Mais pareil, pas de pistes

Thais

[SylvainPV]

@Bovino: si le script est chargé et interprété à la volée, il ne laisse aucune trace dans le document HTML. RequireJS se targue d'ailleurs de ne plus avoir qu'une seule balise script dans le document, celle qui le charge.

Crois-tu réellement qu'il y ai un intérêt à utiliser require si c'est uniquement pour éviter d'avoir dans le même fichier une fonction et le code qui utilise cette fonction ?

Bien sûr, c'est justement le principe des modules. Pour le cas de thais, il n'y a pas forcément besoin d'une solution aussi complexe que Require avec la gestion d'arbre de dépendances, de chargement parallèle etc... Mais c'est le "pas la bonne façon de faire" qui m'a fait tiquer. Autrement dit "c'est possible mais pas recommandé", or soit ton point est qu'une instruction include n'existe pas (encore) en JavaScript, auquel cas c'est pas possible, soit tu déconseille l'utilisation de script loaders, auquel cas je te répondrais que tout dépend du contexte et qu'on les a quand même inventé pour de bonnes raisons d'ailleurs le point que tu soulèves à SpaceFrog est justement résolu par la plupart des script loaders, même des très simples comme YepNope ou LABJS

[thais781]

Bon Sylvain, tu sembles avoir une bonne idée de la soluce .....

Tu peux m'en dire un peu plus sur comment ça s’implémente ? que je puisse tester tout cela avec mon iMacro ?

Merci encore pour ton aide

PS : J'ai regardé un peu du coté de browserify, ca m' l'air super compliqué pour faire un simple appel de fonction / include non ?

Thais

[SylvainPV]

J'ai testé un certain nombre de loaders (headJs, LABJS, Yepnope, requireJS, browserify) et ma préférence personnelle va à browserify, toutefois si tu le trouves super compliqué ne regarde pas RequireJS sous peine de t'arracher la tête. Comme dit plus haut je ne pense pas que tu ais des besoins si avancés. Des loaders il en existe des tonnes, d'ailleurs tu peux écrire ta propre fonction sans trop de difficultés. En voici une liste de "minimalistes" : http://microjs.com/#loader ; tu en trouveras sûrement un qui fait ton bonheur. Ou tu peux écrire ta propre fonction include, SpaceFrog t'a donné le principe de base.

[ascito]

bien , pour ma part (headJs, LABJS, Yepnope, requireJS, browserify), je pense que yepnop dont voila la lien : http://yepnopejs.com/ est tout à fait adapté au loader parallèles, et évites justement certaines erreurs au niveau du cache navigateur. Sur la panoplie de technos proposées il me semble crédible de valider le system..