Qu'est-ce qu'une fonction d'usine JavaScript ?

En JavaScript, une fonction d'usine est une fonction utilisée pour créer des objets. Ces fonctions intégrées sont toutes des objets de classe. Lorsqu'elles sont appelées, une instance de classe est réellement créée, c'est-à-dire qu'un objet est d'abord créé à l'aide de la classe, puis l'objet est renvoyé. Les fonctions créées ont toutes les mêmes attributs.

L'environnement d'exploitation de ce tutoriel : système Windows 10, JavaScript version 1.8.5, ordinateur Dell G3.

Qu'est-ce que la fonction d'usine JavaScript

Alors, qu'est-ce qu'une « fonction d'usine » exactement ? Jetons un coup d'œil au concept : "La fonction dite d'usine signifie que ces fonctions intégrées sont toutes des objets de classe. Lorsque vous les appelez, vous créez en fait une instance de classe." Cela signifie que lorsque j'appelle cette fonction, je crée en fait un objet en utilisant la classe, puis je renvoie l'objet. Puisque Javascript lui-même n'est pas un langage strictement orienté objet (ne contient pas de classes), en fait, Javascript n'a pas de "fonction d'usine" stricte, mais en Javascript, nous pouvons utiliser des fonctions pour simuler des classes.

Nous créons d'abord un objet via le mot-clé new, et obj équivaut à une instance d'Object. Nous instancions un objet via la classe, puis donnons à l'objet les attributs correspondants et enfin renvoyons l'objet. Nous pouvons créer des objets en appelant cette fonction. Dans ce cas, la fonction factory est en fait facile à comprendre :

1, c'est une fonction.

2, qui sert à créer des objets.

3. C'est comme une usine. Les fonctions "produites" sont toutes des "pièces standards" (ont les mêmes propriétés)

Vous ne pouvez pas devenir un programmeur JavaScript sans apprendre les fonctions et les objets, et les utiliser ensemble. aux éléments de construction, nous devons commencer par un paradigme d’objet puissant appelé composition. Aujourd'hui, nous examinons quelques modèles idiomatiques d'utilisation de fonctions d'usine pour composer des fonctions, des objets et des promesses. Le mode combinaison organise un lot de sous-objets dans une structure arborescente, et une commande de niveau supérieur fera fonctionner tous les objets de l'arborescence. Lorsqu'une fonction renvoie un objet, nous l'appelons une fonction d'usine.

Regardons un exemple simple.

function createJelly() {
 return {
 type: 'jelly',
 colour: 'red'
 scoops: 3
 };
 }

On vous le présente à travers quelques exemples.

Chaque fois que nous appelons cette fonction d'usine, elle renverra une nouvelle instance d'objet Jelly. La chose importante à noter est que nous n'avons pas besoin de faire précéder le nom de la fonction d'usine par create , mais cela rend l'intention de la fonction plus claire pour les autres. La même chose est vraie pour l'attribut type, mais il nous aide généralement à différencier les objets de notre programme.​

1. Fonction usine avec paramètres

Comme toutes les fonctions, nous pouvons définir notre fonction usine (glace glace) grâce à des paramètres, qui peuvent être utilisés pour changer le modèle de l'objet retourné.

function createIceCream(flavour='Vanilla') {
 return {
 type: 'icecream',
 scoops: 3,
 flavour
 }
 }

En théorie, vous pourriez utiliser des fonctions d'usine avec des centaines d'arguments pour renvoyer des envoyés très nombreux d'objets profondément imbriqués, mais comme nous le verrons, ce n'est pas du tout l'essence de la composition.

2. Fonction d'usine combinée

Définir une autre fonction d'usine au sein d'une fonction d'usine peut nous aider à diviser les fonctions d'usine complexes en fragments plus petits et réutilisables.

Par exemple, nous pouvons créer une fonction d'usine dessert (dessert), définie par les fonctions d'usine précédentes jelly (gelée) et icecream (crème glacée).​

function createDessert() {
return {
type: 'dessert',
bowl: [
createJelly(),
createIceCream()
]
};
}

​ Nous pouvons combiner des fonctions d'usine pour construire des objets arbitrairement complexes, ce qui ne nous oblige pas à utiliser new ou this en combinaison. Les objets peuvent être représentés par une relation has-a (has) au lieu de is-a (is). En d’autres termes, il peut être implémenté en utilisant la composition plutôt que l’héritage.​

​ Par exemple, utilisez l'héritage.

// A trifle *is a* dessert 蛋糕*是*甜点
function Trifle() {
Dessert.apply(this, arguments);
}
Trifle.prototype = Dessert.prototype;
// 或者
class Trifle extends Dessert {
constructor() {
super();
}
}

Nous pouvons exprimer la même signification en utilisant le mode combinaison.

// A trifle *has* layers of jelly, custard and cream. It also *has a* topping.
// 蛋糕 *有* 果冻层，奶酪层和奶油层，顶部还 *有* 装饰配料。
function createTrifle() {
return {
type: 'trifle',
layers: [
createJelly(),
createCustard(),
createCream()
],
topping: createAlmonds()
};
}

3. Fonctions d'usine asynchrones

Toutes les usines ne renverront pas les données immédiatement. Par exemple, certains doivent d’abord obtenir les données. Dans ces cas, nous pouvons renvoyer des promesses pour définir les fonctions d'usine.

function getMeal(menuUrl) {
 return new Promise((resolve, reject) => {
 fetch(menuUrl)
 .then(result => {
 resolve({
 type: 'meal',
 courses: result.json()
 });
 })
 .catch(reject);
 });
 }

Cette indentation profondément imbriquée peut rendre les usines asynchrones difficiles à lire et à tester. Il est souvent utile de les diviser en plusieurs usines différentes, qui peuvent s'écrire ainsi.

function getMeal(menuUrl) {
 return fetch(menuUrl)
 .then(result => result.json())
 .then(json => createMeal(json));
 }
 function createMeal(courses=[]) {
 return {
 type: 'meal',
 courses
 };
 }

Bien sûr, nous pouvons utiliser des fonctions de rappel, mais nous avons déjà des outils comme Promise.all qui renvoient des promesses pour définir des fonctions d'usine.​

function getWeeksMeals() {
const menuUrl = 'jsfood.com/';
return Promise.all([
getMeal(`${menuUrl}/monday`),
getMeal(`${menuUrl}/tuesday`),
getMeal(`${menuUrl}/wednesday`),
getMeal(`${menuUrl}/thursday`),
getMeal(`${menuUrl}/friday`)
]);
}

​ Nous utilisons get au lieu de create comme convention de dénomination pour montrer que ces usines effectuent un travail asynchrone et renvoient des promesses.

Recommandations associées : Tutoriel d'apprentissage 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!