Le javascript ! (au sens large)

Hello tout le monde,
Je voulais baptiser ce nouveau sous-forum avec un sujet qui me tient à cœur.


Et oui, le javascript, mais la question est, qu'est ce que le javascript pour vous ? Un langage obscur qui ne sert qu'à faire bouger des onglets ? Un langage formidable pour faire tout un tas d'application web / de LS ?

Venez ici parler de votre expérience avec le javascript, ce qu'il vous inspire, est-ce qu'il vous faire peur ? Est-ce aussi compliqué qu'il n'y parait ?

Le débat est lancée !

Personnellement je m'y suis déjà essayée, mais j'avoue ne pas avoir eu la persévérance de continuer à partir du moment où ça a parlé de tableaux à 4 dimensions. En fait c'est parce que j'ai rien compris.
Mais de ce que j'en ai vu ça me paraît un outil excellent pour donner à son forum plus d'interactivité... à condition de s'en dépêtrer. Il paraît également que ça augmente beaucoup le temps de chargement de la page mais je n'en ai jamais fait l'expérience...

Concernant le temps de chargement de la page, en fait, ça dépend tout de la lourdeur de ton script et de ce que tu fais dedans (genre une boucle qui doit boucler 1 millions de fois avant de finir, bha ça va ralentir la page, oui. xD)

J'avoue n'avoir pas envisagé ça sous cet angle
Tu m'as donné envie de m'y remettre x)

Bonsoir ~

Mmhh... En fait, ce que je retiens surtout du javascript, c'est que c'est compliqué. Ou du moins, mal expliqué. Je n'ai pas de misère à comprendre le CSS, CSS2 ou CSS3, parce que c'est bien décrit là où je vais fouiller. Par contre, le javascript... Même en essayant de lire des tutos pour débutant, cela me perd souvent assez rapidement.

Je ne comprends par pourquoi il y a des signe "$" à certains endroits et pas à d'autres, où ouvrir les parenthèses ou les refermer ou même la structure de base, pourquoi certains mettent des ' ' alors que d'autres mettent des " " ou même si ça fait vraiment une différence

Quand j'ai appris à coder, il y avait un ami à moi qui m'avait expliqué comment fonctionnait un tableau, le fait que "tr" voulait dire une "ligne" du tableau et "td" une cellule et que le CSS suivait la forme "propriété: valeur". Il y avait un tas de définitions sur des trucs vraiment basiques que "tout le monde connait", mais que moi je ne savait pas avant dele lire. Les tutos dits "débutants" sont souvent déjà une étape trop avancée pour les vrais débutants qui ne comprennent même pas un mot de ce qu'on leur dit.

Du plus, quand j'essaye de comprendre le javascript, j'ai de la misère à trouver un endroit qui explique la structure et les éléments de base, alors ça ne m'aide pas >< Je veux dire, quand on apprend à écrire le français, on apprend rapidement qu'il faut mettre une majuscule en début de phrase, un point en fin de phrase et qu'il faut un groupe nominal, un groupe verbal et son complément. Mais le javascript... Eh bien les gens ont tendance à tout mettre collé pour prendre le moins de place possible. Quand on regarde du CSS, ce n'est pas trop dur, c'est tout séparé, alors on peut en observer pour apprendre. Mais un javascript sans espacement, sans sauts de ligne et long comme un pied... Bah c'est nettement plus difficile ><

= = = = = = = = = =

Dans un autre ordre d'idée, ce que je sais du javascript, c'est que c'est surtout lié aux évènements je crois. Je prends l'exemple d'un javascript qui fait une certaine action lorsque on clic sur un bouton ou lorsque l'heure est entre 0h et 6h du matin ou lorsque la taille de mon écran est plus grande que 1366px, etc... Il faut qu'il y ait un dénominateur ou une action pour enclencher le javascript. Du moins, c'est surtout dans ces cas là que je l'ai vu.

En même temps, il y a des javascript qui n'ont pas l'air vraiment d'agir après un évènement à moins que je sois trop stupide pour comprendre où sont les évènements en question, donc c'est sûrement pas la seule utilisation u_u

