Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Apakah fungsi kilang JavaScript?

Apakah fungsi kilang JavaScript?

WBOY
Lepaskan: 2022-03-10 11:14:33
asal
3329 orang telah melayarinya

Dalam JavaScript, fungsi kilang ialah fungsi yang digunakan untuk mencipta objek. Fungsi terbina dalam ini adalah semua objek kelas Apabila dipanggil, contoh kelas sebenarnya dicipta, iaitu, objek pertama kali dibuat menggunakan kelas, dan kemudian objek itu dikembalikan.

Apakah fungsi kilang JavaScript?

Persekitaran pengendalian tutorial ini: sistem Windows 10, versi JavaScript 1.8.5, komputer Dell G3.

Apakah fungsi kilang JavaScript?

Jadi apakah sebenarnya "fungsi kilang" itu? Mari kita lihat konsep, "Fungsi kilang yang dipanggil bermakna fungsi terbina dalam ini adalah semua objek kelas. Apabila anda memanggilnya, anda sebenarnya mencipta contoh kelas." Ini bermakna apabila saya memanggil fungsi ini, saya sebenarnya mencipta objek menggunakan kelas dan kemudian mengembalikan objek tersebut. Memandangkan Javascript sendiri bukanlah bahasa berorientasikan objek yang ketat (tidak mengandungi kelas), sebenarnya, Javascript tidak mempunyai "fungsi kilang" yang ketat, tetapi dalam Javascript, kita boleh menggunakan fungsi untuk mensimulasikan kelas.

Kami mula-mula mencipta objek melalui kata kunci baharu dan obj adalah bersamaan dengan tika Object. Kami membuat instantiate objek melalui kelas, kemudian memberikan objek atribut yang sepadan, dan akhirnya mengembalikan objek. Kita boleh mencipta objek dengan memanggil fungsi ini Dalam kes ini, fungsi kilang sebenarnya mudah difahami:

1, ia adalah fungsi.

2, yang digunakan untuk mencipta objek.

3. Ia seperti kilang Fungsi "dihasilkan" semuanya "bahagian standard" (dengan atribut yang sama)

Anda tidak boleh menjadi JavaScript tanpa fungsi dan objek pembelajaran. Pengaturcara, dan apabila digunakan bersama-sama, adalah blok bangunan, kita perlu bermula dengan paradigma objek berkuasa yang dipanggil komposisi. Hari ini kita melihat beberapa corak idiomatik untuk menggunakan fungsi kilang untuk mengarang fungsi, objek dan Janji. Mod gabungan menyusun sekumpulan sub-objek ke dalam struktur pokok, dan perintah peringkat atas akan mengendalikan semua objek dalam pepohon. Apabila fungsi mengembalikan objek, kami memanggilnya fungsi kilang.

Mari lihat contoh mudah.

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

Di bawah ini kami akan memperkenalkannya kepada anda melalui beberapa contoh.

Setiap kali kita memanggil fungsi kilang ini, ia akan mengembalikan contoh objek jeli yang baharu. Perkara penting yang perlu diambil perhatian ialah kita tidak perlu mendahului nama fungsi kilang dengan create , tetapi ia menjadikan maksud fungsi itu lebih jelas kepada orang lain. Perkara yang sama berlaku untuk atribut jenis, tetapi secara amnya ia membantu kami membezakan antara objek program kami.

1. Fungsi kilang dengan parameter

Seperti semua fungsi, kami boleh menentukan fungsi kilang kami (aiskrim ais krim) melalui parameter, yang boleh digunakan untuk menukar model objek yang dikembalikan.

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

Secara teori, anda boleh menggunakan fungsi kilang dengan beratus-ratus hujah untuk mengembalikan utusan objek bersarang dalam, tetapi seperti yang akan kita lihat, itu bukan intipati komposisi sama sekali.

2. Gabungan fungsi kilang

Mentakrifkan satu lagi fungsi kilang dalam fungsi kilang boleh membantu kita membahagikan fungsi kilang yang kompleks kepada serpihan yang lebih kecil dan boleh digunakan semula.

Sebagai contoh, kita boleh mencipta fungsi kilang pencuci mulut (pencuci mulut), yang ditakrifkan oleh fungsi kilang jeli (jeli) dan aiskrim (aiskrim) sebelumnya.

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

Kami boleh menggabungkan fungsi kilang untuk membina objek kompleks sewenang-wenangnya, yang tidak memerlukan kami menggunakan yang baru atau ini dalam kombinasi. Objek boleh diwakili oleh hubungan has-a (mempunyai) bukannya is-a (is). Dalam erti kata lain, ia boleh dilaksanakan menggunakan gubahan dan bukannya warisan.

<如> Contohnya, gunakan warisan.

// A trifle *is a* dessert 蛋糕*是*甜点
function Trifle() {
Dessert.apply(this, arguments);
}
Trifle.prototype = Dessert.prototype;
// 或者
class Trifle extends Dessert {
constructor() {
super();
}
}
Salin selepas log masuk
Kita boleh menyatakan maksud yang sama menggunakan mod gabungan.

// A trifle *has* layers of jelly, custard and cream. It also *has a* topping.
// 蛋糕 *有* 果冻层,奶酪层和奶油层,顶部还 *有* 装饰配料。
function createTrifle() {
return {
type: &#39;trifle&#39;,
layers: [
createJelly(),
createCustard(),
createCream()
],
topping: createAlmonds()
};
}
Salin selepas log masuk
3. Fungsi kilang tak segerak

Tidak semua kilang akan memulangkan data serta-merta. Sebagai contoh, ada yang perlu mendapatkan data terlebih dahulu. Dalam kes ini, kami boleh mengembalikan Janji untuk menentukan fungsi kilang.

function getMeal(menuUrl) {
 return new Promise((resolve, reject) => {
 fetch(menuUrl)
 .then(result => {
 resolve({
 type: &#39;meal&#39;,
 courses: result.json()
 });
 })
 .catch(reject);
 });
 }
Salin selepas log masuk
Lekukan bersarang dalam ini boleh menjadikan kilang async sukar dibaca dan diuji. Selalunya berguna untuk memecahkannya kepada beberapa kilang yang berbeza, yang boleh ditulis seperti ini.

function getMeal(menuUrl) {
 return fetch(menuUrl)
 .then(result => result.json())
 .then(json => createMeal(json));
 }
 function createMeal(courses=[]) {
 return {
 type: &#39;meal&#39;,
 courses
 };
 }
Salin selepas log masuk
Sudah tentu, kita boleh menggunakan fungsi panggil balik, tetapi kita sudah mempunyai alatan seperti Promise.all yang mengembalikan Promises untuk mentakrifkan fungsi kilang.

function getWeeksMeals() {
const menuUrl = &#39;jsfood.com/&#39;;
return Promise.all([
getMeal(`${menuUrl}/monday`),
getMeal(`${menuUrl}/tuesday`),
getMeal(`${menuUrl}/wednesday`),
getMeal(`${menuUrl}/thursday`),
getMeal(`${menuUrl}/friday`)
]);
}
Salin selepas log masuk
Kami menggunakan get dan bukannya create sebagai konvensyen penamaan untuk menunjukkan bahawa kilang-kilang ini melakukan beberapa kerja tak segerak dan membalas janji.

Cadangan berkaitan:

Tutorial pembelajaran javascript

Atas ialah kandungan terperinci Apakah fungsi kilang JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan