Une introduction à la différence entre var foo = function () {} et function foo() lors de la définition d'une fonction en JavaScript (tutoriel détaillé)

Cet article présente principalement la différence entre var foo = function () {} et function foo() lors de la définition d'une fonction en JavaScript. Les amis qui en ont besoin peuvent s'y référer

Un jour où j'écrivais. code, j'ai soudainement eu cette question, résumons une vague de

Le comportement de « levage » des déclarations de fonctions et de variables JavaScript

En termes simples, si nous utilisons des fonctions anonymes

var a = {}

De cette façon, la déclaration de variable a sera "avancée" après la compilation, mais son affectation (c'est-à-dire a) ne sera pas avancée.

C'est-à-dire que la fonction anonyme n'est initialisée que lorsqu'elle est appelée.

Si vous utilisez

function a () {};

, la déclaration de la fonction et son affectation seront avancées après compilation.

C'est-à-dire que le prétraitement du processus de déclaration de fonction est terminé avant que l'ensemble du programme ne soit exécuté, donc tant qu'il est dans la même portée, il est accessible, même s'il est appelé avant la définition .

En regardant un exemple

function hereOrThere() { //function statement
  return 'here';
}
console.log(hereOrThere()); // alerts 'there'
function hereOrThere() {
  return 'there';
}

nous constaterons que l'instruction alert(hereOrThere) sera alert('there') exécutée ! Le comportement ici est en fait très inattendu.La raison principale est le comportement "précoce" des déclarations de fonctions JavaScript. En bref, JavaScript nous permet d'utiliser des variables et des fonctions avant qu'elles ne soient déclarées, et la deuxième définition remplace la première. En d'autres termes, une fois le code ci-dessus compilé, il équivaut à

function hereOrThere() { //function statement
 return 'here';
}
function hereOrThere() {//申明前置了，但因为这里的申明和赋值在一起，所以一起前置
 return 'there';
}
console.log(hereOrThere()); // alerts 'there'

Le comportement que nous attendons

var hereOrThere = function () { // function expression
  return 'here';
};
console.log(hereOrThere()); // alerts 'here'
hereOrThere = function () {
  return 'there';
};

Une fois ce programme compilé, il équivaut à :

var hereOrThere；//申明前置了
hereOrThere = function() { // function expression
 return 'here';
};
console.log(hereOrThere()); // alerts 'here'
hereOrThere = function() {
 return 'there';
};

Ci-dessus, je l'ai compilé pour tout le monde. J'espère qu'il sera utile à tout le monde à l'avenir.

Articles connexes :

Méthode Vue2.0 pour implémenter les conseils d'invite de navigation dans les pages

vue2.0 change de style en fonction de la valeur d'état Afficher méthode

Comment implémenter une application de prise de notes à l'aide de Vuex

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!