Compter le nombre d’occurrences de chaque mot d'un texte.

Version imprimable

Salut,

Compter le nombre d’occurrences de chaque mot d'un texte...

J'ai fait ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
texte = "Salut tout le monde, c'est un texte pour tester le code... Salut tout le monde, c'est un texte pour tester le code..."
 
div = texte.split(/[^a-zA-Z]/)
console.log(div);
dico = {}
 
for (let mot of div) {    
    if (mot != "") {
        if (dico[mot] != undefined) {
            dico[mot] += 1;
        } else {
            dico[mot] = 1
        }
    }
}
 
console.log(dico);

Peut-on améliorer le code ?

une autre proposition :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
var texte = 'Salut tout le monde, c\'est un texte pour tester le code... Salut tout le monde, c\'est un texte pour tester le code...';
var text=texte.split(' ');
var k=0;
console.clear();
function getMot(mot){
k=0;
for(var j=0;j<text.length;j++){
if(mot==text[j])k++;
}
return k;
}
for (let mot of text) { 
console.log(mot +': est repeté '+ getMot(mot) + ' fois \n');
}

02/11/2019, 04h34
Beginner.

Merci pour cette nouvelle proposition... A analyser...

Bonjour Beginner.,

tes variables ne sont pas déclarées (toujours utiliser "use strict"; !)
ta regex n'inclut pas les caractères accentués.
de plus, il faut mettre le tout le minuscules, sinon "Salut" et "salut" seront 2 mots différents.
on peut aussi mettre le tout dans une fonction, et ne prendre que les mots de plus de 3 lettres (par exemple)
on peut aussi supprimer de la liste ceux qui n'apparaissent qu'une seule fois

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
27
28
29
"use strict";
// -------------
function count_multiples_mots( texte )
{
  var div = texte.toLowerCase().split(/[^a-zA-ZàèìòùÀÈÌÒÙáéíóúýÁÉÍÓÚÝâêîôûÂÊÎÔÛãñõÃÑÕäëïöüÿÄËÏÖÜŸçÇßØøÅåÆæœ]/);
  var obj_dico = {};
  // ---------
  for (let mot of div) {    
    if (mot != "" && mot.length>2 ) // mots de plus de 3 lettres
    {
      if (obj_dico[mot] == undefined) {
        obj_dico[mot] = 1;
      } else {
        obj_dico[mot] += 1;
      }
    }
  }
  // ---------
  // on supprime ceux qui ne sont présents qu'une fois
  for (var mot in obj_dico)
  {
    if( obj_dico[mot]==1 ){
      delete(obj_dico[mot]);
    }
  }
  // ---------
//  console.log( dico );
  return obj_dico;
}

Utilisation :

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
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<div id="mon-texte">
C'est l'évadé du Névada <br />
Qui s'évada dans la vallée <br />
Dans la vallée du Névada <br />
Qu'il dévala pour s'évader <br />
Sur un vilain vélo volé <br />
Qu'il a volé dans une villa <br />
Et le valet qui fut volé <br />
Vit l'évadé qui s'envola <br />
   <br />
  Avec un vélo <br />
'Faut pas s'évader <br />
Parce que c'est crevant <br />
Et puisqu'on peut crever <br />
 <br />
Si l'évadé du Névada <br />
S'est évadé dans la vallée <br />
C'est qu'il pensait au lit d'Éva <br />
Et le voulait pour s'y lover <br />
Sur le divan de la Diva <br />
On vit l'évadé s'affaler <br />
Mais quand Éva le revit là <br />
Elle le vida pour l'éviter <br />
 <br />
Quand on est cocu <br />
'Faut téléphoner <br />
Ou télégraphier <br />
Avant de se pointer <br />
 <br />
C'est l'évadé du Névada <br />
Qui s'énerva dans la vallée <br />
Il se leva devant Éva <br />
Pour lui filer une belle volée <br />
Et c'est Éva qui s'alita <br />
Pendant que l'on vit l'évadé <br />
Qui n'avait plus envie d'Éva <br />
se r'envoler dans la vallée <br />
 <br />
Y'a des énervés <br />
Qui pensent qu'à frapper <br />
Avec ces mecs-là <br />
On peut pas s'expliquer <br />
 <br />
Mais l'évadé du Névada <br />
Fût délavé dans la vallée <br />
Par toute l'eau qui tombait là <br />
Et on vit l'évadé vanné <br />
C'est vrai que la vie d'évadé <br />
Ne valait pas la vie d'avant <br />
Car en vélo quand y'a du vent <br />
On est vidé c'est évident <br />
 <br />
C'est moi qui te l'dis <br />
Si t'as pas d'imper' <br />
C'est vachement facile <br />
De commettr' un impair <br />
 <br />
Et l'évadé du Névada <br />
A pédalé dans la vallée <br />
Dans la taule il dit : "me voila <br />
Je crois que là vous m'en voulez <br />
Car toute l'eau qui m'a lavé <br />
Et toute l'eau qu'j'ai avalée <br />
M'a dégoûté de m'évader <br />
De la vallée du Névada" <br />
 <br />
Quand y tombe de l'eau <br />
Quand y a d'la pluie <br />
Retourne en prison <br />
Pour te mettre à l'abri <br />
</div>
<div id="result"></div>
<div id="classement"></div>

