Maison > interface Web > js tutoriel > Comment créer une fonction à partir d'une chaîne en JavaScript ?

Comment créer une fonction à partir d'une chaîne en JavaScript ?

王林
Libérer: 2023-08-28 12:49:10
avant
1378 Les gens l'ont consulté

如何在 JavaScript 中从字符串创建函数?

Créer une fonction à partir d'une chaîne en JavaScript peut être utile lorsque vous devez générer dynamiquement une fonction au moment de l'exécution ou si vous disposez d'une chaîne contenant du code pour une fonction que vous souhaitez exécuter.

La possibilité de construire des fonctions à partir de chaînes est une fonctionnalité utile de JavaScript qui permet de créer dynamiquement des fonctions au moment de l'exécution. La fonction eval() et la nouvelle fonction Function() Object() [code natif] sont les deux façons les plus populaires de procéder, bien que toutes deux présentent des failles de sécurité importantes.

Function.prototype.constructor est une option plus sûre, bien qu'elle soit moins connue. Avant de choisir une approche JavaScript pour créer des fonctions à partir de chaînes, il est important de considérer les risques et les cas d'utilisation.

Méthode 1 : utilisez la fonction eval()

La méthode JavaScript eval() est l'un des moyens les plus simples de créer une fonction à partir d'une chaîne. Cette puissante fonction eval() peut exécuter n'importe quel code JavaScript qui lui est fourni sous forme de chaîne.

Exemple

<html>
<body>
   <p id="result"></p>
   <script>
      let functionString = "function add(a, b) { return a + b; }";
      let add = eval("(" + functionString + ")");
      document.getElementById("result").innerHTML = "Sum of 1 and 2: " + add(1, 2);
   </script>
</body>
</html>
Copier après la connexion

Ici, nous pouvons voir que nous avons une fonction qui prend deux paramètres et renvoie leur somme. Désormais, cette fonction est contenue dans une chaîne. La fonction eval() reçoit cette chaîne en paramètre et l'évalue avant de renvoyer la fonction. La fonction renvoyée est ensuite affectée à une variable nommée add qui peut être utilisée comme n'importe quelle autre fonction.

Cependant, il exécute tout code JavaScript qui lui est transmis, donc son utilisation dans le code de production peut être risquée car elle peut entraîner des failles de sécurité.

Méthode 2 : utiliser le nouveau constructeur Function()

Une autre façon de créer une fonction à partir d'une chaîne en JavaScript consiste à utiliser le constructeur Function(). Le constructeur Function() crée un nouvel objet fonction à partir d'une chaîne contenant le code de la fonction. Voici un exemple de comment créer une fonction à partir d'une chaîne à l'aide du constructeur Function() -

Exemple

<html>
<body>
   <p id="print"></p>
   <script>
      let functionString = "function add(a, b) { return a + b; }";
      let functionBody = functionString.substring(
         functionString.indexOf("{") + 1,
         functionString.lastIndexOf("}")
      );
      let add = new Function("a", "b", functionBody);
      document.getElementById("print").innerHTML = "Sum of 1 and 2: " + add(1, 2);
   </script>
</body>
</html>
Copier après la connexion

Dans cet exemple, nous transmettons une chaîne contenant le code de la fonction au constructeur Function(), qui crée un nouvel objet fonction à partir de la chaîne. Nous affectons ensuite la fonction renvoyée à la variable add, qui peut être utilisée comme n'importe quelle autre fonction.

Comme il ne peut créer que des fonctions, il est moins risqué que eval(), mais présente toujours des risques similaires

Méthode 3 : utilisez Function.prototype.constructor

Cela génère une fonction et ne peut exécuter aucun autre code que le corps de la fonction passé sous forme de chaîne. Cependant, elle est moins largement utilisée et n’est pas aussi prise en charge par les anciens navigateurs que les deux autres méthodes.

Exemple

<html>
<body>
   <p id="result"></p>
   <script>
      let add = Function.prototype.constructor('a', 'b', 'return a+b')(1, 2);
      document.getElementById("result").innerHTML = "Sum: " + add;
   </script>
</body>
</html>
Copier après la connexion

Dans cet exemple, les paramètres de fonction et le corps de la fonction sont fournis au constructeur. Nous utilisons Function.prototype.constructor pour créer une nouvelle fonction avec les paramètres donnés et le corps de fonction donné, puis appelons immédiatement la fonction en appelant la fonction avec les paramètres donnés

N'oubliez pas que la fonction que vous construisez à partir d'une chaîne aura accès à la portée globale et ne sera pas incluse dans la portée du code à partir duquel vous la créez.

Une autre chose importante à retenir est que la création de fonctions à partir de chaînes peut ralentir votre application, surtout si le corps de la fonction est long.

De plus, si la fonction est complexe, la construction de la fonction à partir d'une chaîne rend plus difficile la compréhension et le débogage du code.

En raison de problèmes de sécurité, il n'est généralement pas recommandé d'utiliser les méthodes eval() et new Function() dans le code de production. Au lieu de cela, vous devriez envisager d'autres options, telles que des fonctions de précompilation ou l'utilisation d'un préprocesseur JavaScript comme Babel pour transformer votre code en une version équivalente et plus sûre.

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!

source:tutorialspoint.com
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal