Résumer et organiser la syntaxe de base de JavaScript

Auteur：Eve Cole Date de mise à jour：2022-08-08 08:55:00

Cet article vous apporte des connaissances pertinentes sur JavaScript, qui présentent principalement des problèmes liés à la syntaxe de base. JavaScript est le langage de script le plus populaire sur Internet. J'espère qu'il sera utile à tout le monde.

Introduction

JavaScript est le langage de script le plus populaire sur Internet. Ce langage peut être utilisé pour le HTML et le Web et peut être largement utilisé sur les serveurs, les PC, les ordinateurs portables, les tablettes, les smartphones et autres appareils.

Fonctionnalités de JavaScript

JavaScript est un langage de script.
JavaScript est un langage de programmation léger.
JavaScript est un code de programmation qui peut être inséré dans des pages HTML.
Lorsque JavaScript est inséré dans une page HTML, il peut être exécuté par tous les navigateurs modernes.
JavaScript est facile à apprendre.

JavaScript a été standardisé en tant que langage par l'ECMA (European Computer Manufacturers Association) via ECMAScript.

Année	Nom	Description
1997	ECMAScript 1	Première version
1998	ECMAScript 2	Modifications de version
1999	ECMAScript 3	Ajouter une expression régulière Ajouter try/catch
	ECMAScript 4	n'est pas publié.
2009	ECMAScript 5	ajoute le « mode strict » et le mode strict ajoute la prise en charge de JSON.
2011	ECMAScript	5.1
ajoute	des	classes et des modules.
2016	ECMAScript 7	ajoute un opérateur exponentiel (**). Ajoutez

l'utilisation de Array.prototype.includes.

Les scripts en HTML doivent être situés entre les balises <script> et </script>. Les scripts peuvent être placés dans les sections <body> et <head> d'une page HTML.

Souvent, nous devons exécuter du code lorsqu'un événement se produit, par exemple lorsque l'utilisateur clique sur un bouton. Si nous mettons le code JavaScript dans une fonction, nous pouvons appeler la fonction lorsque l'événement se produit.

Exemple 1 : fonction de script dans l'en-tête

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>script dans la balise head</title>
    <script>
        fonction maFonction() {
            document.getElementById("demo").innerHTML = "Ceci est ma fonction";
        }
    </script>
</tête>
<corps>
<h1>Ma fonction</h1>
<p id="demo">Un paragraphe</p>
<button type="button" onclick="myFunction()">Ceci est une fonction</button>
</corps>
</html>

Exemple 2 : fonction de script dans le corps

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>script dans le corps</title>
</tête>
<corps>
<h1>Ma fonction</h1>
<p id="demo">Ma fonction</p>
<button type="button" onclick="myFunction()">Cliquez</button>
<script>
    fonction maFonction() {
        document.getElementById("demo").innerHTML = "Ceci est ma fonction"
    }
</script>
</corps>
</html>

JavaScript peut également être placé en externe pour l'appel. Notez que l'extension externe est .js.

Exemple 3 : Appel externe JavaScriptExternal

call.js

function myFunction() {
    document.getElementById('demo').innerHTML = "Ceci est ma fonction"
}

Appeler un script externe

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Appel d'un script externe</title>
</tête>
<corps>
<p id="demo">Un paragraphe de texte</p>
<button type="button" onclick="myFunction()">Essayez-le</button>
<script src="script externe.js"></script>
</corps>
</html>

Sortie

JavaScript Les données peuvent être sorties de différentes manières :

utilisez window.alert() pour faire apparaître une boîte d'avertissement.
Utilisez la méthode document.write() pour écrire du contenu dans un document HTML.
Utilisez innerHTML pour écrire dans des éléments HTML.
Utilisez console.log() pour écrire dans la console du navigateur.

Exemple 1 : sortie de la fenêtre contextuelle aler()

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>sortie d'alerte</title>
</tête>
<corps>
<h1>sortie d'alerte</h1>
<script>
    fenêtre.alerte (5 + 6)
</script>
</corps>
</html>

Exemple 2 : sortie document.write()

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>sortie document.write</title>
</tête>
<corps>
<h1>sortie document.write</h1>
<script>
    document.write(Date());
    document.write("Bonjour,Web!");
</script>
</corps>
</html>

Exemple 3 : Écrire dans un document HTML

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Écrire dans un document HTML</title>
</tête>
<corps>
<h1>Écrire dans un document HTML</h1>
<script>
    fonction maFonction() {
        document.write("sortie de fonction");
    }
</script>
<button onclick="myFunction()">Cliquez ici</button>
</corps>
</html>

Exemple 4 : Utiliser console.log() pour écrire dans la console du navigateur

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Utilisez console.log() pour écrire dans la console du navigateur</title>
</tête>
<corps>
<h1>console.log() écrit dans la console du navigateur</h1>
<script>
    une = 5 ;
    b = 6 ;
    c = une + b ;
    console.log(c)
</script>
</corps>
</html>

Introduction à la syntaxe

JavaScript est un langage de script léger mais puissant.

Littéraux

Dans les langages de programmation, les valeurs généralement fixes sont appelées littéraux.