= = = = = = = = = = = = =

Ce que j'ai de la difficulté à comprendre également, c'est que dépendamment de la façon dont l'écrit, un javascript devra être mis directement dans un template entre balises "script" alors que d'autres fois, on va directement le mettre dans les javascripts de notre panneau d'administration. Ça me rend folle, surtout que je suis parfois capable d'ajouter des parties de scripts dans mes codes (par exemple, je préfère utiliser le javascript que les target quand il est question d'ouvrir un onglet au click comme ici), sauf que je n'ai jamais été capable de le transformer pour le mettre ailleurs que dans le template directement.

= = = = = = = = = = = = = = = = =

Bref, le javascript, c'est cool, c'est utile, cela peut faire des tonnes de trucs dont je n'ai aucune idée, mais j'ai de la misère à le comprendre. Mon seul recours, c'est quand je prends des javascripts que les autres ont fait et que je change des trucs jusqu'à comprendre comment ledit javascript fonctionne afin de l'adapter pour qu'il fasse ce que je veux. Je trouve que c'est déjà pas mal du tout, mais c'est pas très professionnel non plus u_u

= = = = = = = = = = = = = = = =

Edit 1 :

Spoiler:

Edit 2 :

Spoiler:

Edit 3 :

Spoiler:

Hey Onyx, j'aime quand tu te pose des questions !

Je vais rapidement répondre à la grande question qui ressort de ton post (et je sais que c'est pas la seule, mais là j'ai pas le temps xD):

Qu'est ce que c'est que ce ' $ ' ?

Concrètement, ce n'est pas du javascript de base. C'est du jQuery. Alors qu'est ce que jQuery ? C'est une librairie (un ensemble de fonction) codé en javascript qui permet de faciliter un grand nombre de taches. C'est l'une des plus grosses librairie de fonction que tu pourra trouver en javascript, elle est très volumineuse, tu as accès à des centaines de fonctions (plus ou moins utile selon les cas).
$ en fait, tu peux le considérer comme une fonction qui est écrite dans le code de la librairie jQuery, cette lib est incluse automatiquement dans FA, il me semble. Alors que si tu faisais une page html "basique", si tu utilisais un ' $('.maclass') ', et bien le navigateur te dirait "Ola, il y a une erreur là, je ne connais pas ce ' $ ' ".

Il faut savoir qu'une fonction peut prendre un ou plusieurs paramètres (variables), qui peuvent être utilisés dans la fonction. Par exemple ici j'ai écris une fontion de test avec un paramètre :

Code:

function fenetreTropPetite(nombrePixel) {
    if (nombrePixel < 600) {
        ici je vais faire une action si la variable nombrePixel est inférieur à 600
    } else {
        Sinon je fais autre chose
    }
}

Et c'est donc c'est comme ça que fonctionne '$', il prend un chaine de caractère en parametre qui est délimité par tes ' ou ", ici cela n'a pas d'importance, le javascript saura très bien que ce qui se trouve entre deux ' ou deux " est une chaine de caractères. Attention à ne pas mélanger et commencer par un ' et finir par un ", ça ne marchera pas ! : /

Voici deux trois site qui pourront aider ceux qui s'intéresse au javascript et à jQuery :
Tout d'abord, pour jQuery => http://api.jquery.com/
C'est le site qui recense toutes les fonctions utilisables avec ' $ ', par exemple, une fonction qui retourne une valeur "vraie" ou "fausse" quand on écrit

Code:

 if ($('.maClass').hadClass('toto') ) {
    Si l'objet (on parlera d'objet pour ce qui est du retour de $('quelquechose'), car il peut contenir plusieurs balise avec la même classe par exemple) $('.maclass') a aussi la class "toto", alors le code présent dans ce if sera exécuté.
}


Pour ce qui est de l'apprentissage du javascript, je vous conseil ce site => http://javascript.developpez.com/

