Bonjour,
Je coince sur la compréhension des problèmes de perte de this et de gestion des événements DOM. Pouvez vous m'aidez un peu?

Par exemple, dans le code suivant:
Je crée un slider codé dans une fonction et affiche la valeur du slider. Cela fonctionne. (ligne 67 -68)
Mais je n'arrive pas à convertir ce code pour le passé dans une classe ???

Code html : 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
60
61
62
63
64
65
66
67
68
69
70
71
72
<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <title></title>
 
<style>
</style>
 
  </head>
  <body>
    <header></header>
    <main>
<table border=1px>
  <thead>
    <th>fonction</th>
    <th>classe</th>
  </thead>
  <tbody>
  <tr>
    <td><div id = "GenAff_0"></div></td>
    <td><div id = "GenAff_1"></div></td>
  </tr>
  </tbody>
</table>
 
</main>
    <footer></footer>
  </body>
  <script>
class GenSlider{
        constructor(id) {
                this.id=id;
                this.idcont=document.getElementById(id);
 
                this.conteneurSlider = document.createElement('input');
                this.conteneurSlider.type = "range";
                this.conteneurSlider.min = "0";
                this.conteneurSlider.max = "100";
                this.conteneurSlider.value = "0";
/*              this.conteneurSlider.oninput = this.etat(this.conteneurSlider.value);*/
                this.idcont.appendChild(this.conteneurSlider);
                this.conteneurSlider.oninput=this.etat(()=>this.value);
 
                this.valeur=null;
                this.conteneurValeur = document.createElement('div');
                this.idcont.appendChild(this.conteneurValeur);
 
 
                }
 
        etat(value){
                this.valeur = value;
                if (this.conteneurValeur != "undefined"){
/*                      this.conteneurValeur.innerHTML = this.valeur;*/
 
                }
                let valeurSlider = document.getElementById(this.id).value;
                console.log(this.valeur);
                return this.valeur;
        }
 
}
slider0 = new GenSlider("GenAff_0");
slider1 = new GenSlider("GenAff_1");
 
slider0.conteneurSlider.oninput = function() {
  slider0.conteneurValeur.innerHTML = this.value;
}
  </script>
 
</html>