Nombre littéral : il peut s'agir d'un nombre entier, d'un nombre décimal ou d'une notation scientifique (e). Tels que 3.14, 5.88, etc.
Littéral de chaîne : " Vous pouvez utiliser des guillemets simples ou doubles. Tels que "Bonjour", "Web", etc.
Littéral d'expression : valeur fixe pour le calcul. 3 + 2,2, 3,14 * 2, etc.
Array (Array ) : Littéral : Définir un tableau. Tel que [1,2,3,4,5,6].
Objet : Littéral : Définissez un objet tel que {firstName : "John", lastName : "Doe", age : 50, eyeColor : "blue". "}.
Littéral de fonction : définissez une fonction. Par exemple, function myFunction(a, b) { return a * b;}.

Notez qu'en JavaScript, l'instruction doit se terminer par ";" .Variables JavaScrip

Dans

les langages de programmation, les variables sont utilisées pour stocker les valeurs des données. JavaScript utilise le mot-clé var pour définir les variables et utilise le signe égal pour attribuer des valeurs aux variables. Les variables peuvent fonctionner les unes sur les autres :

var y = false // Valeur booléenne var length = 16 ; // Nombre var points = x * 10 ; // Calcul du nombre var lastName = "Johnson" ; // Chaîne var cars = ["Saab", "Volvo", "BMW"] ; "John", lastName:"Doe"}; //

Fonction JavaScript

du dictionnaire d'objets

Afin de référencer à plusieurs reprises la même fonction et de réduire la commodité de l'écriture et de la maintenance du code, JavaScript fournit des fonctions de fonction, guidées par le mot-clé function :

function myFunc (un , b) {
    return a + b; // Renvoie le résultat de a+b}

Fonctionnalités JavaScript

Comparé à d'autres langages, JavaScript possède les fonctionnalités suivantes :

JavaScript est sensible à la casse.
JavaScript utilise le jeu de caractères Unicode.
JavaScript recommande d'utiliser la dénomination en casse chameau pour définir les variables et d'éviter les mots-clés dans la dénomination.
JavaScript est un langage faiblement typé et les variables sont définies à l'aide du mot-clé var.

classe

Mots-clés JavaScript (par ordre alphabétique)
abstrait	else	instanceof	super
boolean	enum	int	switch
break	export	interface	synchronisé
byte	extends	let	this
case	false	long	throw
catch	final	native	throws
char	enfin	nouvelle	transitoire
float	null	true	const
pour	le	package	essayez
de continuer	la fonction	privée	type
de débogueur	goto	protected	var
par défaut	si	public	void
delete	implémente	return	volatile
do	import	short	while
double	in	static	avec

commentaire JavaScript (identique à Java)

// Voici le code : commentaire en une seule phrase, généralement ctrl + L dans l'éditeur.

/* Voici le code*/ : commentaires sur plusieurs lignes, généralement ctrl + maj + L dans l'éditeur.

Déclarations

Les instructions JavaScript sont des commandes envoyées au navigateur, lui indiquant quoi faire. L'instruction JavaScript suivante génère le texte "Hello World!" dans l'élément HTML avec id="demo" :

document.getElementById("demo").innerHTML = "Hello World!";

Contrairement à Python, les blocs de code JavaScript sont tous dans In. accolades, c'est très similaire à Java.

Identifiant Java

Le bloc d'instruction Le commutateur

Identificateur JavaScript commun
Instruction	Description
break	est utilisé pour sortir d'une boucle.
catch	est exécuté lorsqu'une erreur se produit lors de l'exécution du bloc d'instruction try.
continue	saute une itération dans la boucle.
do ... while	exécute un bloc d'instructions et continue d'exécuter le bloc d'instructions lorsque l'instruction conditionnelle est vraie.
for	peut exécuter le bloc de code un nombre de fois spécifié lorsque l'instruction conditionnelle est vraie.
for ... in	est utilisé pour parcourir les propriétés d'un tableau ou d'un objet (boucler les propriétés d'un tableau ou d'un objet).
function	définit une fonction
if...else	pour effectuer différentes actions en fonction de différentes conditions.
de fonction de sortie	de retour
est	utilisé pour effectuer différentes actions en fonction de différentes conditions.
throw	renvoie (génère) une erreur.
try	implémente la gestion des erreurs et est utilisé avec catch.
var	déclare une variable.
while	Lorsque l'instruction conditionnelle est vraie, exécutez le bloc d'instruction.

La plupart des langages peuvent compléter automatiquement les espaces. Nous vous recommandons d'ajouter des espaces des deux côtés de l'opérateur pour le rendre clair et beau. Cependant, vous devez faire attention à l'utilisation des espaces en HTML et ne pas plaisanter. En JavaScript, les deux phrases suivantes sont identiques :

var a = 10;
var b=10;

Semblable à Python, JavaScript est également un langage de script et est interprété.

Objet

Définition Objet

Tout est un objet, une instance abstraite de caractéristiques parmi des objets ayant les mêmes caractéristiques. Comme Xiao Ming parmi les humains.

En JavaScript, un objet est un conteneur de variables d'attribut, semblable à un dictionnaire en Python ou à une carte de hachage en Java, qui définit les attributs de l'objet.

var personnes = {
    prénom : "Mike",
    Nom : "Smith",
    âge : "18",
    adresse : « Pékin »,
    métier : "Étudiant"
};

Ce qui précède est la définition de l'objet. Bien sûr, vous pouvez également l'écrire sur une seule ligne. Je le fais par souci de beauté, et j'exhorte tout le monde à écrire comme ça à l'avenir.

Pour accéder aux propriétés des objets,

nous pouvons dire "Les objets JavaScript sont des conteneurs pour les variables". Cependant, nous considérons généralement « les objets JavaScript comme des conteneurs de paires clé-valeur ». Les paires clé-valeur sont généralement écrites sous la forme clé : valeur (la clé et la valeur sont séparées par deux points). Les paires clé-valeur sont généralement appelées propriétés d'objet dans les objets JavaScript. Nous accédons également aux propriétés via le "." universel (la plupart des langues l'utilisent).

<!DOCTYPEhtml>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Voici le site Web</title>
</tête>
<corps>
<h1>Accéder aux attributs de classe</h1>
<!--L'instruction suivante doit précéder le script-->
<p id="démo"></p>
<script>
    var personnes = {
        prénom : "Mike",
        Nom : "Smith",
        âge : "18",
        adresse : « Pékin »,
        métier : "Étudiant"
    } ;
    document.getElementById("demo").innerHTML =
        people["firstName"] + "." + people.lastName;
</script>
</corps>
</html>

Deux méthodes d'accès, vous pouvez utiliser le nom de l'objet.property ou le nom de l'objet.["property"].

Fonction

Une fonction est un bloc de code événementiel ou réutilisable qui s'exécute lorsqu'il est appelé. Lorsque cette fonction est appelée, le code contenu dans la fonction est exécuté. Les fonctions peuvent être appelées directement lorsqu'un événement se produit (par exemple lorsque l'utilisateur clique sur un bouton) et peuvent être appelées de n'importe où par JavaScript.

