Berbagai metode definisi fungsi umum dalam javascript

Artikel ini menjelaskan secara rinci berbagai metode definisi fungsi umum dalam JavaScript, dan dibagikan kepada Anda untuk referensi Anda. Analisis spesifiknya adalah sebagai berikut:

Pertama, mari kita lihat empat definisi fungsi paling umum dalam JavaScript:

Fungsi yang didefinisikan dengan konstruktor fungsi, kode adalah sebagai berikut:

 var multiply = fungsi baru ('x', 'y', 'return x * y;');

Deklarasi fungsi, metode ini juga yang paling umum:

 fungsi multiply (x, y) {return x * y;}

Ekspresi fungsi, dinyatakan sebagai fungsi anonim dan kemudian ditugaskan ke variabel, adalah cara yang sangat umum:

 var multiply = function (x, y) {return x * y;}

Ekspresi fungsi, tetapi deklarasi fungsi adalah fungsi bernama dan kemudian menetapkan nilai ke variabel, yang terlihat persis seperti cara yang sama:

 var multiply = fungsi multi (x, y) {return x * y;}

Pertama, mari kita bandingkan nama fungsi dan hubungan langsung antara variabel fungsi yang ditetapkan untuk fungsi. Ini benar -benar sedikit ... menjadi lebih intuitif, dari contoh 4 sekarang, itu adalah hubungan antara variabel fungsi multiply dan nama fungsi multi:

Nama fungsi tidak dapat dimodifikasi, sebaliknya, variabel fungsi dapat dipindahkan. Seharusnya mudah untuk dipahami bahwa variabel fungsi dapat dipindahkan. Dalam contoh keempat kami, variabel multipel yang baru saja didefinisikan, tidak menyenangkan untuk dilihat, dan menugaskannya kembali ke:

 Multiply = function (x, y) {return x + y;}

Saya segera mengubah diri saya dari perkalian menjadi penambahan. Namun, tidak mungkin untuk mengubah variabel multi fungsi. Definisi fungsi sudah ada. Selama masih mempertahankan rujukannya, itu tidak akan berubah. Mungkin tidak mudah dimengerti di sini. Pikirkan seperti ini terlebih dahulu, dan lihat ke bawah, dan Anda harus dapat memahaminya perlahan.

Nama fungsi tidak dapat digunakan di luar fungsi secara bersamaan, itu hanya terlihat di dalam tubuh fungsi. Contoh yang sangat sederhana:

 var foo = function bar () {alert ('hello');} foo (); // prompt "hello" string bar (); // Jalankan kesalahan, bilah tidak didefinisikan

Dan jelas, bilah di sini memang nama fungsi, tetapi itu benar -benar tidak dapat disebut secara eksternal. Pada saat ini, pasti akan ada sepatu anak-anak yang bertanya mengapa contoh ini masih terlihat sangat baik, seperti contoh 4, mengapa tidak menggunakan metode contoh 2? Pertanyaan bagus, izinkan saya memecahnya perlahan.

Melanjutkan dengan Contoh 4, kita dapat melihat bahwa nama fungsi (multi) dan variabel fungsi (multiply), tidak sama, tetapi pada kenyataannya, keduanya tidak memiliki hubungan sama sekali, sehingga tidak perlu mempertahankan konsistensi. Berbicara tentang hal ini, saya pikir empat contoh di atas harus dikurangi menjadi 3, dan Contoh 2 dan Contoh 4 pada dasarnya harus konsisten. Apa, tidak percaya? Hehe, aku harus terus menyimpannya dalam keheningan ~ terus membaca ~~

Kami menemukan bahwa dibandingkan dengan Contoh 2 dan Contoh 4, hanya ada lebih sedikit variabel fungsi VAR, sementara dibandingkan dengan Contoh 3, hanya ada lebih sedikit nama fungsi itu. Dari perspektif fenomena, esensi dari Contoh 2 dan Contoh 4 adalah sama, dan buktinya adalah sebagai berikut:

 function foo () {} alert (foo); // Meminta nama fungsi yang berisi "foo" var bar = foo; alert (bar); // Meminta nama fungsi masih hanya berisi "foo", dan tidak memiliki hubungan dengan bar

Itu memang IronClad? Apakah ini cara untuk menulis kode di atas yang mirip dengan Contoh 2 dalam kombinasi dengan kode pada Contoh 4? Benar, inilah yang baru saja saya katakan bahwa keduanya pada dasarnya harus sama. Namun, ketika mendefinisikan fungsi dalam kasus 2, mesin JS membantu kami melakukan sesuatu, seperti mendeklarasikan fungsi dengan nama fungsi multiply, dan diam -diam mendefinisikan variabel yang juga disebut multipel, dan kemudian menetapkannya ke variabel ini, dua nama yang persis sama. Kami berpikir bahwa ketika menggunakan nama fungsi Multiply, kami benar -benar menggunakan variabel fungsi multiply, jadi kami pusing ~ jujur, saya juga pusing ~, ketika kami menelepon, kami benar -benar menyebut variabel fungsi, dan nama fungsi tidak dapat memanggil fungsi secara eksternal, jadi saya memiliki inferensi di atas.