Affichage :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// -------------
var texte = document.querySelector('#mon-texte').textContent;
var obj_dico = count_multiples_mots( texte );
// -------------
// Affichage
var ul = document.createElement('ul');
document.querySelector('#result').append(ul);
for (var mot in obj_dico)
{
//  console.log(mot, obj_dico[mot]);
  var li = document.createElement('li');
  li.textContent = mot+' : '+obj_dico[mot];
  ul.append(li);
}
// -------------

Classement des mots, par nombre d'occurrences croissant (une autre façon d'afficher les résultats) :

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
// -------------
// Classement des mots, par nombre d'occurrences croissant
function count_multiples_mots_array_sort( obj_dico )
{
  var arr_dico = [];
  for (var mot in obj_dico)
  {
    if(arr_dico[obj_dico[mot]] == undefined) {
      arr_dico[obj_dico[mot]] = [];
    }
    arr_dico[obj_dico[mot]].push(mot);
  }
  return arr_dico;
}
// -------------
var arr_dico = count_multiples_mots_array_sort( obj_dico );
//console.log( arr_dico );
var ul = document.createElement('ul');
document.querySelector('#classement').append(ul);
for (var idx in arr_dico)
{
  var li = document.createElement('li');
  li.textContent = idx+' : '+arr_dico[idx].join(', ');
  ul.append(li);
}
// -------------

démo : https://codepen.io/jreaux62/pen/mddpBdE

https://www.youtube.com/watch?v=iLawdJHalEY

02/11/2019, 10h06
NoSmoking

Bonjour,

Citation:

Peut-on améliorer le code ?

cela va dépendre de ce que tu entends par « améliorer » !

En l'état ton code est correct, je fais abstraction de la façon de récupérer les mots qui peut être bien différente suivant ce que tu cherches à obtenir via ta RegExp et du choix du type de la boucle for..of qui est une question de choix personnel plutôt que de performance.

Tu ne fais que nombre-éléments-trouvés itérations, il va t'être difficile de faire moins, et de plus tu gardes une trace via ton objet crée.

La méthode proposée par abdennour bouaicha elle va faire nombre-éléments-trouvés * nombre-éléments-trouvés, et ce sans garder de trace, ce qui est donc à éviter autant que faire ce peut.
02/11/2019, 11h40
danielhagnoul

:salut:

J'ai déjà travaillé sur ce problème dans mon blog : kNombreMots() retourne le nombre de mots et, dans l'ordre alphabétique, le nombre de chaque mot.

Citation:

Envoyé par Beginner.

Peut-on améliorer le code ?

salut,

En relisant ta proposition et les suivantes, peut-être un mix simplifié:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const texte = "Salut tout le monde, c'est un texte pour tester le code... Salut tout le monde, c'est un texte pour tester le code...";
const div = texte.toLowerCase().split(/[^a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßøåæœ]/);
 
for(var i=0, dico={};i<div.length;i++){
	if(div[i].length>0){
		if(!dico[div[i]]){
			dico[div[i]]=1;
		}
		else{
			dico[div[i]]++;
		}
	};
}
console.log(dico)

Je suis parti du regex de jreaux62, après j'ai juste jonglé avec les différentes méthodes que l'on peut appliquer directement sur les objets Array de JS
Il y a aussi une utilisation de l'objet SET de JS....

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
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="UTF-8">
  <title>Compter le nombre d’occurrences de chaque mot d'un texte</title>
  <style>
    body { font-family: Arial, Helvetica, sans-serif; }
    table { border-collapse: collapse; margin: 1em;}
    td { border: 1px solid grey; padding: .2em .5em;}
  </style>