Paramètres et valeurs de retour

Lorsque vous appelez une fonction, vous pouvez lui transmettre des valeurs, appelées paramètres, et il n'y a pas de limite au nombre de paramètres.

fonction maFonction( var1 , var2 )
{
code
}

Lors de l'appel de paramètres, ils doivent être transmis en stricte conformité avec leur ordre, comme indiqué ci-dessous :

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Ceci est un site Web JavaScript</title>
</tête>
<corps>
<h1>Problème de passage des paramètres de fonction</h1>
<p>Cliquez sur le bouton ci-dessous pour appeler</p>
<button onclick="myFunc('Mike','18','Beijing')">Cliquez ici</button>
<script>
    function myFunc(nom, âge, adresse) {
        alert("Je m'appelle " + nom + ", mon âge est " + âge + " et ma maison est à " + adresse);
    }
</script>
</corps>
</html>

Les fonctions JavaScript peuvent avoir des valeurs de retour et le mot-clé return est return. Lorsque la fonction renvoie une valeur, la fonction cessera de s'exécuter et les instructions suivant return ne seront pas exécutées.

Exemple : Calculer le produit de deux nombres et renvoyer le résultat

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Site Web JavaScript</title>
</tête>
<corps>
<h1>Calculez la valeur de deux nombres et retournez</h1>
<p id="démo"></p>
<script>
    fonction maFunc(a, b) {
        renvoyer un * b ;
    }

    document.getElementById("demo").innerHTML = myFunc(3, 4);
</script>
</corps>
</html>

Variables

Les variables JavaScript sont divisées en deux types :

