La différence entre les fonctions fléchées js et les fonctions ordinaires

Cet article vous présente principalement la différence entre les fonctions fléchées javascript et les fonctions ordinaires J'espère qu'il sera utile aux amis dans le besoin !

Les fonctions fléchées - une nouvelle fonctionnalité introduite dans ES6 - prennent en charge l'écriture de fonctions concises en JavaScript. Bien que les fonctions normales et les fonctions fléchées fonctionnent de la même manière, il existe des différences intéressantes entre elles, comme expliqué ci-dessous.

Syntaxe

Syntaxe des fonctions ordinaires :

let x = function function_name(parameters){ 
   // 函数体
};

Exemples de fonctions ordinaires :

let square = function(x){ 
  return (x*x); 
}; 
console.log(sqaure(9));

Sortie :

Syntaxe de la fonction flèche :

let x = (parameters) => { 
    // 函数体
};

Exemple de fonction flèche :

var square = (x) => { 
    return (x*x); 
}; 
console.log(square(9));

Sortie :

Utilisez ce mot-clé

Contrairement aux fonctions ordinaires, les fonctions fléchées Il y a non, cela lui est propre.

Par exemple :

let user = { 
    name: "GFG", 
    gfg1:() => { 
        console.log("hello " + this.name); 
    }, 
    gfg2(){        
        console.log("Welcome to " + this.name); 
    }   
 }; 
user.gfg1(); 
user.gfg2();

Sortie :

Disponibilité de l'objet arguments

Les objets arguments ne sont pas disponibles dans les fonctions fléchées, mais sont disponibles dans les fonctions normales.

Exemple de fonction normale :

let user = {       
    show(){ 
        console.log(arguments); 
    } 
}; 
user.show(1, 2, 3);

Sortie :

flèche Exemple de fonction :

let user = {      
        show_ar : () => { 
        console.log(...arguments); 
    } 
}; 
user.show_ar(1, 2, 3);

Sortie :

Utilisez le nouveau mot-clé

Les fonctions normales créées à l'aide de déclarations ou d'expressions de fonction sont « constructibles » et « appelables ». Puisque les fonctions normales sont constructibles, elles peuvent être appelées en utilisant le mot-clé 'new'. Cependant, les fonctions fléchées sont uniquement « appelables » et non constructibles. Par conséquent, nous obtiendrons une erreur d’exécution en essayant de construire une fonction fléchée non constructible à l’aide du nouveau mot-clé.

Exemple de fonction ordinaire :

let x = function(){ 
    console.log(arguments); 
}; 
new x =(1,2,3);

Sortie :

Exemple de fonction flèche :

let x = ()=> { 
    console.log(arguments); 
}; 
new x(1,2,3);

Sortie :

Recommandations associées : "tutoriel 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!