</head>
<body>
  <div id="mon-texte" style="display:none;"> 
      C'est l'évadé du Névada          <br /> Qui s'évada dans la vallée       <br />
      Dans la vallée du Névada         <br /> Qu'il dévala pour s'évader       <br />
      Sur un vilain vélo volé          <br /> Qu'il a volé dans une villa      <br />
      Et le valet qui fut volé         <br /> Vit l'évadé qui s'envola         <br />
                                       <br /> 
      Avec un vélo                     <br /> 'Faut pas s'évader               <br />
      Parce que c'est crevant          <br /> Et puisqu'on peut crever         <br />
                                       <br />
      Si l'évadé du Névada             <br /> S'est évadé dans la vallée       <br />
      C'est qu'il pensait au lit d'Éva <br /> Et le voulait pour s'y lover     <br />
      Sur le divan de la Diva          <br /> On vit l'évadé s'affaler         <br />
      Mais quand Éva le revit là       <br /> Elle le vida pour l'éviter       <br />
                                       <br />
      Quand on est cocu                <br /> 'Faut téléphoner                 <br />
      Ou télégraphier                  <br /> Avant de se pointer              <br />
                                       <br />
      C'est l'évadé du Névada          <br /> Qui s'énerva dans la vallée      <br />
      Il se leva devant Éva            <br /> Pour lui filer une belle volée   <br />
      Et c'est Éva qui s'alita         <br /> Pendant que l'on vit l'évadé     <br />
      Qui n'avait plus envie d'Éva     <br /> se r'envoler dans la vallée      <br />
                                       <br />
      Y'a des énervés                  <br /> Qui pensent qu'à frapper         <br />
      Avec ces mecs-là                 <br /> On peut pas s'expliquer          <br />
                                       <br />
      Mais l'évadé du Névada           <br /> Fût délavé dans la vallée        <br />
      Par toute l'eau qui tombait là   <br /> Et on vit l'évadé vanné          <br />
      C'est vrai que la vie d'évadé    <br /> Ne valait pas la vie d'avant     <br />
      Car en vélo quand y'a du vent    <br /> On est vidé c'est évident        <br />
                                       <br />
      C'est moi qui te l'dis           <br /> Si t'as pas d'imper'             <br />
      C'est vachement facile           <br /> De commettr' un impair           <br />
                                       <br />
      Et l'évadé du Névada             <br /> A pédalé dans la vallée          <br />
      Dans la taule il dit : "me voila <br /> Je crois que là vous m'en voulez <br />
      Car toute l'eau qui m'a lavé     <br /> Et toute l'eau qu'j'ai avalée    <br />
      M'a dégoûté de m'évader          <br /> De la vallée du Névada"          <br />
                                       <br />
      Quand y tombe de l'eau           <br /> Quand y a d'la pluie             <br />
      Retourne en prison               <br /> Pour te mettre à l'abri          <br />
  </div>
  <table id="result"></table>
  <table id="classement"></table>
  <script>
    const leTexte      = document.querySelector('#mon-texte')
        , leResult     = document.querySelector('#result')
        , leClassement = document.querySelector('#classement')
        , decoup= leTexte
                    .textContent
                    .toLowerCase()
                    .match(/[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g)
                    .filter(s=>(s!==undefined && s.length > 3) )
                    .sort((a, b) => a.localeCompare(b))
                    .reduce((a,c,i,t)=>                              // crée un tableau d'objet
                      {
                      if (i===0 || t[i-1]!==c ) a.push ({m:c, n:1})   // ex : { m: 'envoler', n: 1 }
                      else                      a[a.length-1].n++    // ex : { m: 'névada', n: 1+1+1+1 }
                      return a
                      }
                      , [])
 
    let occurences = new Set()
 
    for (let mot of decoup)
      {
      occurences.add(mot.n)
      let nRow  = leResult.insertRow(-1)               // nouveau <tr></tr> en fin de table
        , rCell = 0                                    // indice du premier <td></td>
      nRow.insertCell(rCell++).textContent = mot.m     // crée et rempli le premier  <td> avec le mot.m ( ex: 'envoler')
      nRow.insertCell(rCell++).textContent = mot.n     // crée et rempli le premier  <td> avec le mot.n ( son nombre d'occurence )
      }
 
    [...occurences]
      .sort((a, b)=>a-b)
      .forEach(o=>
        {
        let nRow  = leClassement.insertRow(-1)
          , rCell = 0
        nRow.insertCell(rCell++).textContent = o                    // crée et rempli le premier  <td> la valeur d'occurence
        nRow.insertCell(rCell++).textContent = decoup               // sur cet Array 
                                                .filter(d=>d.n===o) // ne garde que ceux ayant la même valeur que l'occurence courante
                                                .map(e=>e.m)        // crée un tableau avec uniquement les termes  ( [ ..., { m: 'évader',  n:  3 }, ...] devient [ ..., 'évader', ...]  )
                                                .join(', ')         // transfo de cet array en String séparé par des virgules...
        })
  </script>
</body>
</html>

[edit] j'arrive pas a activer la coloration syntaxique... :/
[edit:2] je me suis arrangé pour qu'il fasse moins de 100 lignes + petite optimisation
[edit:3] je travaille sur les explications, patience.... :)
[edit:4] les explications sont ici => https://www.developpez.net/forums/d2.../#post11208639

02/11/2019, 17h04
Invité

@psychadelic

1- Il semble que la coloration syntaxique fonctionne mal au delà de 100 lignes de code.
C'est en cours de correction...
N.B. J'ai scindé ton code en 2 ;)

2- Merci de mettre quelques explications dans ton code.
Ce ne serait pas du luxe...

Juste pour appliquer le minimum syndical à une page:

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
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
60
61
62
63
64
65
66
67
68
69
70
71
72
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
 
<title>...</title>
 
<style type="text/css">
em{
        color:red;
        font-weight:bold;
}
#count{
        margin-right:50px;
        float:left;
        height:200px;
        width:500px;
}       
#diag{
        height:200px;
        width:500px;
        overflow:auto;
}
</style>
 
<script type="text/javascript">
 
window.addEventListener("load",()=> {
 
document.getElementById("tester").addEventListener("click",(e)=>{
        const dico=[];// Oui, on recrée le tableau à chaque fois, c'est aussi simple.
        document.getElementById("diag").innerHTML="";// on vide la zone (salement, j'avoue)
        // on entre dans le tableau chaque paire "mot" + "occurrences" 
        document.getElementById("count").value.toLowerCase().split(/[^a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßøåæo]/).forEach(v => {
                if(!dico[v]){
                        if(v.length>0){
                                dico[v]=1
                        }
                }
                else{
                        dico[v]++;
                };
        });     
                // on affiche les mots répétés
                for(i in dico){
                        if(dico[i]>1){
                                document.getElementById("diag").innerHTML+=`<em>${i}</em> apparaît ${dico[i]} fois.<br />`;
                        }
                }
        }
,false)},
false);
 
</script>
 
</head>
<body>
<div style="margin:50px">Détectez les répétitions dans vos discours!</div>
 
