Apprendre le JavaScript : Les classes
HTML-код
- Опубликовано: 7 сен 2024
- Article ► grafikart.fr/t...
Abonnez-vous ► bit.ly/Grafika...
Dans ce chapitre nous allons faire le point sur le fonctionnement interne des objets en JavaScript et on va parler de la notion de [prototype](developer.mozi....
Soutenez Grafikart:
Devenez premium ► grafikart.fr/p...
Donnez via Utip ► utip.io/grafikart
Retrouvez Grafikart sur:
Le site ► grafikart.fr
Twitter ► / grafikart_fr
Discord ► grafikart.fr/t...
Ce cours merite des millions de views. Deja il est a jour par rapport a plusieurs autres cours en ligne et il est tres bien structure. Appuyer jaime et partager. Cest le moins quon puisse faire!!!!
il a tellement des millions de vue que meme copilot la mise en memoire! des que je tape la premiere lettre copilote me complete
Merci Grafikart, des cours sur data structures avec JS On en a vraiment besoin si vous feriez une serie sur ca ca serait super.
Merci pour tout !
Je note que dans cette nouvelle formation, vous utilisez désormais Edge...
Amusant
😊
D'habitude je ne commente beaucoup mais vos tutoriels sont soigneusement préparés. Et votre voix narrative me rend beaucoup plus à l'aise et à mieux suivre d'une façon "Zen". Merci infiniment et bonne continuation. Une petite suggestion "playlist sur tailwind" si c possible.
il est tellement zen et tellement lent que moi meme en pratiquant je comprend lq moitie, que c'est la ou tu comprend la differrence entre un junior et un senior
today i've understand how much im lucky because i can uderstand french thank you so much , you've done a very good job .
Merci pour la vidéo, elle est top !
Merci Graf! Toujours un plaisir.
Mike codeur a dit que pour REACT, les classes ne servaient plus et ce n'était plus nécessaire.
C'est vraiment le cas, en tout cas, tes formations sont excellentes.
c'est les composant à classes qui ne servent plus à rien car c'est deprecated ou legacy code,grace aux HOOKS React, mais les classes servent toujours pour la programmation orientée objet en javascript natif et même si en 2022 on peut tout faire avec les fonctions
Elles servent encore dans react mais leur usage est très limité (on en aura besoin pour les ErrorBoundary (reactjs.org/docs/error-boundaries.html) qui n'ont pas de syntaxe alternative à l'heure actuelle.
Sinon, elle peuvent servir à décrire la logique de certains types complexes même dans du code react donc je ne ferais pas l'impasse sur cette notion personnellement.
@@grafikart Merci beaucoup les informations 👍🏼,
Je pense aussi que c'est nécessaire mais certains bootcamp, les formateurs zap cette partie pour REACT 😖.
Moi je suis tes formations et j'ai pu acquérir les bases dans les bonnes conditions.
@@e-genieclimatique Merci pour les informations 🙂👍🏼.
Très bon tuto.
On peut faire des "attributs" de classe et privé mais est-ce qu'il y a une façon de déclarer des attributs "protected" ?
Questions : avec angular, vue, react et autres, qui utilisent vraiment les classes ?
Les langages sont au final relativement compliquée et les frameworks permettent de les rendre accessibles pour tous.
Dans quel contexte peut-on réellement être amené à utiliser des classes en Javascript ?
Tu utilisera des systèmes de "classe" avec des extends etc même si ils ne s'appeleront pas toujours classes mais les principes de cette vidéo vont quand meme bien t'aider pour les différents framework que tu as cité
A noter une petite exception dont je n'étais pas au courant et qui m'a fait croire en un bug en Javascript : dans la console de Chrome, votre instance peut avoir accès à un 'private field' alors que justement il ne devrait pas avoir accès. A 24:30 avec john.#secret (tu utilises Edge d'ailleurs donc tu n'as pas accès)
"Code run in the Chrome console can access private properties outside the class. This is a DevTools-only relaxation of the JavaScript syntax restriction."
Bonjour et merci pour vos tutos genial mais s'il vous plait j'ai pas bien assimiler la notion de getter et setter
C'est pas une belle marge de progression pour Jane mais une belle courbe :p
Quand est il préférable d'utiliser des classes plutôt que des fonctions ? Je peux aussi optimiser les choses et empêcher la répétition (DRY) avec des fonctions... Je sais que la classe représente un modèle répétable à l'envi.
Ce n'est pas forcément un choix super évident. Mais perso j'utilise les classes pour représenter un "type" / "concept" sur lequel je souhaite appliquer plusieurs méthodes dessus (par exemple Date, Interval, Shape, User...).
@@grafikart C'est ça qui est compliqué à comprendre. En soit le concept de classe est simple mais savoir quand les utiliser, sachant que en quelque sorte on peut se débrouiller sans, est assez compliqué.
Je suis revenu sur cette vidéo après le TP sur les commentaires car j'avais trouve une solution sans l'utilisation de classes
Bonjour. S'il te plaît du coup école c'est quoi exactement? Une variable ? Pourquoi ne l'avoir pas faite précedée du mot clé habituel. Et aussi est ce qu'il est obligatoire de la mettre ? Pareille pour la seconde après. Merci d'avance. C'est super ce que tu fais 🤏🏾
Bonjour, pour distinguer les variables sens strict et celles appartenant a un objet on les appellera plutôt propriétés (ou attributs) , pas besoin du mot clé var ou let.
De la même façon les fonctions a l'intérieur d'un objet on les appellera plutôt des "méthodes" et n'ont pas besoin en js du mot clé "function".
C'est une notation spécifique dans les classes (j'aurais peut être du détaillé). Tu peux voir ça comme un this.ecole = '...', la propriété se retrouvera automatiquement sur l'objet construit à partir de cette classe.
@@nicolaso42 Ah ok merci
@@grafikart merci beaucoup ( :
Salut je n’arrive pas à comprendre le système de prototype de js en gros c’est la forme de base d’un objet c’est ça ?
Oui on peut voir ça comme ça.
@Rico Martini merci de l’explication
merci pour ce tuto, cependant j'ai beau demander a chatgpt, je ne comprend pas...l'utilité meme de this. et pourquoi les fonction dans les class s'apelle des méthodes... ca ma vraiment embrouiller durant le visionnage... je me suis perdu...
hey , le this à l'intérieur de constructor fait référence à l'objet qui sera crée à partir de la class , d'où la notation par point ( ex this.firstname ) quand aux méthodes c'est bel et bien des fonctions mais des fonctions spécifiques aux objets qui seront les instances de la class / des fonctions applicables seulement aux instances de la class
espérant que ça te permettra d'y voir plus clair🙂
Hello, à 21 minutes je ne comprends pas d'où vient le "super" ? On l'a déclaré nul part mais il est quand même connu ? Sinon merci pour tes cours !
super est un mot clef dédié en JavaScript donc il vient de nul part.
bonjour j'ai pas trouvé la solution svp
class etudiant{
ecole='jull fery'
constructor(nom,prenom){
this.nom=nom
this.prenom=prenom
}
moyeleve (notes) {
let som=0
for(let note of notes){
som=som+note
}
return som/notes.length
}
setnote(notes){
this.notes=notes
}
canpass(){
return moyeleve(this.notes)>=10
}
}
const jhon=new etudiant('jhon','rahal')
const jame=new etudiant('jame','rhal')
jhon.setnote([10,15,10])
console.log(jhon.canpass())
voila l'erreur affiche:
les classes.js:22 Uncaught ReferenceError: moyeleve is not defined
at etudiant.canpass (les classes.js:22:4)
at les classes.js:28:18
cool
/ Q1
// Supprimez le premier et le dernier élément du tableau `bornesIncendie`.
// Après ces suppressions, la taille de `bornesIncendie` est de 3774.
bornesIncendie.shift();
// Q2
// Affichez dans la console le nombre de bornes à incendie présentes
// au sein de la commune dénommée `LES PONTS-DE-CE`.
let nb=0;
for (let i of bornesIncendie)
{
if (i.commune=='LES PONTS-DE-CE')
nb++;
}
console.log(nb);
// Q3
// Créez un tableau contenant un code, créé sur mesure, pour chaque borne.
// Le code sera composé des 3 premières lettres de la commune
// suivies d'un tiret et du numéro pompier (`num_pompier`).
var tabcode=[];
for (let x of bornesIncendie){
tabcode.push(x.commune.slice(0,3)+'-'+string(x.num_pompier));
}
console.log(tabcode);
// Q4
// Affichez dans une popup s'il existe au moins une borne incendie
// dans une ville saisie par l'utilisateur. Attention : les noms de communes
// sont stockés en majuscules dans le tableau `bornesIncendie`.
// Q5
// Affichez dans la console le débit d'eau cumulé des bornes à incendie
// du tableau `bornesIncendie`. Attention, pour certaines bornes, le débit prend
// la valeur `null`.
var sdebit=0;
for (let i of bornesIncendie){
if(i.debit)
sdebit+=i.debit;
}
console.log(sdebit);
Question : finalement c'est quoi un prototype?
D'après ce que j'ai compris, Prototype est comme une class parente (ou supérieure) qui a des méthodes natives à lui
"Student extends Prototype", tel que "superStudent extends Student"
En résumé, superStudent extends Student extends Prototype
D'après ce que j'ai compris, Prototype est comme une class parente (ou supérieure) qui a des méthodes natives à lui
"Student extends Prototype", tel que "superStudent extends Student"
En résumé, superStudent extends Student extends Prototype