Plusieurs façons de définir des fonctions en JS-js tutoriel-php.cn

Plusieurs façons de définir des fonctions en JS

青灯夜游

Libérer： 2020-10-20 17:21:22

avant

4396 Les gens l'ont consulté

Plusieurs façons de définir des fonctions en JS

Savez-vous combien de façons il existe de créer une fonction en JavaScript ? L'article suivant vous présentera plusieurs méthodes différentes pour définir des fonctions en JavaScript. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

1. Fonction de déclaration

function sum(a, b) { return a + b; }

Copier après la connexion

2. Fonction d'expression

// 可以命名:
(function sum(a, b) { return a + b; });

// 也可匿名 (AVOID):
(function(a, b) { return a + b; });

// 也能分配给变量：
const sum = function sum(a, b) { return a + b; })

Copier après la connexion

1. 🎜>

3. Fonction flèche

// 一般形式:
(a, b) => { return a + b };

// 单参数，一行返回：
name => name.split(' ')

// 多参数，一行返回：
(a, b) => a + b

// 单参数，带函数体
name => { return name.split(' '); }

Copier après la connexion

4. Fonction générateur

function *sum(a, b) { yield a + b; }

Copier après la connexion

5. Fonction asynchrone

async function sum(a, b) { return await a + b; }

Copier après la connexion

6. Constructeur (ÉVITER)

new Function(‘a’, ‘b’, ‘return a + b;’);

Copier après la connexion

7. Fonction d'exportation

// 默认导出 export default function(a, b) { return a + b; }; // 命名导出 export function sum(a, b) { return a + b; };
Copier après la connexion

8. Fonction d'attribut d'objet

// 一般形式:
const object = {
  sum: function(a, b) { return a + b; },
};

// 简写:
const object = {
  sum(a, b) { return a + b; },
};

Copier après la connexion

9. . Fonction de propriété dynamique d'objet

const functionName = "sum";
const object = {
  [functionName]: function(a, b) { return a + b; },
};

Copier après la connexion

10. Fonction Getter/Setter de propriété d'objet

// 一般形式:
const object = {
  get answer { return 42; },
  set answer(value) { /* 一些操作value的代码 */ },
};

//  使用 defineProperty
const obj = {};
Object.defineProperty(obj, "answer", {
  get() { return 42; },
  set(value) { /* 一些操作value的代码 */ },
});

Copier après la connexion

11. Fonctions Getter/Setter des propriétés dynamiques des objets

const functionName = "answer";
const object = {
  get [functionName]() { return 42; },
  set [functionName](value) { /* 一些操作value的代码 */ },
};

Copier après la connexion

12. Fonctions de méthode de classe

class Compute {
  // 一般形式:
  sum(a, b) { return a + b; }
}

class Compute {
  // 静态:
  static sum(a, b) { return a + b; };
}

Copier après la connexion

13. Fonction d'attribut de classe

class Compute {
  // 一般形式:
  sum = function (a, b) { return a + b; };
}class Compute {
  // 静态:
  static sum = function(a, b) { return a + b; };
}

Copier après la connexion

14. Fonction privée de classe

class Compute {
  // 一般形式:
  #sum(a, b) {
    return a + b;
  }  // 静态:
  static #sum(a, b) {
    return a + b;
  }
}

Copier après la connexion

Résumé

Si vous combinez certaines de ces méthodes, il y a encore plus de possibilités.
Connaissez-vous d'autres méthodes ? Veuillez laisser un message et faites-le moi savoir. Recommandations d'apprentissage gratuites associées :
Tutoriel vidéo js

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!