Définition de la fonction JavaScript

Les fonctions vous permettent de définir un bloc de code, de lui donner un nom et de l'exécuter plusieurs fois selon vos besoins.

Vous pouvez définir une fonction en utilisant le mot-clé function ou en exécutant une fonction avec l'opérateur ()

Déclaration de fonction

Dans la partie précédente de ce tutoriel, vous avez appris à utiliser la syntaxe suivanteDéclarationFonction :

function nameOfFunction(parameters) {
　　//　要执行的语句
}

Les fonctions déclarées ne s'exécutent pas immédiatement. Les fonctions déclarées ne font que nommer la fonction et spécifier les opérations à effectuer lorsque la fonction est appelée.

function greet() {}
　　　document.write("Hello, World !");
}

Dans l'exemple ci-dessus, nous avons déjà déclaré (défini) une fonction nommée greet qui affiche un message "Hello, World !" Vous pouvez appeler cette fonction avec l'opérateur () par exemple greet().

Expression de fonction

JavaScript nous permet deassigner une fonction à une variable, puis d'utiliser cette variable comme une fonction. Cela s'appelleExpression de fonction。

//Les expressions de fonction peuvent être stockées dans une variable
var sum = function(a, b) {
return a　+　b;
);
//　Cette variable peut être utilisée comme une fonction
var x = sum(100,　8);

La fonction ci-dessus est en réalité uneFonction anonyme(Fonction sans nom).

Les fonctions stockées dans une variable n'ont pas besoin de nom de fonction. Utilisez toujours le nom de la variable pour les appeler.

La fonction ci-dessus se termine par un point-virgule car elle fait partie d'une instruction exécutable.

Lèvement de la fonction

Dans la partie précédente de ce tutoriel, vous avez apprisLèvement JavaScript。

Le levage est le comportement par défaut de JavaScript qui déplace les déclarations à la tête de l'ensemble d'appel en cours.

Par conséquent, vous pouvez appeler la fonction JavaScript avant sa déclaration :

//　Appel de fonction avant déclaration
greet();
function greet() {}
　　document.getElementById("output").innerHTML = "Hello World";
}

自执行匿名函数

可以使函数表达式“自执行”。

自执行是一种JavaScript函数，它在定义后立即运行。

自动调用(启动)自执行表达式，而不需要调用它。也称为IIFE(立即调用的函数表达式)。

如果函数表达式后跟（），则函数表达式将自动执行。

(function () {
　　//　要执行的语句
})();

将IIFE分配给变量将存储函数的返回值，而不是函数定义本身：

let result = (function () {
let name = "Seagull";　
return name;　
})();　
//立即创建输出
result;　　　//　"Seagull"

下面的示例演示如何将参数传递给IIFE(立即调用的函数表达式)：

(function (x, y) {
　　document.getElementById("output").innerHTML = x　+　y;
})(5,　10);

回调函数

回调函数是作为参数传递给另一个函数的函数，然后在外部函数中调用它来完成某种例程或操作。

function greet(name) {
　　alert("Hello "　+　name);
}
function processInput(callback) {
　　let name = prompt("Please enter your name:");
　　callback(name);
}
//　将greet函数作为参数传递给processInput函数
processInput(greet);

上面的示例是一个同步回调，因为它将会立即执行。

递归

递归是一种迭代操作的技术，方法是使函数重复调用自身直到获得结果。

下面的示例使用递归获取数字的阶乘：

var factorial = function(number) {
　　if (number <= 0) {
　return　1;
　　} else {
　return (number　*　factoriel(number　-　1));
　　}
);
document.getElementById("output").innerHTML　=　factorial(5);

Fonction flèche

Jusqu'à présent, nous avons présenté comment définir une fonction en utilisant le mot-clé function.

Mais, depuis ECMAScript 6Début, il y a eu une mise à jour, une méthode plus concise pour définir une fonction appeléeFonction flèchede l'expressionFonction。

Il est bien connu que,Fonction flècheIl est représenté par un signe égal suivi d'un signe greater que : =>.

//Expression de fonction
var　sum　=　function(x,　y)　{
　　　return　x　+　y;
}
//　Fonction flèche
const　sum　=　(x,　y)　=>　x　+　y;

Les fonctions fléchées n'ont pas leur propre this. Elles ne conviennent pas pour définirMéthode d'objet。

Les fonctions fléchées ne sont pas élevées. Elles doivent être définies d'abord,Ensuite, utilisezIls.

Utiliser const est plus sûr que var, car l'expression de fonction est toujours constante.

Le mot-clé return et les accolades peuvent être omis uniquement lorsque la fonction est une seule instruction. Par conséquent, il peut être une bonne habitude de les conserver.

Le mot-clé return et les accolades peuvent être omis uniquement lorsque la fonction est une seule instruction. Il est donc toujours une bonne habitude de les conserver.

const　sum　=　(x,　y)　=>　{　return　x　+　y　};