Analyse approfondie de la déclaration et de l'appel des fonctions personnalisées JS

Une fonction est un ensemble de blocs de code réutilisables qui effectuent une tâche spécifique (ont une fonction spécifique). En plus d'utiliser des fonctions intégrées, nous pouvons également créer nos propres fonctions (fonctions personnalisées) puis appeler cette fonction si nécessaire. Cela évite non seulement d'écrire du code répété, mais facilite également la maintenance ultérieure du code.

Une : Plusieurs façons de déclarer des fonctions

Il existe trois façons de déclarer des fonctions personnalisées en JavaScript, à savoir en utilisant des instructions de fonction, en utilisant des constructeurs Function() et en définissant des littéraux de fonction.

1. Instruction de fonction

En JavaScript, vous pouvez utiliser l'instruction de fonction pour déclarer des fonctions. L'utilisation spécifique est la suivante :

function funName([args]) {
    statements
}

funName est le nom de la fonction, qui, comme le nom de la variable, doit être un identifiant JavaScript légal. Après le nom de la fonction se trouve une liste de paramètres entre parenthèses et séparés par des virgules. Les paramètres sont facultatifs et il n’y a pas de limite quant au nombre.

En tant qu'identifiants, les paramètres ne sont accessibles que dans le corps de la fonction et les paramètres sont des membres privés de la portée de la fonction. Lors de l'appel d'une fonction, transmettez une valeur à la fonction, puis utilisez des paramètres pour obtenir la valeur transmise en externe et intervenez dans l'exécution de la fonction dans le corps de la fonction.

Après les parenthèses se trouve une accolade. L'instruction contenue dans l'accolade est le contenu principal de la structure du corps de la fonction. Dans le corps de la fonction, les accolades sont essentielles. Sans accolades, JavaScript générera une erreur de syntaxe.

Exemple

L'instruction de fonction doit contenir le nom de la fonction, des parenthèses et des accolades, et d'autres codes peuvent être omis, de sorte que le corps de la fonction le plus simple est une fonction vide.

function funName() {}  //空函数

Si vous utilisez des fonctions anonymes, vous pouvez omettre le nom de la fonction.

function () {}  //匿名空函数

L'instruction var et l'instruction function sont toutes deux des instructions de déclaration. Les variables et fonctions qu'elles déclarent sont analysées lorsque JavaScript est précompilé, également connu sous le nom de promotion de variable et de promotion de fonction. Pendant la période de pré-compilation, le moteur JavaScript crée un contexte pour chaque fonction, définit un objet variable et enregistre tous les paramètres formels, variables privées et fonctions imbriquées dans la fonction en tant qu'attributs sur l'objet variable.

2. Constructeur Function()

Utilisez le constructeur Function() pour générer rapidement des fonctions. L'utilisation spécifique est la suivante : les types de paramètres de

var funName = new Function(p1, p2, ..., pn, body);

Function() sont tous des chaînes, p1~pn représente la liste de noms de paramètres de la fonction créée, body représente l'instruction de structure de fonction de la fonction créée et les instructions body sont séparés par des points-virgules.

Exemple 1

Vous pouvez omettre tous les paramètres et transmettre uniquement une chaîne pour représenter le corps de la fonction.

var f = new Function ("a", "b", "return a+b");  //通过构造函数来克隆函数结构

Dans le code ci-dessus, f est le nom de la fonction créée. La même fonction est définie et des fonctions avec la même structure peuvent être conçues à l'aide de l'instruction de fonction.

function f(a, b) {  //使用function语句定义函数结构
    return a + b;
}

Exemple 2

Utilisez le constructeur Function() pour créer une structure de fonction vide sans spécifier de paramètres.

var f = new Function();  //定义空函数

L'utilisation du constructeur Function() peut créer des fonctions de manière dynamique. Il ne limite pas les utilisateurs au corps de fonction pré-déclaré par l'instruction de fonction. L'utilisation du constructeur Function() permet d'utiliser la fonction comme une expression plutôt que comme une structure, elle est donc plus flexible à utiliser. L'inconvénient est que le constructeur Function() est compilé pendant l'exécution, l'efficacité d'exécution est très faible et son utilisation n'est généralement pas recommandée.

3. Fonction anonyme (fonction littérale)

La fonction littérale est également appelée fonction anonyme, c'est-à-dire que la fonction n'a pas de nom de fonction et ne contient que le mot-clé de la fonction, les paramètres et le corps de la fonction. L'utilisation spécifique est la suivante :

function ([args]) {
    statements
}

Exemple 1

Le code suivant définit un littéral de fonction.

function (a, b) {  //函数直接量
    return a + b;
}

Dans le code ci-dessus, les littéraux de fonction sont fondamentalement les mêmes que l'utilisation d'instructions de fonction pour définir les structures de fonctions, et leurs structures sont fixes. Cependant, la fonction littérale ne spécifie pas de nom de fonction, mais utilise directement le mot-clé function pour représenter la structure de la fonction. Ce type de fonction est également appelé fonction anonyme.

Exemple 2

Une fonction anonyme est une expression, c'est-à-dire une expression de fonction, pas une déclaration de structure de fonction. Ensuite, attribuez la fonction anonyme comme valeur à la variable f.

//把函数作为一个值直接赋值给变量 f
var f = function (a, b) {
    return a + b;
};

Lorsque la structure de fonction est affectée à une variable en tant que valeur, la variable peut être appelée en tant que fonction et la variable pointe vers la fonction anonyme.

console.log(f(1,2));  //返回值3

Exemple 3

Les fonctions anonymes servent de valeurs et peuvent participer à des opérations d'expression plus complexes. Pour l'exemple ci-dessus, vous pouvez utiliser le code suivant pour terminer l'opération intégrée de définition et d'appel de fonction.

console.log(  //把函数作为一个操作数进行调用
    (function (a,b) {
        return a + b;
    })(1, 2));  //返回数值3

4. Fonction flèche

La fonction flèche est l'abréviation de la fonction dans es6. La fonction flèche n'a pas son propre this. C'est déterminé lorsqu'elle est définie, et la valeur. est celui de la couche précédente.

//箭头函数
const sayName = ()=>{
    console.log("箭头函数")
}

二：调用函数

一旦定义好了一个函数，我们就可以在当前文档的任意位置来调用它。调用函数非常简单，只需要函数名后面加上一个括号即可，例如 alert()、write()。注意，如果在定义函数时函数名后面的括号中指定了参数，那么在调用函数时也需要在括号中提供对应的参数。

示例代码如下：

function sayHello(name){
    document.write("Hello " + name);
}
// 调用 sayHello() 函数
sayHello('PHP中文网');

提示：JavaScript 对于大小写敏感，所以在定义函数时 function 关键字一定要使用小写，而且调用函数时必须使用与声明时相同的大小写来调用函数。

【相关推荐：javascript学习教程】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!