Variables globales : Les variables déclarées en dehors de la fonction sont des variables globales , et tous les scripts et fonctions de la page Web peuvent y accéder.
Variables locales : une variable déclarée dans une fonction JavaScript (à l'aide de var) est une variable locale, elle n'est donc accessible qu'à l'intérieur de la fonction.

Lorsque nous attribuons une valeur à une variable JavaScript non déclarée, la variable sera automatiquement traitée comme une propriété de window. Par exemple, l'instruction suivante :

name = "Mike";

déclarera un nom d'attribut de fenêtre. Les variables globales créées en attribuant des valeurs à des variables non déclarées en mode non strict sont des attributs configurables de l'objet global et peuvent être supprimées. Par exemple :

var var1 = 1; // Les propriétés globales ne peuvent pas être configurées var2 = 2; // Sans déclaration var, les propriétés globales peuvent être configurées console.log(this.var1);
console.log(fenêtre.var1); // 1

delete var1 ; // false ne peut pas supprimer console.log(var1); //1 ;

supprimer var2 ; 
console.log(supprimer var2); // vrai
console.log(var2); // La variable d'erreur a été supprimée.

Description

de l'événement

non définie :

les événements HTML sont des événements qui se produisent sur les éléments HTML. Lorsque JavaScript est utilisé dans des pages HTML, JavaScript peut déclencher ces événements.

Les événements HTML peuvent être des actions du navigateur ou des actions de l'utilisateur. Voici des exemples d'événements HTM :

Le chargement de la page HTML est terminé.
champ de saisie HTML
est cliqué.

Normalement, lorsqu'un événement se produit, vous pouvez faire quelque chose. JavaScript peut exécuter du code lorsqu'un événement est déclenché. Les attributs d'événement peuvent être ajoutés aux éléments HTML et le code JavaScript peut être utilisé pour ajouter des éléments HTML.

Guillemets simples : < some-HTML-element some-event = ' Code JavaScript ' >
Guillemets doubles : < some-HTML-element some-event = " Code JavaScript " >

<!DOCTYPE html>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Événement JavaScript</title>
</tête>
<corps>
<h1>Deux façons de gérer les événements JavaScript</h1>
<p id="demoOne"></p>
<button onclick="getElementById('demoOne').innerHTML=Date()">Cliquez pour afficher l'heure 1</button>
<p id="demoTwo"></p>
<button onclick="this.innerHTML=Date()">Cliquez pour afficher l'heure 2</button>
</corps>
</html>

JavaScript est généralement du code multiligne, et le moins courant est appelé via les attributs d'événement.

<!DOCTYPEhtml>
<html lang="fr">
<tête>
    <méta charset="UTF-8">
    <title>Événement JavaScript</title>
</tête>
<corps>
<h1>Appel d'attribut d'événement JavaScript</h1>
<p>Cliquez pour exécuter la fonction <em>myFunc()</em></p>
<button onclick="myFunc()">Cliquez ici</button>
<p id="un"></p>
<script>
    fonction maFunc() {
        document.getElementById("one").innerHTML = Date();
    }
</script>
</corps>
</html>

Événements HTML courants
Description	de l'événement
onchange	L'élément HTML change
onclick	L'utilisateur clique sur l'élément HTML
onmouseover	L'utilisateur déplace la souris sur un élément HTML
onmouseout	L'utilisateur éloigne la souris d'un élément HTML
onkeydown	L'utilisateur appuie sur la touche du clavier
lors du chargement	Le navigateur a complété la page. D'autres événements continueront d'être appris après le chargement

Rôle d'événement

Les événements peuvent être utilisés pour gérer la validation du formulaire, la saisie de l'utilisateur, le comportement de l'utilisateur et les actions du navigateur :

les événements sont déclenchés lorsque la page est chargée,
les événements sont déclenchés lorsque la page est fermée,
l'utilisateur clique sur le bouton pour effectuer des actions
et pour vérifier la légitimité du contenu saisi par l'utilisateur,

plusieurs méthodes peuvent être utilisées pour exécuter du code d'événement JavaScript :

l'attribut d'événement HTML peut exécuter directement du code JavaScript.
L'attribut d'événement HTML peut appeler des fonctions JavaScript
.
Vous pouvez empêcher l'apparition d'événements.

String

: Une collection de caractères.

var a = "abc" ;
var b = "Bonjour" ;

Semblable à Python, chaque caractère de la chaîne est accessible à l'aide d'un index :

var c = b[1]; // e

length

Cette propriété peut calculer la longueur de la chaîne.

<!DOCTYPEhtml>
<html>
<tête>
    <méta charset="utf-8">
    <title>Longueur de la chaîne</title>
</tête>
<corps>
<script>
    var txtOne = "Bonjour tout le monde !";
    document.write("<p>" + txtOne.length + "</p>");
    var txtTwo = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
    document.write("<p>" + txtTwo.length + "</p>");
</script>
</corps>
</html>

JavaScript a également des caractères spéciaux. Par exemple, lorsque nous voulons imprimer des guillemets, nous devons ajouter "" pour échapper, sinon le compilateur ne peut pas les analyser.

d'espace arrière

de caractère spécial commun JavaScript
Sortie	du code
'	guillemet simple
"	guillemet double
\	barre oblique inverse
nline	feed
rcarriage	return
ttab	(caractère de tabulation)
	bcaractère
	fformfeed

chaîne de caractères en tant qu'objet

, généralement, les chaînes JavaScript sont des valeurs primitives et peut être créé en utilisant les caractères : var firstName = "Mike", mais nous pouvons également utiliser le mot-clé new pour définir une chaîne en tant qu'objet : var firstName = new String("Mike"), qui est similaire aux

de Java Similar.

propriété	description
constructeur	renvoie la fonction qui crée la chaîne propriété
longueur	renvoie la longueur de la chaîne
prototype	vous permet d'ajouter des propriétés et des méthodes à la

en majuscule

chaîne d'objet méthodes courantes
description	de la méthode
charAt()	renvoie le caractère à la position d'index spécifiée
charCodeAt()	renvoie Spécifier la valeur Unicode du caractère à la position d'index.
concat()	concatène deux chaînes ou plus et renvoie la chaîne connectée
fromCharCode()	convertit Unicode en chaîne
indexOf()	renvoie la position où le caractère spécifié apparaît pour la première fois. la chaîne.
lastIndexOf()	renvoie la position de la dernière occurrence du caractère spécifié dans la chaîne
localeCompare()	utilise un ordre spécifique local pour comparer deux chaînes
match()	trouve une correspondance d'une ou plusieurs expressions régulières
replace()	remplace par un expression régulière Sous-chaîne correspondante
search()	récupère la valeur qui correspond à l'expression régulière
slice()	extrait un fragment de la chaîne et renvoie la partie extraite dans une nouvelle chaîne
split()	divise la chaîne en un tableau de sous-chaînes
substr()	Extrait la chaîne spécifiée nombre de caractères dans la chaîne à partir de la
sous-chaîne du numéro d'index de départ ()	Extrayez les caractères entre les deux numéros d'index spécifiés dans la chaîne
toLocaleLowerCase ()	Convertissez la chaîne en minuscules en fonction des paramètres régionaux de l'hôte, il n'y a que quelques langues (comme le turc) ont un mappage de casse spécifique local
versLocaleUpperCase()	pour convertir les chaînes en majuscules en fonction des paramètres régionaux de l'hôte. Seules quelques langues (comme le turc) ont un mappage de casse spécifique local
versLowerCase()	pour convertir les chaînes.
Convertir en minuscule
toString()	Renvoie la valeur de l'objet chaîne
toUpperCase()	Convertit la chaîne en majuscule
trim()	Supprime les espaces de début et de fin de la chaîne
valueOf()	Renvoie la valeur originale d'un objet chaîne

== et === Différence

1. Pour les types de base tels que chaîne et nombre, il existe une différence

entre == et === a) Comparaison entre différents types, == compare les "valeurs après conversion vers le même type" pour voir si les "valeurs " sont égaux, === si le type S'ils sont différents, le résultat sera inégal.
b) Pour une comparaison du même type, une comparaison directe de "valeur" donnera le même résultat.

2. Pour les types avancés tels que Tableau et Objet, il n'y a aucune différence entre == et ===

pour la comparaison de « l'adresse du pointeur ».

3. Il existe une différence entre les types de base et les types avancés

a) Pour ==, convertissez le. type avancé au type de base et effectuer une comparaison de "valeur"
b) Comme les types sont différents, le résultat === est faux

4. != est la non-opération de ==, !== est la non-opération de = ==

var num=1;

var str="1";

vartest=1 ;

test == num //true même type et même valeur test === num //true même type et même valeur test !== num //false test a le même type que num, et sa valeur est également la même. la non-opération doit être fausse 

num == str //true Convertit str en nombre et vérifie s'il est égal. 

num != str //false == non-opération num === str //le type false est différent, renvoie false directement 

num !== str //true Les différents types de num et str signifient qu'ils ne sont pas égaux. La non-opération est naturellement vraie.

Opérateur

Opérateurs courants JavaScript (y=5)
Exemple	de description	de l'opérateur	x Résultat de l'opération	y Résultat de l'opération
+	ajout.	x =y+2	7	5
-Soustraction	x	=y-2	3	5
*	Multiplication	x=y*2	10	5
/	Division	x=y/2	2,5	5
%	modulo (reste)	x=y%2	1	5
++	incrément	x =++y	6	6
++	incrément	x=y++	5	6
--decrement	=	--y	4	4
--decrement	=	x=y--	5	4

Les opérateurs d'affectation courants JavaScript (x=10, y=5)
les exemples	d'opérateurs	sont équivalents aux	opérations Résultat
=	x =oui		x=5
+=	x+=y	x=x+y	x=15
-=	x-=y	x=xy	x=5
*=	x*=y	x=x*y	x=50
/=	x/=y	x= x/y	x=2
%=	x%=y	x=x%y	x=0

