Introduction aux compétences JavaScript_javascript-js tutoriel-php.cn

Cet article n'est pas un manuel de référence. Il convient uniquement pour acquérir une compréhension générale de JS. Si vous avez besoin d'une syntaxe détaillée et d'une application de JS, veuillez vous rendre sur w3school

Qu'est-ce que JavaScript ?

La naissance de JavaScript

Vers 1995, la bande passante grand public mondiale était de 28,8 Kbps, et maintenant la bande passante moyenne de téléchargement dans le monde est de 21,9 Mbps (les données proviennent de http://www.netindex.com). À cette époque, les internautes devaient attendre longtemps pour recevoir une réponse du serveur à chaque fois qu'ils soumettaient un formulaire. Il était même possible qu'après quelques minutes d'attente, la réponse qu'ils recevaient soit qu'un certain élément manquait. Afin d'améliorer l'expérience utilisateur, un script intégré dans le client du navigateur capable de réaliser un jugement de forme simple est né.

JavaScript a été développé pour la première fois par Brendan Eich, qui travaillait chez Netscape, pour Netscape Navigator 2.0 (NN2.0), qui devait sortir en 1995. Il s'appelait à l'époque LiveScript. Comme elle coopérait avec la très populaire société Sun à l'époque, afin de rattraper la tendance de l'époque - le langage Java, ce langage s'appelait JavaScript.

Quelle est la relation entre JavaScript et Java ?

C'est aussi la première réaction des profanes lorsqu'ils entendent JavaScript, et c'est aussi l'un des problèmes les plus critiqués de ce langage.

À proprement parler, cela n’a pas d’importance. Si nous devons établir un lien, peut-être que certaines fonctions, idées orientées objet, structures de jugement, instructions de boucle sont les mêmes, etc., mais ce ne sont évidemment pas des brevets de Java, mais le consensus des langages de programmation.

Standardisation JavaScript et historique du développement

Lorsque JavaScript a été lancé, le navigateur NN offrant une meilleure expérience utilisateur dominait le marché des navigateurs, et Microsoft a rattrapé son retard. Lorsque IE3 a été lancé, Microsoft a publié VBScript sous le nom de JScript, qui n'était en fait pas très différent du JavaScript de Netscape (un copieur dans les termes actuels). Face à la concurrence de Microsoft, Netscape et Sun ont soumis leurs projets JavaScript à l'ECMA (European Computer Manufacturers Association) pour normaliser JavaScript, et ont finalement créé la première version d'ECMAScript (ECMA-262).

Fait intéressant, après que Netscape ait standardisé JavaScript, des problèmes internes sont apparus et la recherche sur JavaScript a stagné. Microsoft a profité de l'occasion pour rattraper son retard et a lancé IE4, qui a intégré le premier moteur JavaScript conforme à la spécification ECMA avec un an d'avance. . De plus, les systèmes Microsoft occupent progressivement le marché des systèmes d'exploitation informatiques, et sa part de marché des navigateurs IE préinstallés augmente progressivement, et NN continue d'être évincé du marché. Cependant, lorsque Microsoft a perdu son plus grand rival, il a perdu la motivation de développer IE6 et IE8, qui étaient incompatibles en termes de rendu d'interface et d'exécution de scripts. Ils sont devenus une fleur étrange dans l'histoire des navigateurs et une malédiction pour le front-end. développeurs Cauchemar.

Copier le code Le code est le suivant :

v1 juin 1997 Première édition 

v2 juin 1998 Le format a été révisé pour rendre son format cohérent avec la norme internationale ISO/IEC16262 

v3 décembre 1999 Expressions régulières puissantes, meilleur traitement de la chaîne de texte, nouvelles instructions de contrôle, gestion des exceptions, définitions d'erreurs plus claires, formatage de la sortie numérique et autres changements 

La 4.v4 n'est pas terminée... peut-être une définition plus claire des classes, des espaces de noms, etc...

v5 décembre 2009 Ajout du "mode strict", un sous-ensemble utilisé pour fournir une vérification des erreurs plus approfondie afin d'éviter les erreurs structurelles. Clarifie de nombreuses spécifications ambiguës de la version 3 et s'adapte au comportement des implémentations réelles qui différaient systématiquement de cette spécification. Certaines nouvelles fonctionnalités ont été ajoutées, telles que les getters et setters, la prise en charge de JSON et une réflexion plus complète sur les propriétés des objets.

****En juin 2004, l'Association européenne des fabricants d'ordinateurs a publié la norme ECMA-357, qui est une extension d'ECMAScript. Elle est également appelée E4X (ECMAScript pour XML).

Quelle est la relation entre JavaScript et ECMAScript ?

En fait, la question devrait être de savoir quelle est la relation entre JavaScript, JScript et ECMAScript. En fait, ECMAScript est la spécification générale. JavaScript et JScript sont développés selon cette spécification et sont compatibles avec ECMAScript, mais incluent des fonctions au-delà d'ECMAScript. Cependant, quel que soit celui-ci, il est désormais communément connu sous le nom de JavaScript, simplement parce qu'il est apparu en premier et a eu la plus grande influence, et que son nom a été transmis jusqu'à ce jour.

Que peut faire JavaScript ?

Sur la page Web, toutes les opérations nécessitant un traitement logique peuvent être effectuées par JavaScript. Par exemple :

Copier le code Le code est le suivant :

• Validation du formulaire

•Effets d'animation 

•Jeux Web

•Compte à rebours 

•……

Il existe de très nombreuses applications, que je n'entrerai pas dans les détails ici. Je pense que vous trouverez de nombreuses applications après avoir appris cette langue.

Pourquoi devriez-vous apprendre JavaScript ?

1. Parce que vous n'avez pas le choix, seul JavaScript peut contrôler tous les navigateurs couramment utilisés, et JavaScript est l'un des langages de programmation les plus importants au monde. Pour apprendre la technologie Web, vous devez apprendre JavaScript.

2. JavaScript est un beau langage, c'est bien, donc il faut l'apprendre

Positionnement de JavaScript

Copier le code Le code est le suivant :

JavaScript est un langage de script léger qui ne nécessite pas de compilation et est analysé et exécuté par un moteur d'analyse JavaScript (fait généralement référence au navigateur, bien sûr sans exclure les analyseurs tels que node) 

JavaScript possède des fonctionnalités de langage non fonctionnelles, des fonctionnalités de langage fonctionnelles et des fonctionnalités de langage dynamiques, et sa syntaxe est très flexible

JavaScript est un langage de programmation orienté objet. Il y a un dicton dans le monde JavaScript : tout est un objet. Son héritage est basé sur l'héritage des prototypes (j'ai déjà écrit un article expliquant spécifiquement l'héritage des prototypes) 

JavaScript est un langage de type C, donc toute personne ayant appris le C peut facilement démarrer avec JavaScript

L'écriture de JavaScript ne nécessite pas de compilateur, mais seulement un éditeur de texte (le Bloc-notes n'est pas requis, un texte sublime est fortement recommandé ici)