<div>
	<textarea id="count"></textarea>
</div>	
 
<div id="diag"></div>
 
<div  style="margin:20px;clear:both;">
	<button id="tester">Compter les répétitions</button>
</div>
 
</body>
</html>

Citation:

Envoyé par javatwister

Juste pour appliquer le minimum syndical ...
Code:

1 2 3 4 5 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
Code:

<script type="text/javascript">

Euhhhh... Il date de quel époque, ton "minimum syndical" ? :aie:
Krazucki ??

02/11/2019, 17h45
Beginner.
Salut,

Merci à tous pour vos réponses.

Citation:

Envoyé par jreaux62

tes variables ne sont pas déclarées (toujours utiliser "use strict"; !)

Exact, elles sont globales du coup... En fait j'ai la tête dans Python en ce moment et on ne déclare pas les variables dans ce langage...

D'ailleurs j'ai d'abord écrit ce code en Python et je l'ai traduit en JS juste après : version Python... Les codes se ressemblent...
Citation:
Envoyé par jreaux62

ta regex n'inclut pas les caractères accentués.
de plus, il faut mettre le tout le minuscules, sinon "Salut" et "salut" seront 2 mots différents.
on peut aussi mettre le tout dans une fonction, et ne prendre que les mots de plus de 3 lettres (par exemple)
Effectivement...
Citation:
Envoyé par jreaux62

démo : https://codepen.io/jreaux62/pen/mddpBdE
Merci. Je vais regarder ça...

Citation:

Envoyé par NoSmoking

En l'état ton code est correct, je fais abstraction de la façon de récupérer les mots qui peut être bien différente suivant ce que tu cherches à obtenir via ta RegExp et du choix du type de la boucle for..of qui est une question de choix personnel plutôt que de performance.

Tu aurais utiliser une autre boucle ?

Pour la regex, oui j'ai vu que jreaux62 en a utilisé une plus complète...

Citation:

Envoyé par danielhagnoul

J'ai déjà travaillé sur ce problème dans mon blog : kNombreMots() retourne le nombre de mots et, dans l'ordre alphabétique, le nombre de chaque mot.

Merci. Oui je vais regarder ça...

PS: tu n'aurais pas fait une version en Python vu qu'on se croise dans le sous-forum python ?

Citation:

Envoyé par javatwister

En relisant ta proposition et les suivantes, peut-être un mix simplifié:

Citation:

Envoyé par psychadelic

Je suis parti du regex de jreaux62, après j'ai juste jonglé avec les différentes méthodes que l'on peut appliquer directement sur les objets Array de JS
Il y a aussi une utilisation de l'objet SET de JS....

Merci, je vais regarder vos codes...

Citation:

Envoyé par Beginner.

"pas déclarées" -> ...elles sont globales du coup...