Opérateurs de comparaison courants JavaScript (x=5)
Valeur de retour	de comparaison de	description	de l'opérateur
==	égal à	x==8	false
==	égal à	x==5	true
= = =	Absolument égal (la valeur et le type sont égaux)	x==="5"	false
= = =	Absolument égal (la valeur et le type sont égaux)	x===5	true
!=	différent de	x!=8	true
!==	Pas absolument égal (l'un des valeurs et types n'est pas égal, ou les deux ne sont pas égaux)	x!=="5"	vrai
!==		x!==5	faux
>	supérieur à	x>8	faux
<	inférieur à	x<8	vrai
>=	supérieur ou égal à	x>=8	faux
<=	inférieur ou égal à	x<= 8	vrai
<=	inférieur ou égal à	x<=8	vrai

Opérateurs logiques courants JavaScript (x=6, y=3)
exemples	de description	d'opérateur
&&	et	(x < 10 && y > 1) est vrai
\|\|	ou	(x== 5 \|\| y==5) est faux
!	pas	!(x==y) est vrai

JavaScript contient également des opérateurs conditionnels qui attribuent des valeurs aux variables en fonction de certaines conditions. Par exemple :

variablename=(condition)?value1:value2

Jugement conditionnel

En JavaScript, nous pouvons utiliser les instructions conditionnelles suivantes :

instruction if - uniquement lorsque la condition spécifiée est vraie, utilisez cette instruction pour exécuter le code
if... else instruction - lorsque la condition Exécute le code lorsque la condition est vraie et tout autre code lorsque la condition est fausse
if...else if....else instruction - Utilisez cette instruction pour sélectionner l'un des multiples blocs de code pour exécuter
l'instruction switch - Utilisez cette instruction pour sélectionner plusieurs One des blocs de code pour exécuter

l'instruction if

exécutera le code uniquement lorsque la condition est vraie. Par exemple :

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <title>Site Web JavaScript</title>
</tête>
<corps>
<h1>Ceci est une instruction if</h1>
<button onclick="myFunc()">Cliquez ici</button>
<p id="un"></p>
<script>
    fonction maFunc() {
        varx = "";
        var time = new Date().getHours();
        si (temps < 20) {
            x = "Bonjour, Avant 20h00" ;
        }
        document.getElementById("one").innerHTML = x;
    }
</script>
</corps>
</html>

Instruction if...else

Utilisez l'instruction if...else pour exécuter du code lorsque la condition est vraie et un autre code lorsque la condition est fausse.

<!DOCTYPEhtml>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <title>Site Web JavaScript</title>
</tête>
<corps>
<h1>Il s'agit d'une instruction if...else</h1>
<button onclick="myFunc()">Cliquez ici</button>
<p id="un"></p>
<script>
    fonction maFunc() {
        varx = "";
        var time = new Date().getHours();
        si (temps < 20) {
            x = "Bonjour, Avant 20h00" ;
        }autre {
            x = "Bonjour, après 20h00" ;
        }
        document.getElementById("one").innerHTML = x;
    }
</script>
</corps>
</html>

Plusieurs instructions if..else

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <title>Site Web JavaScript</title>
</tête>
<corps>
<h1>Plusieurs instructions if...else</h1>
<button onclick="myFunc()">Cliquez ici</button>
<p id="un"></p>
<script>
    fonction maFunc() {
        varx = "";
        var time = new Date().getHours();
        si (temps < 12) {
            x = "Bonjour" ;
        } sinon si (temps < 14) {
            x = "Bon après-midi" ;
        }
        autre {
            x = "Bon après-midi" ;
        }
        document.getElementById("one").innerHTML = x;
    }
</script>
</corps>
</html>

instruction switch

Utilisez l'instruction switch pour sélectionner l'un des multiples blocs de code à exécuter. Par exemple :

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <title>Site Web JavaScript</title>
</tête>
<corps>
<h1>instruction switch</h1>
<button onclick="myFunc()">Cliquez ici</button>
<p id="un"></p>
<script>
    fonction maFunc() {
        varx = "";
        var time = new Date().getMonth();
        changer (heure) {
            cas 0 :
                x = « janvier » ;
                casser;
            cas 1 :
                x = « février » ;
                casser;
            cas 2 :
                x = « Mars » ;
                casser;
            cas 3 :
                x = « avril » ;
                casser;
            cas 4 :
                x = « Mai » ;
                casser;
            cas 5 :
                x = « Jeanne » ;
                casser;
            cas 6 :
                x = « juillet » ;
                casser;
            cas 7 :
                x = « août » ;
                casser;
            cas 8 :
                x = « septembre » ;
                casser;
            cas 9 :
                x = « octobre » ;
                casser;
            cas 10 :
                x = « novembre » ;
                casser;
            cas 11 :
                x = « décembre » ;
                casser;
            défaut:
                x = "ERREUR" ;
        }
        document.getElementById("one").innerHTML = x;
    }
</script>
</corps>
</html>

Boucle

JavaScript prend en charge différents types de boucles :

for - boucle un bloc de code un certain nombre de fois
for/in - boucle les propriétés de l'objet
while - boucle le bloc de code spécifié lorsque la condition spécifiée est vraie
do/while - également lorsque spécifié Lorsque la condition est vraie, boucle le bloc de code spécifié

pour la boucle

<!DOCTYPE html>
<html>
<tête>
    <méta charset="utf-8">
    <title>Boucle JavaScript</title>
</tête>
<corps>
<h1>Cliquez sur le bouton pour boucler le code 5 fois. </h1>
<button onclick="myFunc()">Cliquez ici</button>
<p id="démo"></p>
<script>
    fonction maFunc() {
        varx = "";
        pour (var je = 0; je < 5; je++) {
            x = x + "Le nombre est" + i + "<br>" ;
        }
        document.getElementById("demo").innerHTML = x;
    }
</script>
</corps>
</html>