Qu'est-ce que JavaScript a ?

Le JavaScript utilisé par tout le monde comprend désormais trois parties : DOM, BOM et ECMAScript (ou core js).

DOM

On suppose ici que tout le monde a au moins une certaine compréhension du HTML et du CSS. Si vous souhaitez ignorer directement le HTML et le CSS pour lire cet article, lisez d'abord ici.

DOM, modèle objet de document

Nous savons que XHTML exige que les balises soient fermées et imbriquées correctement. L'imbrication des balises crée une relation parent-enfant (ou relation ancêtre-descendant). Le DOM fournit un grand nombre d'API qui nous permettent d'exploiter facilement l'arborescence DOM. J'écrirai plus tard un article spécifiquement sur JS DOM.

En utilisant DOM, nous pouvons modifier dynamiquement le contenu des pages, ajuster les styles, etc. C'est aussi une manifestation de la diversité de JS.

BOM

BOM, modèle objet du navigateur

Similaire au DOM, sauf que le corps principal devient le navigateur. Le navigateur fournit également un grand nombre d'API, dont certaines sont ouvertes en JS, nous fournissant des méthodes pour faire fonctionner la fenêtre du navigateur.

Utilisations courantes :

Copier le code Le code est le suivant :

La possibilité d'ouvrir une nouvelle fenêtre de navigateur 

