Discussion :

[Goltar]

Bonjour à tous,

Une bonne âme pourrait-elle m'expliquer ce qu'est un 'CallBack', son utilité et comme l'appliquer au mieux dans une requête db du style:

Code :

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

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
 
function SelectListeDocs()
{
    var sqlSelectDocs = "SELECT * FROM T_TypeDocteurs ORDER BY TypeMed ASC";
    db.transaction(function (tx)
    {
        tx.executeSql(sqlSelectDocs, undefined, function (tx, result)
        {
            if (result.rows.length)
            {
                for (var i = 0; i < result.rows.length; i++)
                {
                    var row = result.rows.item(i);
                    var TypeDoc = row.TypeMed;
                    var htmlType = "";
                    htmlType += "<option value= '" + TypeDoc + "'>" + TypeDoc + "</option>";
                    $(htmlType).appendTo("#Inp_ModType");
                }
            } else
            {
                console.log("Table Type Doc vide");
            }
        }, erreur_bd);
    });
}// ****************************************************************

ou autre ce code ci n'est qu'un exemple, l'important est de bien comprendre ce qu'est un callback et de bien l'utiliser

[le_chomeur]

Une méthode de callBack est une fonction qui sera passée en paramètre ( en général ) pui exécuter une fois que l'exécution de la première sera terminée

Code :

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

1
2
3
4
5
6
7
8
9
10
 
fonction A(params,B) {
traitement
 
if(B) {
B();
}
 
}
fonction B() {alert('tout est terminé');}

un exemple très très succinct

[Goltar]

Merci El_chomeur ;-)
Très succincte mais néanmoins obscure.

Je comprends vite, mais faut m'expliquer longtemps !

(params,B)

qu'est-ce que 'params' le paramètre passé c'est 'B' non?
Et

fonction B()

n'appelle pas la fonction A ???

Ouch ! ma tête ;-)

[sekaijin]

Soit une fonction uneFonction

Code :

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

1
2
3
var uneFonction = function() {
  console.log('je suis la fonction uneFonction');
};

je peux l'utiliser comme je veux et l’appeler quand je veux.

J'ai maintenant une autre fonction traitement.

Code :

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

1
2
3
4
var traitement = function() {
  //calcul long est compliqué
  var a = 41 + 1;
};

je veux qu'a la fin de son calcul ma fonction traitement appelle ma fonction uneFonction.
pour cela je modifie mon code.

Code :

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

1
2
3
4
5
var traitement = function() {
  //calcul long est compliqué
  var a = 41 + 1;
  uneFonction();
};

Code :

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

traitement();

Jusqu'ici rien de compliqué.

Maintenant je définis un troisième fonction.

Code :

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

1
2
3
var troisemeFonction = function() {
  console.log('je suis la fonction troisemeFonction');
};

et je veux appeler traitement deux fois. la première fois lorsque le calcul est fini je veux que soit appeler uneFonction et la deuxième fois je veux que soit appelé troisemeFonction.

je redéfinis donc traitement pour lui passer en paramètre la fonction à appeler.

Code :

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

1
2
3
4
5
var traitement = function(callBack) {
  //calcul long est compliqué
  var a = 41 + 1;
  callBack();
};

Code :

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

1
2
traitement(uneFonction);
traitement(troisemeFonction);

la callBack n'est qu'un paramètre comme un autre qui est une fonction. fonction qui sera utilisé à l’exécution du code.

on l'appel callBack parce qu'en général elle est appelé à la fin du traitement.
mais se pourrait être un tout autre usage.

imagine une fonction comme ceci

Code :

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

1
2
3
4
5
6
7
max(tab, comparator) {
  var max = tab[0];
  for (item in tab) {
    if (comparator(max, tab[item])) max = tab[item];
  }
  return max;
}

Cette fonction recherche le "max" dans un tableau. mais elle utilise une fonction comparator(a, b) pour comparer deux éléments.
si j'utilise une fonction de comparaison qui retourne vrai si a > b alors max me retourne le max.
mais si ma fonction comparator retourne vrai si b > a alors max retournera en réalité le min.
je peux aussi utiliser le compatrateur sinus(a) > cosinus(b) alors max retournera l'élément du tableau dont le sinus est plus grand que tous les cosinus des élément du tableau.

En javascript un fonction est un objet comme un autre. cet objet peut donc être passé en paramètre d'une autre fonction.
on l'appelle callBack lorsque ce paramètre est voué à être utilisé en fin de traitement.

A+JYT

[Goltar]

Merci sekaijin,
Voilà qui éclaire ma chandelle!

Donc dans mon cas, pour une requête asynchrone tel qu'une requête db. Cela permettrais de pusher le résultat dans un tableau et de retourner ce tableau qu'a la fin de l'exécution de la requête.
De récupérer ce tableau dans la fonction appelante afin de pouvoir afficher le résultat. (Ce qui me permettras d'éviter un 'undefined' car requête non terminée).

J'essaie d'appliquer !

Encore merci

[Goltar]

YEP !!!
Ca fonctionne !

Code :

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

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
 
function countRows(cb) {
        db.transaction(function (tx) {
            tx.executeSql('SELECT id FROM T_Photo', [], function (tx, results)
            {
                var len = results.rows.length;
                cb.call(this, len);
            });
        });
    }
    countRows(function (num)
    {
        switch (num)
        {
            case 1:
                {
                    db.transaction(function (tx)
                    {
                        tx.executeSql(SqlAffPhoto1, undefined, function (tx, result)
                        {
                            if (result.rows.length > 0)
                            {
                                for (var i = 0; i < result.rows.length; i++)
                                {
                                    var row = result.rows.item(i);
                                    var photo = row.PhotoBlob;
                                    $('#Mod_PhotoProfil').attr('src', photo);
                                }
                            }
                        }, erreur_bd);
                    });
                }
                break;
            case 2:
                {
                    db.transaction(function (tx)
                    {
                        tx.executeSql(SqlAffPhoto2, undefined, function (tx, result)
                        {
                            if (result.rows.length > 0)
                            {
                                for (var i = 0; i < result.rows.length; i++)
                                {
                                    var row = result.rows.item(i);
                                    var photo = row.PhotoBlob;
                                    $('#Mod_PhotoProfil').attr('src', photo);
                                }
                            }
                        }, erreur_bd);
                    });
                }
                break;
            default:
                {
                    console.log("Photo inexistante");
                }
                break;
        }
    });

MERCI !