fo /in boucle

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>
<p>Cliquez sur le bouton ci-dessous pour parcourir les attributs de personne de l'objet</p>
<button onclick="myFunc()">Cliquez ici</button>
<p id="un"></p>
<script>
    fonction maFunc() {
        soit x ;
        laissez texte = "" ;
        const personne = {
            prénom : "Bill",
            Nom : "Portes",
            âge : 56 ans
        } ;
        pour (x en personne) {
            texte = texte + " " + personne[x];
        }
        document.getElementById("one").innerHTML = texte;
    }
</script>
</corps>
</html>

boucle while

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>
<p>Cliquez sur le bouton et la sortie sera imprimée si i est inférieur à 5</p>
<button onclick="myFunc()">Cliquez ici</button>
<p id="one">Afficher ici</p>
<script>
    fonction maFunc() {
        soit x = "", je = 0;
        tandis que (i < 5) {
            x = x + "Ce numéro est" + i + "<br>" ;
            je++;
        }
        document.getElementById("one").innerHTML = x
    }
</script>
</corps>
</html>

boucle do/while

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>
<p>Cliquez sur le bouton pour imprimer un nombre inférieur à 5</p>
<button onclick="myFunc()">Cliquez ici</button>
<p id="un"></p>
<script>
    fonction maFunc() {
        soit x = "" ;
        soit je = 0 ;
        faire {
            x = x + "Le nombre est" + i + "<br>" ;
            je++;
        }
        tandis que (je < 5);
        document.getElementById("one").innerHTML=x;
    }
</script>
</corps>
</html>

Comparaison entre les boucles for et while

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>

<p>C'est FuncOne</p>
<button onclick="funcOne()">Cliquez sur funcOne</button>
<p id="one">funcOne est là</p>

<p>C'est FuncTwo</p>
<button onclick="funcTwo()">Cliquez sur funcTwo</button>
<p id="two">funcTwo est là</p>

<script>
    fonction funcOne() {
        nombres = [1, 2, 3, 4, 5, 6, 7, 8, 9] ;
        soit je = 0 ;
        laissez addRes = 0;
        tandis que (nombres[i]) {
            addRes += nombres[i];
            je++;
        }
        document.getElementById("one").innerHTML = addRes + "<br>";

    }

    fonction funcDeux() {
        nombres = [1, 2, 3, 4, 5, 6, 7, 8, 9] ;
        soit je = 0 ;
        soit mulRes = 1 ;
        pour (; nombres[i];) {
            mulRes *= nombres[i];
            je++;
        }
        document.getElementById("two").innerHTML = mulRes + "<br>";
    }
</script>

</corps>
</html>

Les instructions

break et Continue

break sont utilisées pour sortir des boucles. continue est utilisé pour sauter une itération dans une boucle.

<!DOCTYPEhtml>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>
<p>Voici les instructions continue et break</p>
<button onclick="funcOne()">Cliquez sur funcOne</button>
<p id="one">C'est funcOne</p>
<br>
<br>
<br>
<br>
<br>
<br>
<button onclick="funcTwo()">Cliquez sur funcTwo</button>
<p id="two">C'est funcTwo</p>
<script>
    fonction funcOne() {
        soit x = "" ;
        soit je = 0 ;
        pour (i = 0; i < 10; i++) {
            si (je < 5) {
                casser;
            }
            x = x + "Le nombre est" + i + "<br>" ;
        }
        document.getElementById("one").innerHTML = x;
    }

    fonction funcDeux() {
        soit x = "" ;
        soit je = 0 ;
        pour (je = 0; je < 10; je++) {
            si (je === 8) {
                continuer;
            }
            x = x + "Le nombre est" + i + "<br>" ;
        }
        document.getElementById("two").innerHTML = x;
    }
</script>

</corps>
</html>

typeof, null et undefined

utilisent l'opérateur typeof pour détecter le type de données de la variable.

<!DOCTYPEhtml>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>
<p id="un"></p>
<script>
    document.getElementById("one").innerHTML =
        type de "john" + "<br>" +
        type de 3.14 + "<br>" +
        type de faux + "<br>" +
        type de [1, 2, 3, 4] + "<br>" +
        typeof {nom : 'john', âge : 34} ;

</script>

</corps>
</html>

En JavaScript, un tableau est un type d'objet spécial. Par conséquent, typeof [1,2,3,4] renvoie l'objet.

null signifie vide, c'est-à-dire "rien". Lors de l'utilisation du type de détection, l'objet est renvoyé. Les objets peuvent être effacés en utilisant undefined.

<!DOCTYPEhtml>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>
<p>un :</p>
<p id="un"></p>
<p>deux :</p>
<p id="deux"></p>

<script>
    var personne = {firstName : "Bill", lastName : "Gates", âge : 50} ;
    var personne = nul ;
    document.getElementById("one").innerHTML = type de personne ;
    personne = non défini
    document.getElementById("two").innerHTML = type de personne ;
</script>

</corps>
</html>

propriété constructor

La propriété constructor renvoie le constructeur de toutes les variables JavaScript. Vous pouvez utiliser la propriété constructeur pour vérifier si l'objet est un tableau ou une date (contenant la chaîne "Date"), etc.

<!DOCTYPEhtml>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>

<p>L'attribut constructeur renvoie une variable ou un constructeur</p>
<p id="one">HRER</p>
<script>
    document.getElementById("un").innerHTML =
        "Bonjour".constructeur + "<br>" +
        3.14.constructeur + "<br>" +
        false.constructeur + "<br>" +
        [1, 2, 3].constructeur + "<br>" +
        {nom : "Bonjour", âge : 18}.constructor + "<br>" +
        nouveau Date().constructeur + "<br>" +
        fonction () {
        }.constructeur;
</script>

</corps>
</html>

Conversion de type

Les variables JavaScript peuvent être converties en nouvelles variables ou en d'autres types de données :

automatiquement converties par JavaScript lui-même
à l'aide des fonctions JavaScript

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>