et plus particulièrement ce tutoriel => http://javascript.developpez.com/tutoriels/introduction/?page=page_1

Je suis totalement de l'avis d'Onyx dans tout son début de message, c'est un peu la même sensation que j'ai en fait avec le js, ça me parait décousu et inaccessible, et c'est frustrant parce que même si j'ai eu mes galères avec le html/css en apprenant en majorité seul, j'y suis quand même arrivé. Mais ça me semblait logique, là où le js me parait être d'une logique différente que je ne semble pas saisir x).
Ca me fait vraiment l'impression d'une incompatibilité entre lui et moi quoi xD.
J'ai essayé de regarder une vidéo d'apprentissage du js, la toute première leçon, mais autant c'était parfois trop lent, autant y'avait des trucs qui restaient un peu vague, j'avais des questions, forcément je pouvais pas les poser, hein xD, donc j'essayais de comprendre l'ensemble, mais après deux semaines je ne me souvenais plus de rien...
Il faudra que je m'y remette. En plus concrètement je n'ai pas de questions qui me viennent là, c'est juste que j'y arrive pas quoi

EDIT : J'viens de voir que Sparrow-Style a posté avant moi, j'ai pas encore lu son message donc on a peut être des répétitions x)

Par rapport au javascript, et plus particulièrement par rapport au jQuery tu peux regarder sur Codecademy, ils ont traduit en français leur cours de jQuery --> http://www.codecademy.com/fr/tracks/jquery

Le principe c'est faire de petits exercices petit à petit avec de tous petits morceaux de cours donc tu avances doucement

Mais le javascript... Eh bien les gens ont tendance à tout mettre collé pour prendre le moins de place possible.

Pour ma part je sais que dans une demande d'entraide, j'ai tendance à ne pas donner en fonction de la tête du client... J'explique : il y a des gens, t'as vraiment la sensation qu'ils veulent savoir et progresser, donc tu prends le temps d'expliquer, d'autre t'as vraiment pas le courage de le faire s'ils demandent pas, car t'as l'impression que ça servira à rien x__x.
Par contre parfois il faut pas avoir peur de demander une explication, là plupart des gens ne le font pas simplement car ils savent que ça n'intéresse pas beaucoup de gens.
Si tu as un code qui est trop serré, où mal indenté, ou autre, tu peux le mettre sur ce site, ça t'aidera déjà à y voir plus clair : http://jsbeautifier.org/

Si tu regardes par exemple de LS de Manu https://www.never-utopia.com/t51011-ls-autres-sauvegarde-des-messages-en-cours tu verras qu'il fourni un code encore plus que minifié : le nom des variable est remplacé par une seule lettre, on va vraiment gagner un maximum de place. Par contre, tout en bas il met le lien vers le github où tu peux voir l'intégralité du code bien commenté (merci encore Manu !)

Dans un autre ordre d'idée, ce que je sais du javascript, c'est que c'est surtout lié aux évènements je crois. Je prends l'exemple d'un javascript qui fait une certaine action lorsque on clic sur un bouton ou lorsque l'heure est entre 0h et 6h du matin ou lorsque la taille de mon écran est plus grande que 1366px, etc... Il faut qu'il y ait un dénominateur ou une action pour enclencher le javascript. Du moins, c'est surtout dans ces cas là que je l'ai vu.

En même temps, il y a des javascript qui n'ont pas l'air vraiment d'agir après un évènement à moins que je sois trop stupide pour comprendre où sont les évènements en question, donc c'est sûrement pas la seule utilisation u_u

Il n'y a pas forcément d'évènements d'enclencheur en fait ^___^, ça dépend simplement de ce que tu veux faire.
Exemples où il n'y a pas besoin d'évènements :
- Changer la couleur du profil en fonction du groupe où le membre est
- Enlever les virgules dans la liste des sous forums

En fait ça dépend vraiment de ce que tu veux faire

