Maison  >  Article  >  interface Web  >  La différence entre les fonctions fléchées js et les fonctions ordinaires

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

藏色散人
藏色散人original
2019-04-13 10:45:084218parcourir

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 :

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

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 :

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

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 :

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

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 :

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

flèche Exemple de fonction :

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

Sortie :

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

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 :

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

Exemple de fonction flèche :

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

Sortie :

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

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn