Utilisation d'une variable dans une fonction jQuery

J'ai déclaré ma variable centerCard directement dans le document readay de jQuery, et j'essaie de l'utiliser dans une fonction dans le code suivant :

$(function() {

    var centralCard = 1;

    
    var nb1 = $('#nb1');
    var nb2 = $('#nb2');
    var nb3 = $('#nb3');

    var right = $('#rightSelect');
    var left = $('#leftSelect');


        right.click(function(){
            centralCard +=1;
            
        });
    
        left.click(function(){
            centralCard -=1;
        });

Je n'ai pas mis le code en entier mais seulement la partie qui concerne ma variable. Et le fait est que les fonctions de left.click() et right.click() semblent ne pas utiliser la variable centerCard que j'ai définie moi même, mais en créer une autre. Je voudrais savoir s'il était possible et comment faire pour que ces fonctions utilisent la variable que j'ai créé (pour la réutiliser dans d'autres fonctions)
Merci d'avance

\ô/

Evan-code a écrit :
Et le fait est que les fonctions de left.click() et right.click() semblent ne pas utiliser la variable centerCard que j'ai définie moi même,

ta variable est bien utilisée mais uniquement dans le scope défini ci-dessous :

$(function() {
    var centralCard = 1;
})

pour t'en convaincre il te suffit de mettre, dans les fonctions aux clics, des

right.click(function(){
    centralCard +=1;
    console.log(centralCard)
});

Evan-code a écrit :
Je voudrais savoir s'il était possible et comment faire pour que ces fonctions utilisent la variable que j'ai créé (pour la réutiliser dans d'autres fonctions)

Si par contre tu souhaites utiliser cette variable hors du scope il te faut soit la passer en variable globale

let centralCard = 1;   // variable déclarée globale
$(function() {
})

soit la passer en paramètre aux fonctions concernées appelées.

Salut,

Dave-Hiock a écrit :

Si par contre tu souhaites utiliser cette variable hors du scope il te faut soit la passer en variable globale

Mettre une variable en global n'est jamais une bonne chose. Il suffit de jouer sur la portée d'une variable dans le scope définit. Si on doit mettre une variable dans le scope global (ce qui est rare), Il vaut mieux utiliser un namespace (window.monCarousel.centralCard. Pourquoi ? collision de variable, c'est chiant à déboguer !

html

<p>
  <button type="button" id="leftSelect">left</button>
  <button type="button" id="rightSelect">right</button>
</p>
<p class="result"></p>

<p>
  <button type="button" id="gaucheSelect">gauche</button>
  <button type="button" id="droiteSelect">droite</button>
</p>
<p class="result"></p>

js (fait quelque chose de très simple. On peut largement améliorer. Exemple, créer une fonction initialize qui lance dynamiquement toutes les fonctions annexes)

$(function() {
  var mesCarousels = function(){
    var centralCard = 1
    var uneFonction = function(){
      var result = $('.result')

      var right = $('#rightSelect')
      var left = $('#leftSelect')
      right.click(function(){
        centralCard++
        result.text(centralCard)
      });

      left.click(function(){
        centralCard--
        result.text(centralCard)
      });

      result.text(centralCard)
    }
    var uneAutreFonction = function(){
      var result = $('.result')

      var right = $('#droiteSelect')
      var left = $('#gaucheSelect')
      right.click(function(){
        centralCard++
        result.text(centralCard)
      });

      left.click(function(){
        centralCard--
        result.text(centralCard)
      });

      result.text(centralCard)
    }
    uneFonction()
    uneAutreFonction()
  }
  
  mesCarousels()
})

Modifié par niuxe (10 Jun 2024 - 19:33)

niuxe a écrit :
Salut,



Mettre une variable en global n'est jamais une bonne chose. Il suffit de jouer sur la portée d'une variable dans le scope définit. Si on doit mettre une variable dans le scope global (ce qui est rare), Il vaut mieux utiliser un namespace (window.monCarousel.centralCard. Pourquoi ? collision de variable, c'est chiant à déboguer !

Salut

Après le fait d'avoir une nomenclature correct pour les globales ça passe nan ?

var GLOBALE_CENTRAL_CARD = 1;

et après joué dessus.
ça me choque pas tant que ça, surtout si on découpe bien les fichiers.

Bonsoir,

Alors les variables globales OK, mais pour autre chose que des constantes ça me chagrine un peu. D'ailleurs je n'arrive pas à voir dans quel cas de figure une variable globale itérative pourrait être utile.

Sous Node.js j'utilise les fichiers .env désormais natifs sous cet environnement. Sinon, en JS pur, je crée des objets que j'utilise comme espace de nom - comme le préconise Niuxe -, avec des paires de clefs/valeurs et, comme il s'agit forcément pour moi de constantes, je gèle le tout avec Object.freeze().
Modifié par Olivier C (11 Jun 2024 - 20:31)