Non, c'est faux.
Même les variables globales doivent être déclarées.
C'est juste l'endroit du code où la variable est déclarée (en l'occurrence, en dehors de toute fonction) qui en fait une "globale", ou pas.

Lire ce passage : Les variables globales implicites
Code:

1 2 3 4 5 6 7 8 9 var x = 0; // Déclare x comme variable globale du fichier, on lui affecte 0 ... function a() { var y = 2; // Déclare y dans la portée de la fonction a ... x = 3; // Affecte 3 à la variable globale x // Ne crée pas une nouvelle variable globale ... }
Voir aussi : let et const.

02/11/2019, 18h46
Beginner.

Citation:

Envoyé par jreaux62

Non, c'est faux.
Même les variables globales doivent être déclarées.
C'est juste l'endroit du code où la variable est déclarée (en l'occurrence, en dehors de toute fonction) qui en fait une "globale", ou pas.

Tu peux les déclarer, je n'ai pas dit le contraire mais ce n'est pas obligatoire pour qu'elles soient globales... Ce que j'ai dit c'est que les variables de mon code étaient globales puisque non déclarées... Mais que signifie "globale" là est la question...

Si tu veux ces variables sont forcément quelque chose : locales, globales ou "locales à un module"...

En fait elles sont globales (car elles ne sont pas déclarées) ---> elles appartiennent à l'objet "window".

Que tu les déclares ou non elles appartiendront à l'objet "window"...

Même si tu initialises une variable dans une fonction elle sera globale si tu ne la déclares pas...

Citation:

Envoyé par jreaux62

C'est juste l'endroit du code où la variable est déclarée (en l'occurrence, en dehors de toute fonction) qui en fait une "globale", ou pas.

Ben justement les variables en question sont "en dehors de toute fonction" comme tu dis...

Ceci dit une variable peut être en dehors de toute fonction sans être forcément globale, par exemple quand elles sont dans un module (c'est d'ailleurs un des intérêts des modules).
02/11/2019, 19h05
Beginner.
Voici un lien parmi d’autres qui confirme (en précisant que ce n'est pas recommandé) : https://www.tutorialsteacher.com/jav...cript-variable
Citation:
JavaScript allows variable declaration without var keyword. You must assign a value when you declare a variable without var keyword.
Example: Variable without var Keyword

Code:

1 2 3 one = 1; two = 'two';

Note: It is Not Recommended to declare a variable without var keyword. It can accidently overwrite an existing global variable.

Scope of the variables declared without var keyword become global irrespective of where it is declared. Global variables can be accessed from anywhere in the web page. Visit Scope for more information.
02/11/2019, 19h17
danielhagnoul

Citation:

Envoyé par Beginner.

Salut,

Merci à tous pour vos réponses. [...] PS: tu n'aurais pas fait une version en Python vu qu'on se croise dans le sous-forum python ? [...]

J'ai passé beaucoup plus de temps à reprendre le texte de votre test que d'écrire le programme cnt = Counter(texte.split()).

Je te l'envoie par MP, avec la méthode pour parcourir le dictionnaire. Si quelqu'un d'autre est intéressé, dites-le-moi !
02/11/2019, 19h26
Beginner.

Citation:

Envoyé par Beginner.

Même si tu initialises une variable dans une fonction elle sera globale si tu ne la déclares pas...

J'ai vérifié ce point en particulier et je précise que c'est bien le cas mais il faut que la fonction en question soit exécutée...

En fait si on fait toto = "Salut" c'est comme si on faisait window.toto = "Salut"...

Citation:

Envoyé par danielhagnoul

J'ai passé beaucoup plus de temps à reprendre le texte de votre test que d'écrire le programme cnt = Counter(texte.split()).

Je te l'envoie par MP, avec la méthode pour parcourir le dictionnaire. Si quelqu'un d'autre est intéressé, dites-le-moi !

Merci, je vais voir ça mais tu peux poster ton code ici : version Python si tu veux...
02/11/2019, 21h14
Beginner.

Bon ben j'ai testé plusieurs codes...

Il y a de belles présentations des résultats en plus dans certains...

Citation:

Envoyé par jreaux62

2- Merci de mettre quelques explications dans ton code.
Ce ne serait pas du luxe...

Et oui celui de psychadelic nécessite un peu plus de temps pour être compris et le débogueur aide bien lol...
02/11/2019, 22h07
javatwister

Bon. Une ptite maj pour être dom-friendly :roll:

http://javatwist.imingo.net/repetitions.htm
02/11/2019, 22h21
Beginner.

Oh joli... Tu t'es bien rattrapé là...

Citation:
Envoyé par jreaux62
Code:

1 2 3 4 5 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
Code:

<script type="text/javascript">

Euhhhh... Il date de quel époque, ton "minimum syndical" ? :aie:
Krazucki ??
Ben on a l'âge de ses artères, mon lapin. Et si ça t'es pas jouasse, marche à l'ombre.

:ptdr::ptdr::ptdr:

Voila la doc sur mon code JS précédent : (https://www.developpez.net/forums/d2.../ )
Quelques explications…

Tout d’abord, ce code utilise « intensivement » la technique de chainage présente dans JS

exemple :
Code:

1 2 3 4 5 6 const leTexte = document.querySelector('#mon-texte') const decoup = leTexte .textContent .toLowerCase() .match(/[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g)
ce qui est équivalent à
Code:

1 2 3 4 5 const leTexte = document.querySelector('#mon-texte') let x1 = leTexte.textContent let x2 = x1.toLowerCase() const decoup = x2.match(/[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g)
au passage j’ai changé le regex du
split(/[^a-zA-ZàèìòùÀÈÌÒÙáéíóúýÁÉÍÓÚÝâêîôûÂÊÎÔÛãñõÃÑÕäëïöüÿÄËÏÖÜŸçÇßØøÅåÆæœ]/).

par : .match(/[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g).
puisqu’il est précédé par une méthode qui transforme toutes les lettres en minuscules ; donc inutile de tester avec des lettres majuscules dans le regex,
+ c’est aussi une optimisation.
+ remplacement du split par un match ( merci CosmoKnacki ;) )

À la suite j’ai ajouté d’autres méthodes :

1 – .filter(s=>(s!==undefined && s.length > 3) ).
celle ci réalise un filtrage sur l’array généré précédement , c.a.d. qu’elle génère un nouvel array ne contenant que les "vrais" mots ayant plus de 3 lettres.

La doc sur cette fonction => https://developer.mozilla.org/fr/doc...x/Array/filter

pour mémo, j’ai utilisé ici une fonction fléchée équivalente à function(s) { return ( s!==undefined && s.length > 3) } ..

2 – .sort((a, b) => a.localeCompare(b)).
un grand classique pour trier du texte, la comparaison est réalisée par la méthode localeCompare()=> https://developer.mozilla.org/fr/doc.../localeCompare

utile pour toutes langues utilisant des signes diacritiques sur ses caractères (les accents sur les lettres )

3 – .reduce((a,c,i,t)=> { ... }, []).
La fameuse méthode reduce applicable aux array JS => https://developer.mozilla.org/fr/doc...x/Array/reduce

ici avec tous les arguments possibles (a,c,i,t)et même l’option d’instanciation : , [].

cette méthode permet de parcourir l’Array, chaque occurrence étant représenté ici par l’élément c.
(désigne la currentValue, donc on utilise cette lettre « c » par convention), le i représente l’index courant sur le tableau, ici désigné par l’argument t .

il faut bien voir qu’ici, le tableau sur lequel cette méthode s’exécute n’existe que dans la mémoire du système, et dans le cas présent il sera utile de pouvoir s’y référer.
Quant au paramètre a c’est un accumulateur.

Cet accumulateur représente la valeur de retour de la méthode reduce.
Cet élément central récupère au fur et à mesure de l’itération sur la table les données que l’on souhaite retrouver en sortie.

Ici cet accumulateur commence avec la valeur [] : un array vide (sinon il commence avec le premier item de l’array en entrée.

Ici l’idée c’est de créer un tableau ressemblant à ça :
Code:

1 2 3 4 5 [ { m: 'envoler', n: 1 } , { m: 'évada', n: 1 } , { m: 'évadé', n: 11 } , { m: 'évader', n: 3 } ]
alors qu’initialement on a : [ 'envoler', 'évada', 'évadé', ... 'évadé', 'évader', ... 'évader' ].

d’où la fonction fléchée
Code:

1 2 3 if (i===0 || t[i-1]!==c ) a.push ({m:c, n:1}) else a[a.length-1].n++ return a
si le currentItem est différent de l’item précédent (ou si c’est le premier) on ajoute dans l’accumulateur un nouvel objet {m:c, n:1} exemple { m: 'envoler', n: 1 }.
sinon, ben, on augmente d’un point le dernier objet inséré dans l’accumulateur a[a.length-1].n++.

et a la fin on renvoie l’accumulateur pour la boucle suivante ou la fin de la partie.

Je profite ensuite de l’affichage de ce résultat pour renseigner une liste des nombres d’ocurences trouvée, via un Set JS => https://developer.mozilla.org/fr/doc...ts_globaux/Set

let occurences = new Set().

que je remplis au fur et à mesure d’une boucle classique

Citation:

for (let mot of decoup)
{
occurences.add(mot.n)

ce qui donne le set suivant pour cet exemple occurences : 1 / 2 / 9 / 11 / 3 / 7 / 5 / 8sinon la boucle est aussi utilisée pour remplir la table <table id="result"></table>via ce code:
Code:

1 2 3 4 let nRow = leResult.insertRow(-1) // nouveau <tr></tr> en fin de table , rCell = 0 // indice du premier <td></td> nRow.insertCell(rCell++).textContent = mot.m // crée et rempli le premier <td> avec le mot.m ( ex: 'envoler') nRow.insertCell(rCell++).textContent = mot.n // crée et rempli le premier <td> avec le mot.n ( son nombre d'occurence )
la boucle suivante sert à afficher la liste des termes correspondant à chaque occurrence.

Petit problème: cette liste est un objet Set, sur lequel on ne peut effectuer un tri, utile pour présenter les occurrences par ordre croissant,
donc faut le transformer en Array: [...occurences] qui est en fait de la déclaration d’un Array [ ] que l’on remplit à l’aide du spread operator (les trois petits points ... que l’on peux appliquer sur le Set (parce qu’il est itérable).
La doc : https://developer.mozilla.org/fr/doc...%A9composition

donc on a un Array qu’on peut trier .sort((a, b)=>a-b)…
et que l’on peut parcourir via un .forEach(o=> j’ai pris la lettre o pour argument, vu qu’il s’agit d’un item dans le Set occurrences

après c’est pareil pour remplir le tableau sauf que cette fois-là il faut retrouver tous les termes correspondants sur une occurrence
Code:

1 2 3 4 decoup // sur cet Array .filter(d=>d.n===o) // ne garde que ceux ayant la même valeur que l'occurence courante .map(e=>e.m) // crée un tableau avec uniquement les termes ( [ ..., { m: 'évader', n: 3 }, ...] devient [ ..., 'évader', ...] ) .join(', ') // transfo de cet array en String séparé par des virgules...

02/11/2019, 23h27
CosmoKnacki
Mieux vaut un bon match qu'un mauvais split (ce qui évite les chaînes vides):
Code:

1 2 .toLowerCase() .match(/[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g)
02/11/2019, 23h41
psychadelic

Citation:

Envoyé par Beginner.

Tu peux les déclarer, je n'ai pas dit le contraire mais ce n'est pas obligatoire pour qu'elles soient globales...
/.../
.

Faut mieux ne pas trop jouer avec les non-déclarations de variables, et ça donne tout de suite une mauvaise image sur le codeur.

éviter les variables globale aussi, car après on risque de se retrouver avec des effets de bord
C'est l'un de mes pires cauchemars sur la maintenance de code :
obligé de décortiquer des centaines de pages de code pour savoir si une variable globale était volontairement changée par une fonction 10 pages plus loin, ou si ce devait être une autre variable qui ne devrait pas porter le même nom,
et c'était loin d'être un cas unique...

donc autant que possible ce limiter le nombre de variables globales au strict minimum , et encapsuler toutes les variables, voire les mettre dans des closures pour qu'elles soient inaccessibles par 'l'extérieur"
02/11/2019, 23h46
psychadelic
Citation:
Envoyé par CosmoKnacki

Mieux vaut un bon match qu'un mauvais split (ce qui évite les chaînes vides):

Code:

1 2 .toLowerCase() .match(/[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g)
merci, et effectivement : je change mon code pour placer un match, ( spécifiquement fait les expressions régulières)
03/11/2019, 00h42
Beginner.
Citation:

Envoyé par psychadelic

Voila la doc sur mon code JS précédent : (https://www.developpez.net/forums/d2.../ )
Quelques explications…

Merci, c'est une explication détaillée !

Ça va j'avais compris la majorité...
Citation:
Envoyé par CosmoKnacki

Mieux vaut un bon match qu'un mauvais split (ce qui évite les chaînes vides):

Code:

1 2 .toLowerCase() .match(/[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g)
Merci.

Citation:

Envoyé par psychadelic

Faut mieux ne pas trop jouer avec les non-déclarations de variables, et ça donne tout de suite une mauvaise image sur le codeur.

Ben c'est clair qu'il vaut mieux éviter, je ne défend pas le contraire... J'ai juste fait remarqué que puisqu’elles n'étaient pas déclarées (avec var ou let) elles étaient du coup globales ce qui est vrai (même si il y a une différence subtile).

Comme j'avais dit en ce moment j'ai la tête dans Python et on ne déclare pas les variables dans ce langage... Or le code JS que j'ai posté je l'ai traduit d'un code Python que j'avais écrit juste avant et j'avais oublié d'ajouter les déclarations des variables...

Et j'étais surtout concentré sur l'algorithme...

Citation:

Envoyé par psychadelic

éviter les variables globale aussi,

Oui effectivement, je le dit aussi parfois...

Citation:

Envoyé par psychadelic

donc autant que possible ce limiter le nombre de variables globales au strict minimum , et encapsuler toutes les variables, voire les mettre dans des closures pour qu'elles soient inaccessibles par 'l'extérieur"

Oui les closures et aussi les modules...

Et moi qui croyais que l'on parlait d'amélioration !!

Visiblement on n’a pas tous la même vision de « Peut-on améliorer le code ? »

Pour moi, améliorer le code c’est, entre autre, améliorer la lisibilité et donc la maintenance de celui-ci, la concision parfois incompatible avec la lisibilité, permettre les tests, séparer les tâches à effectuer afin de simplifier la complexité de celles-ci ... et pourquoi pas optimiser.

Indépendamment des bonnes manières à respecter, déclaration des variables …, et ce quelque soit le langage, une des améliorations passerait par la création d’une fonction réutilisable par tâche à accomplir.

On définie la fonction avec

Ce qu’elle attend en entrée
Le traitement a effectué
ce qu’elle l’on retourne pour exploitation dans le reste du code.

On pourrait donc imaginer la définition de la fonction, son prototype, comme suit
Code:

1 2 3 4 5 6 7 8 9 10 11 /** * @param {String} texte – Texte à traiter * @param {Number} minlength – Longueur minimale des mots à prendre en compte * @returns {Array of Array} result - Tableau des données sous forme [[mot1, nbr1], [mot1, nbr2], […] */ function getOccurrenceTexte(text, minlength) { // déclaration des variables // préparation des données // traitement des données return result; }
@psychadelic :
•••
Il manque à minima un test sur la donnée de départ, que se passe t-il si le texte est null ?

•••

Citation:

Tout d’abord, ce code utilise « intensivement » la technique de chainage présente dans JS

Pour moi dans bien des cas le chaînage entraîne une perte de lisibilité et est accessoirement plus délicat à déboguer.

•••

Citation:

.filter(s=>(s!==undefined && s.length > 3) )

Pourquoi ne pas le faire dans reduce, on réduit ainsi le nombre d’itérations nécessaires pour obtenir le même résultat !?!

•••

Citation:

.reduce((a,c,i,t)=> // crée un tableau d'objet

L’amélioration du code passe aussi par le choix judicieux du nom des variables.

Pourquoi utiliser reduce, => réduire, alors que ce n’est pas vraiment, parmi toutes les méthodes disponibles, la mieux adaptée et ce au moins sémantiquement parlant ne serait ce que par rapport à forEach.

Il est à noter que, si l’on parle d’optimisation/performance, les méthodes forEach et reduce seront moins performante qu’une bonne boucle for du fait de l'appel à une fonction callback, mais ceci ne doit pas forcément être un critère !

•••

Citation:

let occurences = new Set()

Là totale incompréhension de ma part, déjà ici on aborde une autre partie, la sortie affichage, et cela devrait donc se trouver dans une fonction indépendante en utilisant les données reçues.
De plus je ne vois pas l’intérêt de passer par un new Set quand les données sont disponibles, pour l'affichage suivant. Tu as déjà « en sortie »
Code:

1 2 3 4 5 6 7 8 9 decoup = [ { "m": "abri", "n": 1 }, { "m": "affaler", "n": 1 },
Il en est de même pour l’affichage sous forme de <table> et l’utilisation de
Code:

1 2 3 4 decoup .filter(d => d.n === o) .map(e => e.m) .join(', ')
Mais là pour le coup, dans ton code, je pense que cela limite pas mal la gestion des lignes.

•••
Donc oui tes explications sont très MDNesque mais à mon avis tu t’es plus fait plaisir qu’amélioré le code de départ.

En gros comme le dit Beginner.

Citation:

Et oui celui de psychadelic nécessite un peu plus de temps pour être compris et le débogueur aide bien lol...

Donc pas franchement une amélioration mais une autre façon de faire.

Un dernier point, omettre le ; (point virgule) en fin d’instruction peut rendre le code inutilisable en cas de minification et même parfois dans le code non minifié.

@Beginner. :

Citation:

Tu aurais utiliser une autre boucle ?

peut importe mais surement une sur base forEach, pour la sémantique ou for pour l'optimisation éventuelle.

Cela pourrait donner, en tenant compte de certaines remarques
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 27 /**---------------------------------------------------------------------- * Fonction de récupération du nombre d’occurrence des mots dans un texte *----------------------------------------------------------------------- * @param {String} texte – Texte à traiter * @param {Number} minlength – Longueur minimale des mots à prendre en compte * @returns {Array of Array} result - Tableau des données sous forme [[mot1, nbr1], [mot1, nbr2], […] */ function getOccurrenceTexte(text = "", minlength = 3) { const objResult = {}; const CosmoKnackiReg = /[a-zàèìòùáéíóúýâêîôûãñõäëïöüÿçßØøåæœ]+/g; // préparation et récupération des données const tabMots = text.toLowerCase().match(CosmoKnackiReg); if (tabMots) { // récupération de toutes les occurrences tabMots.forEach( (el) => { if( el.length >= minlength){ if (!objResult[el]) objResult[el] = 0; objResult[el] += 1 } }); } // convert en array d'array const tabResult = Object.entries(objResult); // on peut trier dans l'ordre alpha par défaut tabResult.sort((a, b) => a[0].localeCompare(b[0])); return tabResult; }
L'appel à celle-ci se faisant simplement par exemple
Code:

1 2 3 const texte = document.querySelector('#mon-texte').textContent; const result = getOccurrenceTexte(texte); // les données sont ici disponible pour en faire l'affichage par exemple.
Le contenu de la boucle pouvant varier, ce ne sont pas les choix qui manquent
Code:

1 2 3 4 5 tabMots.forEach( (el) => { if( el.length >= minlength){ objResult[el] ? objResult[el] += 1: objResult[el] = 1; } });
ou encore
Code:

1 2 3 4 5 6 7 8 9 10 tabMots.forEach( (el) => { if( el.length >= minlength){ if (objResult[el]) { objResult[el] += 1; } else { objResult[el] = 1; } } });
et il y en a d'autres.

[EDIT] Il s'est permis, j'ai corrigé, je manque d'air sur ce coup !

06/11/2019, 12h36
Invité

Si je peux me permettre...

On écrit "Occurrence", avec 2 "c" et 2 "r". :aie:
06/11/2019, 13h45
NoSmoking

Citation:

Si je peux me permettre...

tu peux te permettre ;)
06/11/2019, 16h20
javatwister

Un mot:

Citation:

Envoyé par "NoSmoking

Pour moi, améliorer le code c’est, entre autre, améliorer la lisibilité et donc la maintenance de celui-ci, la concision parfois incompatible avec la lisibilité, permettre les tests, séparer les tâches à effectuer afin de simplifier la complexité de celles-ci ... et pourquoi pas optimiser.

Un objet global contenant toutes les références à une des fonctionnalités de la page ne me semble pas une aberration du point de vue lisibilité et maintenance. Un autre objet définira les variables liées à une autre fonctionnalité et puis voilà. Question performance, je n'y connais pas grand chose mais bon: essayez de créer une page web nécessitant JS sans déclarer à un moment ou à un autre un objet... ça revient à se passer de JS.

Je retiens les mêmes valeurs que NoSmoking. On peut étaler sa science à l'infini, ça ne fait pas progresser d'un millimètre l'utilisateur de l'appli qui demande essentiellement de l'ergonomie. Et je ne suis pas allé vérifier la définition sur le CNRTL, mon dico préféré!
06/11/2019, 17h03
Beginner.

Citation:

Envoyé par NoSmoking

@Beginner. :

peut importe mais surement une sur base forEach, pour la sémantique ou for pour l'optimisation éventuelle.

Cela pourrait donner, en tenant compte de certaines remarques

Merci pour la réponse...

Je vois que tu as utilisé une regex spéciale, la CosmoKnackiReg lol... Je vois d'où vient ce nom...
08/11/2019, 01h21
Beginner.

Citation:

Envoyé par Beginner.

Ben c'est clair qu'il vaut mieux éviter, je ne défend pas le contraire... J'ai juste fait remarqué que puisqu’elles n'étaient pas déclarées (avec var ou let) elles étaient du coup globales ce qui est vrai (même si il y a une différence subtile).

Il y a bien une différence quand même et certains disent que pour que ce soient des variables il faut les déclarer sinon ce ne sont pas des variables à proprement parlé... Bon après dans la pratique, dans la plupart des cas la différence ne se voit pas...

* Exemple About variables :

Citation:

Often various articles and even books on JavaScript claim that: “it is possible to declare global variables using var keyword (in the global context) and without using var keyword (in any place)”. It is not so. Remember:

variables are declared only with using var keyword.
...

Bon après il y a quand même des références qui disent (tout en expliquant ensuite les différences) :

Citation:

Si on affecte une valeur à une variable qui n'a pas été déclarée (le mot-clé var n'a pas été utilisé), cela devient une variable globale (une propriété de l'objet global) lorsque l'affectation est exécutée. Les différences entre les variables déclarées et les variables non-déclarées sont :

Les variables déclarées sont contraintes dans le contexte d'exécution dans lequel elles sont déclarées. Les variables non-déclarées sont toujours globales.
...

Suite : https://developer.mozilla.org/fr/doc...structions/var

une propriété de l'objet global ---> dans un navigateur c'est l'objet window et j'ai testé et vérifié ce point sur Chrome

Mais bon dans tous les cas c'est déconseillé, c'est à éviter, nous sommes d’accord...