La possibilité de déplacer, fermer et modifier la taille de la fenêtre du navigateur 
 ;
Objet de navigation pouvant fournir des informations détaillées sur le navigateur WEB 

Un objet local qui peut fournir des informations détaillées sur la page chargée par le navigateur 
 ;
Un objet d'écran qui fournit des informations détaillées sur la résolution de l'écran de l'utilisateur 
 ;
Cookies de support ; 

Internet Explorer étend la nomenclature pour inclure des classes d'objets ActiveX, et les objets ActiveX peuvent être implémentés via JavaScript. 

Noyau ECMAScript

Également appelé noyau JS, peu importe comment vous l'appelez, la signification est la même. Ils représentent tous les composants essentiels du langage JS, y compris la définition des variables, le garbage collection, la syntaxe, la portée, etc. Contrairement au DOM et au BOM mentionnés ci-dessus, qui nécessitent uniquement l'utilisation de ces API, le noyau ECMAScript est l'essence du langage et nécessite une étude continue. Le chapitre suivant abordera plus en détail la syntaxe de JS.

Utilisation de JavaScript

En ligne

Inline est du JavaScript écrit en balises. Par exemple, nous écrivons en HTML :

Copier le code Le code est le suivant :

Lorsque nous cliquons sur le bouton, une boîte pop-up affichera « être cliqué ».
Mais notez que cela est fortement déconseillé, car cela entraînerait d'énormes problèmes de maintenance. Chaque fois que nous devons modifier l'événement, nous devons d'abord rechercher l'élément, puis modifier son contenu javascript, et ces codes javascript ne peuvent pas être réutilisés.

De plus, les événements écrits dans les balises doivent avoir « on », et les js ne peuvent être introduits dans les balises que via des événements, et les expressions js simples ne peuvent pas être écrites

Intégré

Embedded signifie écrire du code js dans la balise de script HTML. La méthode consiste à ajouter une nouvelle balise de script en HTML, puis à insérer l'un de vos codes js au milieu de la balise, comme suit :

Copier le code Le code est le suivant :

           Cliquez sur



<script><br>
<span style="font-family: Arial, Helvetica, sans-serif;">var btn = document.getElementById("btn");</span><pre name="code" class="javascript ">         btn.onclick = function() {<br>
alert("être cliqué");<br>
><br>
</script>

Si vous utilisez en ligne, vous êtes beaucoup plus libre qu'en ligne. Vous pouvez écrire plus de code, vous pouvez également éviter le problème des guillemets qui s'échappent et la maintenance devient plus facile. Mais il y a aussi un problème. Ces codes ne peuvent être appliqués qu’à cette page et ne peuvent pas être utilisés par d’autres pages.

Lien externe

La méthode des liens externes résout tous les défauts des deux formulaires ci-dessus. Voici comment procéder :

Créez d’abord un nouveau fichier et remplacez le suffixe par .js. Par exemple, nous créons un nouveau fichier click.js, puis copions le code js dans le inline que nous venons d'écrire (notez que la balise script n'est pas incluse)

Copier le code Le code est le suivant :

var btn = document.getElementById("btn");

btn.onclick = fonction() {

​​ alert("être cliqué");

>

Puis introduisez

en HTML via la balise script

Copier le code Le code est le suivant :

Cliquez sur

L'avantage est que le même code js peut être partagé par plusieurs pages HTML. L'inconvénient est que cela augmente le nombre de fichiers et augmente le temps requis pour les requêtes, la réutilisabilité du code devrait donc être améliorée et le les fichiers js doivent être fusionnés à la fin (fusionner différents fichiers js en un seul fichier js)