<p>La méthode String() peut convertir des nombres en chaînes</p>
<p id="one">ICI</p>
<p>La méthode toString() peut convertir des nombres en chaînes</p>
<p id="two">ICI</p>
<script>
    soit x = 123 ;
    document.getElementById("one").innerHTML =
        Chaîne(x) + "<br>" +
        Chaîne(123) + "<br>" +
        Chaîne (100 + 23);
    document.getElementById("deux").innerHTML =
        x.toString() + "<br>" +
        (123).toString() + "<br>" +
        (100 + 123,2).toString();
</script>

</corps>
</html>

Opérateur unaire+

Operator+ peut être utilisé pour convertir des variables en nombres :

<!DOCTYPE html>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>

<P>L'opérateur typeof renvoie le type de variable ou d'expression</P>
<button onclick="myFuncOne()">CLIQUEZ ICI UN</button>
<p id="one">ICI</p>
<button onclick="myFuncTwo()">CLIQUEZ ICI DEUX</button>
<p id="two">ICI</p>
<script>
    fonction maFuncOne() {
        soit y = "5" ;
        soit x = +y ;
        document.getElementById("one").innerHTML =
            type de y + "<br>" + x + "<br>" + type de x ;
    }

    fonction myFuncTwo() {
        let a = "Bonjour" ;
        soit b = +a ;
        document.getElementById("deux").innerHTML =
            type de a + "<br>" + b + "<br>" + type de b;
    }

</script>
</corps>
</html>

conversion

Conversion de type JavaScript
de valeur primitive	en nombre	conversion en chaîne	conversion en valeur booléenne
false	0	"false"	false
true	1	"true"	true
0	0	"0"	false
1	1	"1"	true
"0"	0	"0 "	vrai
"000"	0	"000"	vrai
"1"	1	"1"	vrai
NaN	NaN	"NaN"	faux
Infini Infini	"	Infini"	vrai
-Infini	-Infini	"-Infini"	vrai
""	0	""	faux
"20"	20	" 20 "	vrai
"Runoob"	NaN	"Runoob"	vrai
[ ]	0	""	vrai
[20]	20	"20"	vrai
[10,20]	NaN	"10,20"	vrai
["Runoob"]	NaN	"Runoob"	vrai
["Runoob " ,"Google"]	NaN	"Runoob,Google"	true
function(){}	NaN	"function(){}"	true
{ }	NaN	"[object Object]"	true
null	0	"null"	false
undefined	NaN	"undefined"	false

Expression régulière

L'expression régulière (anglais : Regular Expression, souvent abrégée en regex, regexp ou RE dans le code) utilise une seule chaîne pour décrire et faire correspondre une série de modèles de recherche de chaîne conformes à une certaine règle de syntaxe.

search()

est utilisé pour récupérer une sous-chaîne spécifiée dans une chaîne ou pour récupérer une sous-chaîne qui correspond à une expression régulière et renvoie la position de départ de la sous-chaîne.

<!DOCTYPEhtml>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <méta http-equiv="x-ua-compatible" content="IE=edge">
    <titre>Titre</titre>
</tête>
<corps>

<p>Récupérer la chaîne, faire correspondre la position</p>

<button onclick="myFuncOne()">CLIQUEZ ICI UN</button>
<p id="one">ICI</p>

<button onclick="myFuncTwo()">CLIQUEZ ICI DEUX</button>
<p id="two">ICI</p>

<script>
    fonction maFuncOne() {
        let str = "Bonjour, le monde !";
        document.getElementById("one").innerHTML = str.search(/World/i);
    }

    fonction myFuncTwo() {
        let str = "Bienvenue en Chine !";
        document.getElementById("two").innerHTML = str.search("Chine");
    }
</script>

</corps>
</html>

replace()

est utilisé pour remplacer certains caractères par d'autres caractères dans une chaîne, ou pour remplacer une sous-chaîne qui correspond à une expression régulière.

<!DOCTYPEhtml>
<html lang="zh-CN">
<tête>
    <méta http-equiv="content-Type" charset="UTF-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<p> Expression régulière Remplacement () Remplacement </p>

<bouton onclick = "myfuncone ()"> cliquez sur un </fontificateur>
<p id = "one"> Bonjour, java </p>

<bouton onclick = "myfunctwo ()"> cliquez sur deux </fontières>
<p id = "deux"> Bonjour, java </p>

<script>
    fonction myfuncone () {
        Soit str = document.getElementById ("un"). innerHTML;
        document.getElementById ("One"). InnerHtml = str.replace (/ java / i, "python");
    }

    fonction myfunctwo () {
        Soit str = document.getElementById ("Two"). InnerHtml;
        document.getElementById ("Two"). InnerHtml = str.replace ("java", "javascipt");
    }
</script>

</corps>
</html>

Motion d'expression régulière

