Definisi fungsi JavaScript
JavaScript menggunakan fungsi kata kunci untuk mentakrifkan fungsi.
Fungsi boleh ditakrifkan melalui pengisytiharan atau ia boleh menjadi ungkapan.
Pengisytiharan fungsi
Dalam tutorial sebelumnya, anda sudah mengetahui sintaks pengisytiharan fungsi:
function functionName(parameters) {
Executed code
}
Fungsi tidak akan dilaksanakan sejurus selepas ia diisytiharkan, tetapi akan dipanggil apabila kita memerlukannya.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>本例調(diào)用的函數(shù)會(huì)執(zhí)行一個(gè)計(jì)算,然后返回結(jié)果:</p> <p id="demo"></p> <script> function myFunction(a,b){ return a*b; } document.getElementById("demo").innerHTML=myFunction(4,3); </script> </body> </html>
Jalankan program dan cuba
Petua: The koma bertitik Digunakan untuk memisahkan penyataan JavaScript boleh laku Memandangkan perisytiharan fungsi bukan penyataan boleh laku, ia tidak berakhir dengan koma bertitik.
Ekspresi fungsi
Fungsi JavaScript boleh ditakrifkan melalui ungkapan.
Ungkapan fungsi boleh disimpan dalam pembolehubah:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>函數(shù)可以存儲(chǔ)在變量中:</p> <p id="demo"></p> <script> var x = function (a, b) {return a * b}; document.getElementById("demo").innerHTML = x; </script> </body> </html>
Jalankan atur cara untuk mencubanya
Selepas ungkapan fungsi disimpan dalam pembolehubah, pembolehubah boleh juga digunakan sebagai fungsi Gunakan:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>函數(shù)存儲(chǔ)在變量后,變量可作為函數(shù)使用:</p> <p id="demo"></p> <script> var x = function (a, b) {return a * b}; document.getElementById("demo").innerHTML = x(4, 3); </script> </body> </html>
Jalankan atur cara untuk mencubanya
Fungsi di atas sebenarnya adalah fungsi tanpa nama (fungsi itu tidak mempunyai nama).
Fungsi disimpan dalam pembolehubah dan tidak memerlukan nama fungsi Ia biasanya dipanggil melalui nama pembolehubah.
Petua: Fungsi di atas berakhir dengan koma bertitik kerana ia adalah pernyataan pelaksanaan.
Function() constructor
Dalam contoh di atas, kami mengetahui bahawa fungsi ditakrifkan melalui fungsi kata kunci .
Fungsi juga boleh ditakrifkan melalui pembina fungsi JavaScript terbina dalam (Function()).
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>JavaScrip 內(nèi)置構(gòu)造函數(shù)。</p> <p id="demo"></p> <script> var myFunction = new Function("a", "b", "return a * b"); document.getElementById("demo").innerHTML = myFunction(4, 3); </script> </body> </html>
Jalankan program untuk mencubanya
Petua: Dalam JavaScript, banyak kali, anda perlu mengelak daripada menggunakan kata kunci baharu.
Sebenarnya, anda tidak perlu menggunakan pembina. Contoh di atas boleh ditulis sebagai:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p id="demo"></p> <script> var myFunction = function (a, b) {return a * b} document.getElementById("demo").innerHTML = myFunction(4, 3); </script> </body> </html>
Jalankan program dan cuba
Fungsi Mengangkat (Hoisting)
Dalam tutorial sebelum ini kita telah mempelajari tentang "hoisting".
Mengangkat ialah tingkah laku lalai JavaScript untuk menaikkan skop semasa ke hadapan.
Hoisting digunakan pada pengisytiharan berubah-ubah dan pengisytiharan fungsi.
Oleh itu, fungsi boleh dipanggil sebelum pengisytiharan:
myFunction(5);
function myFunction(y) {
return y * y;
}
Tidak boleh dinaikkan pangkat apabila mentakrifkan fungsi menggunakan ungkapan.
Fungsi panggilan kendiri
Ekspresi fungsi boleh "memanggil diri".
Ekspresi panggilan sendiri dipanggil secara automatik.
Dipanggil secara automatik jika ungkapan diikuti dengan () .
Tidak boleh memanggil sendiri fungsi yang diisytiharkan.
Tunjukkan bahawa ia adalah ungkapan fungsi dengan menambah kurungan:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>函數(shù)可以自動(dòng)調(diào)用:</p> <p id="demo"></p> <script> (function () { document.getElementById("demo").innerHTML = "Hello! 我是自己調(diào)用的"; })(); </script> </body> </html>
Jalankan atur cara untuk mencubanya
Fungsi di atas sebenarnya adalah fungsi panggilan kendiri tanpa nama (tiada nama fungsi).
Fungsi boleh digunakan sebagai nilai
Fungsi JavaScript boleh digunakan sebagai nilai:
Contoh
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>函數(shù)可作為一個(gè)值:</p> <p>x = myFunction(4,3) 或 x = 12</p> <p>兩種情況下,x 的值都為 12。</p> <p id="demo"></p> <script> function myFunction(a, b) { return a * b; } var x = myFunction(4, 3); document.getElementById("demo").innerHTML = x; </script> </body> </html>
Jalankan atur cara untuk mencubanya
Fungsi JavaScript boleh digunakan sebagai ungkapan:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>函數(shù)可作為一個(gè)表達(dá)式使用。</p> <p id="demo"></p> <script> function myFunction(a, b) { return a * b; } var x = myFunction(4, 3) * 2; document.getElementById("demo").innerHTML = x; </script> </body> </html>
Jalankan program dan cuba
Fungsi ialah objek
Gunakan operator jenis dalam JavaScript untuk menentukan jenis fungsi akan mengembalikan "fungsi".
Tetapi adalah lebih tepat untuk menerangkan fungsi JavaScript sebagai objek.
Fungsi JavaScript mempunyai sifat dan kaedah.
Sifatarguments.length mengembalikan bilangan parameter yang diterima semasa panggilan fungsi:
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p> arguments.length 屬性返回函數(shù)接收到參數(shù)的個(gè)數(shù):</p> <p id="demo"></p> <script> function myFunction(a, b) { return arguments.length; } document.getElementById("demo").innerHTML = myFunction(4, 3); </script> </body> </html>
Jalankan program dan cuba ia
kaedah toString() mengembalikan fungsi sebagai rentetan:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p> toString() 將函數(shù)作為一個(gè)字符串返回:</p> <p id="demo"></p> <script> function myFunction(a, b) { return a * b; } document.getElementById("demo").innerHTML = myFunction.toString(); </script> </body> </html>
Jalankan program ke cubalah
Petua: Fungsi yang ditakrifkan sebagai atribut objek dipanggil kaedah objek Jika fungsi itu digunakan untuk mencipta objek baharu, ia dipanggil pembina objek.