Petua Pantas: Apakah fungsi kilang di JavaScript

fungsi kilang JavaScript: Membina corak yang kuat untuk menyusun objek

fungsi kilang JavaScript adalah fungsi yang mengembalikan objek, dan boleh membuat pelbagai objek yang sama tanpa menggunakan kata kunci

atau

. Artikel ini akan meneroka beberapa kegunaan fungsi kilang, termasuk fungsi kilang parametrik, fungsi kilang komposis, fungsi kilang tak segerak, dan fungsi kilang lanjutan, menunjukkan cara menggunakannya untuk membina lebih fleksibel dan lebih mudah untuk mengekalkan kod JavaScript. new this

Konsep teras

Fungsi kilang:
• mengembalikan fungsi objek. Fungsi kilang parameterized Parameterized: Terima parameter untuk menukar fungsi kilang yang mengembalikan struktur objek.
• Fungsi kilang komposit: Membina fungsi kilang objek kompleks dengan menggabungkan fungsi kilang lain.
• fungsi kilang asynchronous: mengembalikan fungsi kilang janji untuk mengendalikan operasi tak segerak.
Fungsi kilang lanjutan:
• fungsi kilang diluluskan sebagai parameter fungsi, digunakan untuk membuat penambah (mis., Tambah cap waktu atau buat objek yang tidak berubah).
• Contoh mudah
fungsi kilang mudah:

Setiap kali fungsi dipanggil, contoh objek jeli baru akan dikembalikan. Nama fungsi tidak semestinya bermula dengan

, tetapi berbuat demikian dapat meningkatkan kebolehbacaan kod.

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

Fungsi kilang parameterisasi

createJelly() create Seperti semua fungsi, fungsi kilang juga boleh menerima parameter untuk mengubah struktur objek yang dikembalikan:

Walaupun secara teorinya, sejumlah besar parameter boleh digunakan untuk membuat objek bersarang yang sangat spesifik, ini tidak sesuai dengan idea kombinasi.

fungsi kilang komposit

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

dengan menentukan satu fungsi kilang sebagai gabungan fungsi kilang yang lain, boleh dipecahkan kepada serpihan yang lebih kecil dan lebih boleh diguna semula. Sebagai contoh, kita boleh membuat fungsi kilang pencuci mulut berdasarkan fungsi kilang jeli dan ais krim sebelumnya:

Dengan menggabungkan fungsi kilang, anda boleh membina struktur kompleks tanpa menggunakan atau

.

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

gabungan vs warisan

new this Kombinasi cenderung lebih cenderung kepada hubungan "Has-A", sementara warisan cenderung lebih cenderung kepada hubungan "IS-A". Sebagai contoh, melaksanakan perkara kecil dengan warisan:

dan gunakan kombinasi untuk melaksanakan Trifle:

fungsi kilang async

// Trifle is a Dessert
function Trifle() {
  Dessert.apply(this, arguments);
}
Trifle.prototype = Dessert.prototype;
// 或使用 ES6 class
class Trifle extends Dessert {}

Tidak semua fungsi kilang boleh mengembalikan data dengan segera. Sesetengah fungsi kilang mungkin perlu mendapatkan data terlebih dahulu. Dalam kes ini, fungsi kilang yang mengembalikan janji boleh digunakan:

// Trifle has layers of jelly, custard and cream. It also has a topping.
function createTrifle() {
  return {
    type: 'trifle',
    layers: [
      createJelly(),
      createCustard(),
      createCream()
    ],
    topping: createAlmonds()
  };
}

Untuk mengelakkan bersarang yang terlalu dalam, fungsi kilang tak segerak boleh diuraikan ke dalam pelbagai fungsi kilang bebas dan kemudian digabungkan:

anda boleh menggunakan

untuk menggabungkan pelbagai fungsi kilang yang mengembalikan janji:

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

function getMeal(menuUrl) {
  return fetch(menuUrl)
    .then(result => result.json())
    .then(json => createMeal(json));
}

function createMeal(courses = []) {
  return {
    type: 'meal',
    courses
  };
}

Fungsi dan kaedah

Promise.all

Fungsi kilang biasanya tidak mengembalikan objek yang mengandungi kaedah, kerana ini menggabungkan data dan pengiraan bersama -sama. Fungsi kilang memberi tumpuan kepada mewujudkan objek data, sementara logik data memanipulasi diproses oleh fungsi bebas.

fungsi kilang lanjutan

Fungsi kilang lulus sebagai fungsi pesanan yang lebih tinggi dapat mencapai kawalan yang kuat. Sebagai contoh, anda boleh membuat penambah menggunakan fungsi kilang lanjutan:

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

Penambah ini mengambil fungsi kilang yang sedia ada dan membungkusnya ke dalam fungsi kilang yang mengembalikan contoh yang mengandungi cap waktu.

Kesimpulan

Fungsi kilang adalah corak yang mudah dan kuat yang menggalakkan penggunaan komposisi dan bukannya warisan, mewujudkan lebih fleksibel, lebih mudah untuk menguji dan mengekalkan kod. Dengan menggunakan blok bangunan mudah, kod itu boleh dibuat lebih mudah untuk difahami dan diselenggara.

(Berikut adalah bahagian FAQ, yang telah ditulis semula mengikut teks asal, dan isu -isu yang serupa telah diselaraskan dan digabungkan)

FAQ (FAQ)

• Perbezaan antara fungsi kilang dan pembina? Fungsi kilang mengembalikan objek secara langsung tanpa kata kunci new; Fungsi kilang lebih fleksibel dan lebih sesuai dengan gaya pengaturcaraan berfungsi. new this

• Bagaimana untuk membuat pembolehubah peribadi dalam fungsi kilang?

  Gunakan penutupan. Pembolehubah peribadi diisytiharkan di dalam fungsi kilang dan hanya boleh diakses melalui kaedah dalam objek yang dikembalikan oleh fungsi kilang.

• Bolehkah fungsi kilang digunakan dengan fungsi anak panah ES6?

  Ya.

• Bagaimana untuk menambah kaedah ke fungsi kilang?

  Tentukan kaedah dalam objek yang dikembalikan oleh fungsi kilang.

• Bolehkah fungsi kilang mewarisi fungsi kilang lain?

  anda boleh menggabungkan pelbagai sifat objek dengan atau mengembangkan pengendali untuk mensimulasikan warisan. Object.assign

• Peranan apakah penutupan dalam fungsi kilang?

  Penutupan melaksanakan enkapsulasi data dan membuat pembolehubah dan kaedah peribadi.

• Bolehkah fungsi kilang mengembalikan fungsi lain?

  Ya, ini sering digunakan untuk membuat fungsi pesanan yang lebih tinggi.

• Bagaimana menggunakan fungsi kilang dengan modul JavaScript?

  Eksport fungsi kilang, kemudian import dan gunakannya dalam modul lain.

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