Namun, perbedaan kecil yang akan disebutkan di sini adalah bahwa fungsi yang ditentukan oleh metode deklarasi fungsi berbeda dari deklarasi konstruktor atau deklarasi ekspresi fungsi, metode deklarasi fungsi dapat dipanggil sebelum definisi fungsi ... belum lagi, lihat saja kode:

 foo (); // Tip Foofunction foo () {waspada ('foo');} bar (); // Buddy, ini sangat berbeda dari di atas, jadi jangan pamer. Bukankah ini kesalahan? bilah prompt tidak didefinisikan var bar = function () {alert ('bar');}

Mari kita bicara tentang fungsi yang dinyatakan oleh konstruktor. Fungsi yang dinyatakan tidak akan mewarisi ruang lingkup lokasi yang dinyatakan saat ini. Mereka hanya akan memiliki ruang lingkup global secara default. Namun, ini sama dalam metode deklarasi fungsi lain, sebagai berikut:

 function foo () {var hai = 'hello'; // return function () {// alert (hai); //}; return function ('return hi;');} foo () (); // Untuk efek eksekusi, silakan jalankan dan lihat sendiri

Dapat dibayangkan bahwa pelaksanaan fungsi yang dikembalikan dengan menggunakan deklarasi konstruktor pasti akan melaporkan kesalahan karena variabel HI tidak ada dalam ruang lingkupnya (mis., Lingkup global).

Poin lain adalah bahwa orang sering mengatakan bahwa fungsi yang dinyatakan dalam mode konstruktor tidak efisien. Mengapa ini? Hari ini, saya belajar dari dokumen bahwa fungsi yang dinyatakan dalam tiga cara lain hanya akan diuraikan sekali. Bahkan, mereka ada dalam penutupan, tetapi itu hanya terkait dengan rantai lingkup, dan tubuh fungsi hanya akan diuraikan sekali. Tetapi metode konstruktor adalah bahwa setiap kali suatu fungsi dieksekusi, tubuh fungsinya akan diuraikan sekali. Kita dapat berpikir bahwa fungsi yang dinyatakan dengan cara ini adalah objek, yang menyimpan parameter dan tubuh fungsi. Setiap kali dieksekusi, harus diuraikan sekali, dan parameter dan badan fungsi akan dieksekusi, yang pasti tidak efisien. Tidak tahu bagaimana melakukan percobaan spesifik?

Akhirnya, mari kita bicara tentang sesuatu yang tidak ada yang memperhatikan. Kapan itu tampak seperti cara fungsi deklarasi bukan cara fungsi kehidupan (masih cenderung mengatakannya secara sederhana, ketika jalan contoh 2 menjadi cara lain secara tidak sengaja):

Ketika itu menjadi bagian dari ekspresi, itu seperti Contoh 3 dan Contoh 4.

Ini bukan lagi "elemen sumber" dari skrip itu sendiri atau fungsi. Apa elemen sumbernya? Artinya, pernyataan yang tidak disarangkan dalam naskah atau badan fungsi, seperti:

 var x = 0; // elemen sumber if (x == 0) {// elemen sumber x = 10; // bukan elemen sumber, karena bersarang dalam fungsi pernyataan if boo () {} // bukan elemen sumber, karena bersarang dalam fungsi if pernyataan} foo () {// elemen sumber var y = 20; // bilah fungsi elemen sumber () {} // elemen sumber sementara (y == 10) {// fungsi elemen sumber bla () {} // bukan elemen sumber, karena bersarang dalam pernyataan while y ++; // bukan elemen sumber, karena bersarang dalam pernyataan sementara}}

Saya secara kasar memahami konsep elemen sumber. Saya akan melanjutkan dengan deklarasi fungsi yang baru saja saya sebutkan. Silakan lihat:

 // fungsi fungsi deklarasi foo () {} // function ekspresi (batang fungsi () {}) // function ekspresi x = fungsi hello () {} if (x) {// fungsi fungsi world () {}} // fungsi fungsi a () {// fungsi pernyataan f fungsi b () {} if (0) {// function function a () {// Function function b () {{0) {/ // Function function a () {// Function Function B () {{0) {/// Function Function () {// Function Function B () {oF (0) {// Function Function a () {// Function Function B () {} if (0) {/ 0)

Akhirnya, izinkan saya berbicara tentang pemahaman saya sendiri. Alasan untuk membedakan antara deklarasi fungsi dan deklarasi non-fungsi adalah bahwa dalam pandangan saya, definisi fungsi metode deklarasi fungsi akan dinyatakan sebelumnya ketika mesin parsing JS mengeksekusinya. Artinya, seperti yang baru saja kita katakan di atas, itu dapat digunakan sebelum definisi fungsi. Faktanya, mesin penguraian telah mem -parsed sebelum kita menggunakannya. Namun, deklaratif non-fungsi, seperti deklarasi fungsi ekspresi, mesin parsing JS hanya akan menentukan variabel yang dinyatakan oleh VAR terlebih dahulu. Pada saat ini, nilai variabel tidak terdefinisi, dan penugasan nyata untuk variabel ini berada di lokasi aktual kode. Oleh karena itu, kesalahan yang disebutkan di atas semuanya tidak terdefinisi. Variabel aktual telah didefinisikan, tetapi belum ditetapkan. Mesin parsing JS tidak tahu bahwa itu adalah fungsi.

Saya percaya bahwa deskripsi dalam artikel ini memiliki nilai referensi tertentu untuk desain pemrograman web JavaScript semua orang.