Une chose qui je pense aussi est possible, c'est demander une explication du code qui te pose problème, peut être dans la partie "Problème", il y aura toujours quelqu'un pour t'aider à comprendre ^-^
Ou alors si tu cherches à transformer un js, je pense que tu peux faire une demande pour le faire avec quelqu'un sur le forum "Pas à pas" :)
En tout cas, pour ma part, si je vois une demande comme ça, je n'hésiterai pas à passer essayer d'aider si je peux, et je ne suis pas du tout la seule je pense :p
Je ne sais pas si c'est possible ici, mais sur un autre forum j'avais ouvert une demande d'aide avec une membre qui ressemblait plutôt à un cours. Elle m'expliquait ce qu'elle voulait faire, ce qu'elle savait déjà faire (c'était du HTML / CSS par rapport aux templates), et ensuite on travaillait ensemble sur comment elle pouvait y arriver. Le principe était que je ne lui faisait pas le code, je le faisait avec elle en lui donnant de petits trucs à faire, et si elle était vraiment coincée je lui expliquais le fonctionnement ^^

Moi j'avoue que c'est un peu comme le cap'taine U_U Le JS, j'ai commencé à le bosser sur codeacademy avec leur cursus de base qui est ma foi, pas trop mal foutu pour apprendre les fonctions, tout ça, et la logique de base, mais je ne vois pas comment tu peux coupler ça avec un design de forum par exemple. Genre, je peux te pondre un jeu de pierre/papier/ciseaux en JS (c'était l'un des TP, assez facile d'ailleurs) mais je serais incapable de te coder le plus petit onglet en JS. Je vois pas comment intégrer du JS dans un design ou un truc comme ça, du coup, je sais pas... ça me paraît incompatible alors que ça ne l'est pas.

Faudrait vraiment que je persévère et que je m'y remette U_U

Merci Scavenger pour tes liens ! Moi j'avais essayé le tuto du site du zéro mais enfin, il m'a fait décrocher au bout d'un moment et j'ai fini par tout oublier.
Comme j'ai appris le HTML / CSS au fur et à mesure que je montais mon forum, et que ça avait plutôt bien marché, j'avais décidé de faire de même pour le javascript. Sauf que... je n'en avais pas vaiment besoin, ou je n'en savais pas encore assez pour savoir ce qui était possible ou ne l'était pas. Pas vraiment optimal donc pour pratiquer régulièrement le JS enfin j'ai fini par trouver un "jeu", un peu débile certes, mais utilisant un langage très proche du JS.
(je vous fais ma page de pub) ce jeu s'appelle LeekWars. Oui vous avez bien lu, ça parle de poireaux. Le concept c'est de coder l'intelligence artificielle de son poireau pour battre les autres joueurs. Bref, ce jeu m'aurait permis de pratiquer / de me motiver... mais ça n'a pas suffi malheureusement.
Après aux dires de Nihil je comprends pourquoi je ne comprends rien sur les codes de FA ^^'
Je ne connaissais même pas l'existence de ce genre de compresseur, mais c'est sûr qu'ils ne facilitent pas la tâche aux apprentis !

Je connais bien leekwars ! xD
Mon prof et pas mal de mon école sont dessus et ils explosent un peu tout le monde. x_x

Edit: concernant le changement des variables par des lettres seuls et la mise du code entier sur une ligne, c'est surtout que ça optimise grandement l'exécution du code. Le navigateur lit caractère par caractère le code javascript pour l'interpréter. Et si vous supprimez le plus de caractères possible (le retour à la ligne est considéré comme un caractère) et bien vous augmentez la vitesse de lecture, pareil pour les noms de variables. :)

Salut!

Tant qu'à parler de javascript, je me demandais où trouver, errr, un espèce de sommaire des effets? Mouais, c'est mal dit ><

Vous savez, quand on voit des "fadeIn" ou des "FadeOut" et des "alert" et autres trucs du genre? Pour un débutant, c'est assez mélangeant de savoir qu'est-ce qui fait quoi ou même qu'est-ce qui existe ou pas. La plupart des sites d'apprentissage semblent partir du principe qu'on sait déjà que "alert(Bonjour)" te créé une alerte qui dit Bonjour et ainsi de suite. Sauf que moi, avant de tomber justement sur un site sur le javascript qui donnait ce type d'exemple, je ne savais même pas que "alert" existait. Donc, je me dis qu'il doit bien y avoir un répertoire ou un sommaire qui parle de ces effets et qui explique ce qu'ils font, non? Sauf que je ne trouve pas T_T

Je me dis que si on les trouve si souvent dans les exemple et tout, c'est que ce n'est peut-être pas du javascript, mais un autre langage que les gens s'attende à ce qu'on ait déjà appris avant. Sauf que moi, j'ai juste appris le CSS et le HTML en lisant des cursus et en regardant les codes des autres, je n'ai aucun autre background, alors je me demande justement où trouver le background nécessaire par rapport à ça ^^

D'ailleurs, dans le même ordre d'idées, vous connaissez aussi un répertoire où il y a un sommaire ou autre truc du genre des variables du genre "la largeur de l'écran", "l'heure de l'ordinateur", "la date de l'ordinateur", "les cookies du navigateurs", etc? Parce que quand je vois des tutos sur comment mettre une bannière différente de nuit ou de jour, je me dis "moi aussi je serais capable de créer un code comme ça!". Et c'est vrai en plus XD Sauf que là où je bloque, c'est qu'il faut que j'utilise une variable pour aller regarder l'heure de l'ordinateur, soit une variable que tout le monde en javascript a l'air de connaître sauf moi XD Bien sûr, quand je cherche sur Google, je finis souvent par trouver LA variable que je cherche. Sauf qu'un espèce de résumé de toutes les variables déjà existantes de ce type? Je trouve pas T_T

Et un répertoire de ces deux trucs serait tellement utile! Parce que pour des connaisseurs, c'est facile, ils savent ce qui existe ou pas et même s'ils ne se souviennent plus trop de comment ça s'écrit ou comment ça s'utilise, ils peuvent toujours aller voir sur Google. Sauf que pour des tout débutant comme moi, on ne sait même pas que ça existe, alors on n'y pensera même pas alors que ça pourrait nous faciliter la vie énormément u_u

Hello,
En fait, ce que tu voudrai n'existe pas, enfin, pas comme tu l'entend. Ces fonctions qui t'aident et te sont utiles sont des fonctions qui ont été créés pour un "objet". Je ne t'apprendrai pas ce qu'est un objet ici, ça me prendrait la page entière.
Mais disons que pour faire simple, un objet, c'est un ensemble de fonctions et de variable (un objet est aussi une variable.. donc un objet peut contenir un objet.. ne t'attarde pas là dessus x) ) regroupé autour d'une même utilité/thème créer soit par l'utilisateur, soit déjà existant dans le javascript ou dans une librairie que tu utiliserais avec (Exemple: jQuery).
Je n'ai pas de grand lexique regroupant toutes les fonctions de tous les objets sur ne page, mais par exemple, pour la fonction "alert", elle fait parti des fonctions de l'objet "window" qui est automatiquement créer par le javascript natif. Tu retrouvera dans ce lien toutes les fonctions (Ici appelé Methods) et ses variables (ici appelé Properties).

Tu as également ce site là qui est peut être un peu plus "jolie" et compréhensible : https://developer.mozilla.org/en-US/docs/Web/API

Et tu as bien fait de parler de fadeIn() et fadeOut(), ces deux fonctions font partie des objets de jQuery (la librairie dont je t'ai parlé plus tot) et n'est donc pas du javascript "de base". =)
Le mieux pour t'y retrouver dans le jQuery, c'est leur propre documentation: http://api.jquery.com/

Voila, j'espère t'avoir aidé. :)

Plop !

Je m'autorise à remonter le sujet pour étaler ma science et donner mon ressenti, parce qu'en fait je réalise que (à moins d'avoir mal lu) personne n'a fait remarquer que le javascript était un langage de programmation, alors que le CSS et le HTML sont des langages de description. Bref, ça n'a rien à voir, c'est peut-être pour ça qu'on peut trouver ça "plus compliqué" XD (c'est pas la même logique !).

Personnellement j'ai appris à programmer en PHP en autodidacte et en Java (à ne pas confondre avec le javascript) en formation, mais je n'ai jamais vraiment appris à programmer en javascript, qui en plus est un langage qui s'exécute côté client, du coup j'ai un peu de mal avec. Bon, une fois qu'on sait programmer, on peut se débrouiller, mais il faudrait vraiment que je me décide à suivre une vraie formation de A à Z. *lorgne vers le lien de Nihil*

