Bagaimanakah cara saya mencipta fungsi yang memanggil setiap fungsi yang disediakan menggunakan JavaScript?-tutorial js-php.cn

Bagaimanakah cara saya mencipta fungsi yang memanggil setiap fungsi yang disediakan menggunakan JavaScript?

PHPz

Lepaskan： 2023-08-24 12:41:02

ke hadapan

1300 orang telah melayarinya

如何使用 JavaScript 创建一个调用每个提供的函数的函数？

Dalam JavaScript, fungsi ialah objek kelas pertama, yang bermaksud ia boleh dihantar sebagai hujah kepada fungsi lain. Ini ialah ciri berkuasa yang boleh digunakan untuk mencipta beberapa corak yang menarik.

Satu corak sedemikian ialah corak "invoke-each", di mana fungsi dicipta yang memanggil setiap fungsi yang disediakan menggunakan argumen yang diterimanya.

Mengapa menggunakan corak Invoke-Each?

Terdapat beberapa sebab mengapa anda mungkin mahu menggunakan corak invoke-setiap.

Pertama, ia boleh digunakan sebagai cara untuk mengabstrak butiran tentang cara satu set fungsi dipanggil. Ini berguna jika fungsi dipanggil dengan cara yang kompleks atau berulang.

Kedua, ia boleh digunakan untuk mencipta sejenis "talian paip", di mana output setiap fungsi dihantar sebagai input kepada fungsi seterusnya dalam rantai. Ini ialah cara yang mudah untuk menggabungkan satu siri tindakan.

Akhir sekali, ia boleh digunakan untuk mencipta fungsi "tee" yang memanggil berbilang fungsi dengan parameter yang sama dan mengumpul hasilnya. Ini berguna untuk pengelogan, penyahpepijatan atau tujuan lain.

Bagaimana untuk melaksanakan corak Invoke-Each?

Terdapat beberapa cara berbeza untuk melaksanakan panggilan setiap corak.

Cara paling mudah ialah dengan hanya menggelungkan fungsi yang disediakan dan memanggil setiap fungsi dengan hujah -

function invokeEach(functions, args) {
   for (var i = 0; i < functions.length; i++) {
      functions[i].apply(null, args);
   }
}

Salin selepas log masuk

Dalam kod di atas, kami mengulangi fungsi dan memanggil setiap fungsi menggunakan kaedah Function.prototype.apply(). Kaedah ini membolehkan kami memanggil fungsi dengan tatasusunan nilai dan parameter tertentu ini.

Kami menggunakan kaedah apply() di sini kerana ini adalah cara yang mudah untuk menghantar parameter sebagai tatasusunan. Anda juga boleh menggunakan kaedah Function.prototype.call(), yang membolehkan anda menghantar parameter sebagai nilai berasingan.

Contoh

Contoh kod kerja penuh di bawah.

<!doctype html>
<html>
<head>
   <title>Examples</title>
</head>
<body>
   <div id="result"></div>
   <div id="result1"></div>
   <div id="result2"></div>
   <div id="result3"></div>
   <script>
      function foo(x) {
         document.getElementById("result").innerHTML = 'foo: ' + x;
      }
      function bar(x) {
         document.getElementById("result1").innerHTML = 'bar: ' + x;
      }
      function baz(x) {
         document.getElementById("result2").innerHTML = 'baz: ' + x;
      }
      function qux(x) {
         document.getElementById("result3").innerHTML ='qux: ' + x;
      }
      function invokeEach(functions, args) {
         for (var i = 0; i < functions.length; i++) {
            functions[i].apply(null, args);
         }
      }
      invokeEach([foo, bar, baz, qux], [5]);
   </script>
</body>
</html>

Salin selepas log masuk

Seperti yang anda lihat, contoh kod di atas mentakrifkan empat fungsi: foo(), bar(), baz(), dan qux(). Fungsi ini hanya mencetak mesej menggunakan parameter yang disediakan.

Seterusnya, kami mentakrifkan fungsi invokeEach(), yang menerima tatasusunan fungsi dan tatasusunan parameter. Fungsi ini menggelung melalui fungsi yang disediakan dan memanggil setiap fungsi dengan argumen yang disediakan.

Akhir sekali, kami memanggil fungsi invokeEach(), menghantar dalam empat fungsi dan satu parameter 5. Seperti yang dijangkakan, ini menyebabkan setiap fungsi dipanggil dengan hujah 5.

Dalam tutorial ini, kami melihat corak invoke-setiap dalam JavaScript. Corak ini boleh digunakan untuk mencipta fungsi yang memanggil setiap fungsi yang disediakan dengan argumen yang diterimanya.

Kami belajar cara melaksanakan corak ini dan beberapa sebab mengapa anda mungkin mahu menggunakannya.

Atas ialah kandungan terperinci Bagaimanakah cara saya mencipta fungsi yang memanggil setiap fungsi yang disediakan menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!