Créer un array de command queues

Bonjour, je suis tombe sur un concept que je trouve genial, mais que j'ai du mal a implementer (code simple/concis)
un service va commencer par initialiser un tableau qui stockera les commandes a executer quand le script principal sera telecharge
par exemple monService = monService || {cmd:[] } ainsi, on peux ajouter ce qu'on veut : monService.cmd.push(() => { console.log('ok'); });.
et quand monService sera telecharge, il executera tout ce qu'il y aura dans monService.cmd.

jusque la ca va, mais meme apres telechargement du service, on pourra toujours faire monService.cmd.push(() => console.log('re'); }); et celui-ci sera quand meme execute

comment implementeriez-vous ca : un setInterval degeux qui verifie le contenu de monService.cmd ?
un observer sur l'array ?
autre ?

les solutions que je trouve sur internet me semblent completement dysproportionnes par rapport au probleme

Citation:

---

Envoyé par Doksuri

quand le script principal sera telecharge

---

vous parlez du moment où le script est téléchargé par le navigateur ?

Citation:

---

Envoyé par Doksuri

on pourra toujours faire

---

qui est ce "on" ?

Citation:

---

Envoyé par mathieu

vous parlez du moment où le script est téléchargé par le navigateur ?

---

=> oui

en gros, dans l'ordre chronologique, ca ferait ca :

Code:

---

1 2 3 4 5 6

monService.cmd.push(() => { console.log('1'); }); monService.cmd.push(() => { console.log('2'); }); <script src="monService.js"></script> /* monService.js execute tout ce qu'il y a dans monService.cmd (1 & 2) */ monService.cmd.push(() => { console.log('3'); }); /* monservice.js execute la nouvelle commande (3)*/

---

et qu'est ce que vous souhaitez obtenir comme résultat ?

bah, ce que j'ai explique dans mon dernier message : la chronologie :koi:

pouvoir ajouter des commande avant & apres qu'un script soit telecharger, mais sans passer par un timeout degeu, ni par une solutions spagetti

voici ce que j'essaye de faire (j'ai volontairement mis un long timeout que vous puissiez comrendre comment ca fonctionne)

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

monService = monService || {cmd:[]}; monService.cmd.push(() => { console.log('before 1'); }); monService.cmd.push(() => { console.log('before 2'); }); /* simulation fin telechargement monService.js */ var monService = { cmd:monService.cmd || [], checkQueue:function() { for(let i=0; i<this.cmd.length; ++i) { this.cmd[0](); this.cmd.shift(); } }, init:function() { monServiceLoop = setInterval(() => { this.checkQueue(); }, 1E3); } }; monService.init(); /* fin monService.js */   /* continuite de mon code */ monService.cmd.push(() => { console.log('after 1'); }); monService.cmd.push(() => { console.log('after 2'); });

---

Bonjour,
j'aurais mis une méthode add plutôt qu'un push direct.

Quand est-ce que les « cmd » sont exécutées,

• une fois initialisée ;
• exécutée qu'une que fois toutes sont initialisées ;
• après que celles en cours sont terminées.

Pour moi elles exécuteront bien dans l'ordre !

c'est pas l'ordre qui me pause probleme, mais l'execution apres chargement du script (dans mon exemple, c'est les after qui me posent probleme)

Si on en revient à :

Citation:

---

comment implementeriez-vous ca

---

je ferais à première vu quelque chose comme :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

const Service = { queue: [], isStart: false, add: function (callback) { this.queue.push(callback); if( this.isStart) { this.action(); } return this; }, action: function () { while (this.queue[0]) { this.queue[0](); this.queue.shift(); } }, start: function () { this.isStart = true; this.action(); return this; }, stop: function () { this.isStart = false; return this; }, }

---

avec une utilisation du type :

Code:

---

1 2 3 4 5 6 7 8

Service .add(() => { console.log('service 1'); }) .add(() => { console.log('service 2'); }) .add(() => { console.log('---------'); }); Service.start(); Service .add(() => { console.log('service 3'); }) .add(() => { console.log('service 4'); });

---

Je ne sais pas si c'est ce que tu cherches à faire ou un truc dans ce style !

ton script fonctionne uniquement si le fichier qui contient ton Service a ete charge avant les appels a Service.add()

ce que j'essaye de faire, c'est pouvoir stocker des commandes en attendant que le service soit charge, qu'il les charge (quand le service est charge), puis que les nouvelles commandes (post chargement) soit executees

(mon probleme est si tordu que ca ?)

Citation:

---

Envoyé par Doksuri

pouvoir ajouter des commande avant & apres qu'un script soit telecharger, mais sans passer par un timeout degeu, ni par une solutions spagetti

---

Moi ça me fait penser à Cron, où à la boucle principale des navigateurs et de la plupart des jeux vidéo. On a une « routine » qui consulte le tableau périodiquement (typiquement, 60 fois par seconde) et sa période est fixe, ce qui donne un certain nombre de garanties. Vouloir asservir le déclenchement de cette routine à ce qui se passe dans le tableau, c’est à mon avis se compliquer la vie. Donc je pense que dans le cas présent, un timeout n’est pas dégueu, c’est un cas d’utilisation tout à fait justifié.

Citation:

---

Envoyé par Watilin

Donc je pense que dans le cas présent, un timeout n’est pas dégueu, c’est un cas d’utilisation tout à fait justifié.

---

ok, je vais donc rester sur cette formule (meme si elle ne me plait pas trop)

Citation:

---

ce que j'essaye de faire, c'est pouvoir stocker des commandes en attendant que le service soit charge,

---

c'est quand même pas bien orthodoxe :mrgreen:

Il existe une solution d'« écoute » en passant par un new Proxy qui pourrait dans ce cas te convenir.

Le principe étant d'encapsuler ton tableau monService.cmd dans un Proxy qui va intercepter les actions sur celui-ci et ce une fois ton init réalisé et après traitement des données déjà présentes.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

var monService = { cmd: monService.cmd || [],   init: function() { // on traite les éléments déjà stockés while (this.cmd[0]) { this.cmd[0](); this.cmd.shift(); }; // on encapsule l'array dans un Proxy this.cmd = new Proxy(this.cmd, { set: function(target, prop, val) { if ("function" === typeof val) { val(); target.unshift(); } return true; }, }) } };

---

Le peu que je viens de tester semble fonctionner.

Citation:

---

Envoyé par NoSmoking

Il existe une solution d'« écoute » en passant par un new Proxy qui pourrait dans ce cas te convenir.

Le principe étant d'encapsuler ton tableau monService.cmd dans un Proxy qui va intercepter les actions sur celui-ci et ce une fois ton init réalisé et après traitement des données déjà présentes.

---

genial ! c'etait typiquement un truc comme ca que je cherchais ! :ccool: merci