Sinon, pour un langage de programmation, la documentation s'appelle une API. En général, ça décrit pour chaque fonction/méthode le nom, les paramètres et la donnée qui est retournée (si retour il y a). Le problème, c'est que les documentations de ce genre sont généralement en anglais.

J'ai aussi commis l'erreur fatale "d'apprendre" à me servir de JQuery avant de savoir me servir de Javascript, du coup je suis toujours à l'ouest quand je vois un code en javascript. Ah bah c'est malin 'Christa. Voilà voilà :o

Effectivement, apprendre le jQuery avant le JS c'est pas forcément le plus évident pour ensuite revenir sur du natif. ^-^'
Par contre, je ne sais pas où tu as vu qu'une API c'était de la documentation, mais ce n'est vraiment pas ça. xD
De la documentation, c'est de la documentation. Une API c'est une interface logiciel.

C'est un raccourci de langage de ma part, en fait, quand je cherche la doc pour un langage spécifique, je cherche la doc de l'API. Ou API Documentation. Ou API tout court. Au temps pour moi :p Mais bon, ça reste un bon mot clef à connaitre quand on fait une recherche google U.U

'Christa a écrit:personne n'a fait remarquer que le javascript était un langage de programmation, alors que le CSS et le HTML sont des langages de description. Bref, ça n'a rien à voir, c'est peut-être pour ça qu'on peut trouver ça "plus compliqué" XD (c'est pas la même logique !).

Tiens, j'avais pensé à le dire ça puis... Ca m'était sorti de la tête o^o. Merci de l'avoir ajouté ! C'est vrai que c'est une grosse différence, qui explique pourquoi pour beaucoup de gens ça semble compliqué... Alors que toute une partie du travail est simplement "de la logique" à avoir x)
Logique et connaissance (savoir ce qu'on peut faire ou non en javascript) (^-^).

'Christa a écrit:Bon, une fois qu'on sait programmer, on peut se débrouiller, mais il faudrait vraiment que je me décide à suivre une vraie formation de A à Z. *lorgne vers le lien de Nihil*

Je ne sais pas si Codecademy a beaucoup de chose à t'apprendre... Une grosse partie du cursus "Javascript" reprend simplement les bases de la programmation, et pour la partie jQuery ce sont les bases :p

Au final, comme toi, je passe davantage de temps sur la doc' que dans un cours réellement... x)

'Christa a écrit:J'ai aussi commis l'erreur fatale "d'apprendre" à me servir de JQuery avant de savoir me servir de Javascript, du coup je suis toujours à l'ouest quand je vois un code en javascript. Ah bah c'est malin 'Christa. Voilà voilà :o

Si tu veux t'amuser à faire des choses en js natif plutot qu'avec jQuery, ceci peut peut-être t'aider (^-^) : http://youmightnotneedjquery.com/
Perso je dois dire que j'ai souvent la flemme, et s'il y a déjà jQuery ou Zepto dans le code (un équivalent de jQuery en plus léger) bah... je les utilise

Hello !

Petit up, pour ceux qui veulent apprendre le JS, et qui aiment les vidéos, Grafikart a lancé une formation pour débuter le javascript !
Je n'ai pas du tout regardé, mais en général il fait des tutos où il prend le temps d'expliquer :)

EDIT :
Comme j'en parlais avec Shoki, voici des liens sur Codecademy :
https://www.codecademy.com/fr/learn/javascript
https://www.codecademy.com/fr/learn/jquery