Modificateur d'expression régulière
Modificateur	Description
I	Effectue la correspondance insensible au cas.
G	effectue un match mondial (trouve tous les matchs au lieu de s'arrêter après la découverte du premier match).
M	effectue une correspondance multi-lignes.

Expression régulière Expression du caractère spécial
Description	[
ABC]	trouve n'importe quel caractère entre les crochets.
[0-9]	trouve un nombre de 0 à 9.
(x \| y)	trouve toutes les options séparées par \|.

Expression régulière Quantifier
Quantificateur	Description
n +	correspond à toute chaîne contenant au moins un n .
N *	correspond à toute chaîne contenant zéro ou plus n .
n	?

Test ()

est utilisé pour détecter si une chaîne correspond à un certain motif.

<!DOCTYPEhtml>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<script>
    Soit obj = new regexp ("e");
    Soit boolone = obj.test ("Bonjour, c'est javascript");
    Soit booltwo = obj.test ("c'est javascript");
    Document.Write (boolone + "<br>" + booltwo);
</script>

</corps>
</ html>

exec ()

est utilisé pour récupérer des correspondances d'expressions régulières dans une chaîne. Si aucune correspondance n'est trouvée, la valeur de retour est nul.

<!DOCTYPEhtml>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<script>
    Soit obj = new regexp (/ e /);
    resone = obj.exec ("Bonjour, c'est javascript");
    restwo = obj.exec ("c'est javascript");
    / * Aucun moyen nul * /
    document.write (resone + "<br>" + restwo);
</script>

</corps>
</html>

Erreur

Type d'erreur

d'exception

Lorsque le moteur JavaScript exécute le code JavaScript, diverses erreurs se produiront.
Il peut s'agir d'une erreur de syntaxe, généralement une erreur de codage ou une faute de frappe faite par le programmeur.
Cela pourrait être une erreur d'orthographe ou une fonctionnalité manquante dans la langue (peut-être en raison des différences de navigateur).
L'erreur peut être due à une sortie incorrecte du serveur ou de l'utilisateur.
Bien sûr, cela pourrait également être dû à de nombreux autres facteurs imprévisibles.

Try ... Catch

Instruction Try nous permet de définir un bloc de code qui est testé pour les erreurs pendant l'exécution, et l'instruction Catch nous permet de définir un bloc de code qui est exécuté lorsqu'une erreur se produit dans le bloc de code d'essai.

<!DOCTYPEhtml>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<entrée type = "bouton" value = "Message de vue" onclick = "myfunc ()">
<script>
    Selt txt = "";

    fonction myfunc () {
        essayer {
            alert111 ("bonjour, monde!")
        }
        catch (err) {
            txt = "Il y a une erreur ici  n  n";
            txt + = "Erreur Description:" + err.message + " n  n";
            txt + = "Cliquez sur OK pour continuer  n  n";
            alerte (txt)
        }
    }
</script>

</corps>
</html>

Jetez

l'instruction Throw nous permet de créer des erreurs personnalisées. Le terme technique correct est: créer ou lancer une exception. Si vous utilisez Throw avec Try and Catch, vous pouvez contrôler le flux du programme et générer des messages d'erreur personnalisés.

<!DOCTYPEhtml>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<p> Veuillez saisir un nombre entre 5-10 </p>
<étiquette pour = "ONE"> </ Label> <Input id = "One" type = "Text">
<bouton type = "bouton" onclick = "myfunc ()"> Cliquez sur </fontificateur>
<p id = "message"> ici </p>

<script>
    fonction myfunc () {
        Laissez le message;
        Laissez x;
        message = document.getElementById ("message");
        message.innerhtml = "";
        x = document.getElementById ("un"). valeur;
        essayer {
            if (x === "")
                Jetez "la valeur est vide";
            if (isnan (x))
                lancer "pas un nombre";
            x = nombre (x);
            si (x <5)
                jeter "trop petit";
            if (x> 10)
                jeter "trop grand";
        } attraper (erreur) {
            message.innerhtml = "erreur" + erreur;
        }
    }
</script>

</corps>
</ html>

Appel de fonction

Il existe quatre façons d'appeler les fonctions JavaScript. D'une manière générale, en JavaScript, cela pointe vers l'objet actuel lorsque la fonction est exécutée.

Appel 1: Appelez en fonction

une

fonction myfunc (a, b) {
    retourner a * b;
}

MyFunc (1

);

    retourner a * b;
}

window.myfunc (1, 2

;

<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<p> Fonctions appelées méthodes </p>
<p id = "one"> ici </p>

<script>
    Laissez myObject = {
        Firstname: "Bill",
        LastName: "Gates",
        fullName: function () {
            return this.firstname + "" + this.lastName;
        }
    } ;
    document.getElementById ("One"). InnerHtml = myObject.FullName ();
</script>

</corps>
</html>

Appelez 3: Utilisez le constructeur pour appeler la fonction

<! doctype html>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<p> Dans cet exemple, MyFunc () est le constructeur de la fonction </p>
<p id = "one"> </p>
<script>
    fonction myfunc (argone, argtwo) {
        this.name = argone;
        this.number = argtwo;
    }

    Laissez x = nouveau myfunc ("bonjour", 123);
    document.getElementById ("One"). InnerHtml = x.name;
</script>

</corps>
</html>

Appelez 4: appelez la fonction comme méthode de fonction

<! doctype html>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<p> Fonctions d'appel comme méthodes de fonction </p>
<p id = "one"> ici </p>

<script>
    Soit Obj, Array;

    fonction myfunc (a, b) {
        retourner a * b;
    }

    Array = [5, 6];
    obj = myfunc.Apply (obj, array);
    document.getElementById ("One"). InnerHtml = obj;
</script>

</corps>
</html>

Fonctions intégrées

de fermeture

en fait, en JavaScript, toutes les fonctions peuvent accéder à la portée de leur niveau supérieur. JavaScript prend en charge les fonctions imbriquées et les fonctions imbriquées peuvent accéder aux variables de fonction du niveau supérieur. La fonction en ligne plus () peut accéder à la variable de compteur de la fonction parent:

<! Doctype html>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<p> Fonctions en ligne </p>
<p id = "one"> ici </p>

<script>
    document.getElementById ("One"). InnerHtml = add ();

    fonction ajouter() {
        LET COURT = 0;

        function plus () {
            compteur + = 1;
        }

        plus();
        compteur de retour;
    }
</script>

</corps>
</html>

L'auto-invocation de la

fonction

de fermeture

est appelée bibao

<! doctype html>
<html lang = "zh-cn">
<tête>
    <méta http-equiv = "contenu-type" charset = "utf-8">
    <meta http-equiv = "x-ua compatible" content = "ie = edge">
    <titre>Titre</titre>
</tête>
<corps>

<p> Compteur local </p>
<Button Type = "Button" onClick = "MyFunc ()"> COMPTERNET </FITCHE>
<p id = "one"> ici </p>

<script>
    Soit Add = (function () {
        LET COURT = 0;
        fonction de retour () {
            Retour compteur + = 1;
        }
    })();

    fonction myfunc () {
        document.getElementById ("One"). InnerHtml = add ();
    }
</script>
</corps>
</html>