hujung hadapan web
tutorial js
Terokai konsep skop fungsi JavaScript dan pelbagai jenis fungsi JavaScript
Terokai konsep skop fungsi JavaScript dan pelbagai jenis fungsi JavaScript
Dalam JavaScript, skop berbeza membolehkan kami mengakses fungsi dan pembolehubah dari lokasi berbeza dalam kod. Kami akan belajar tentang skop fungsi dalam tutorial ini. Selain itu, kami akan meneroka pelbagai jenis ungkapan fungsi dalam JavaScript.
Julat fungsi
Apabila kami mencipta fungsi baharu dalam JavaScript, ia juga mewujudkan skop fungsi khusus itu. Ini bermakna apa-apa pembolehubah yang kita isytiharkan di dalam fungsi atau mentakrifkan fungsi bersarang di dalamnya, kita boleh mengaksesnya hanya dalam blok fungsi.
Jika kita cuba mengakses pembolehubah yang ditakrifkan di dalam blok fungsi dari luar fungsi, kita akan mendapat ralat rujukan.
Tatabahasa
Anda boleh mengikuti sintaks berikut untuk mentakrifkan fungsi dan memahami skop fungsi.
function function_name(){
var variable = 10; // variable has a function scope.
}
let variable1 = variable;
// we can't access the variable here as it has a function scope.
Dalam sintaks di atas, anda dapat melihat bahawa kami tidak boleh mengakses pembolehubah di luar fungsi kerana blok fungsi menyekatnya.
Contoh 1
Dalam contoh ini, kami mencipta fungsi sampel dan menentukan pembolehubah di dalam fungsi dengan skop blok. Jika kita cuba mengakses pembolehubah yang ditakrifkan dalam fungsi Sample() dari luar fungsi, JavaScript akan membuang ralat rujukan.
<html>
<body>
<h2>Function Scope in JavaScript</h2>
<div id="output"></div>
<script>
let output = document.getElementById("output");
// defining the function
function sample() {
// variables with function scope.
var website = "TutorialsPoint!";
var language = "JavaScript";
output.innerHTML +=
"You are learning the " +
language +
" programming language on " +
website +
" </br>";
}
sample();
// we can't access language and website variables here.
</script>
</body>
</html>
Contoh 2
Kami takrifkan nested_function() dalam fungsi contoh dalam kes ini. Kami tidak boleh memanggil nested_funciton() di luar fungsi sample() kerana nested_function berada dalam skop fungsi sampel.
<html>
<body>
<h2>Function sSope in JavaScript</h2>
<div id="output"></div>
<script>
let output = document.getElementById("output");
function sample() {
// variables with function scope.
var num = 10;
function nested_function() {
// num variables also can be accessed here as nested_function() is
//inside the scope of sample function
var string = "JavaScript";
output.innerHTML +=
"The value of the num variable is " + num + "<br/>";
output.innerHTML +=
"The value of the string variable is " + string + "</br>";
}
// we can call the nested_function() inside the sample() function only
nested_function();
// we can't access the string variable here as the scope of
//nested_function bounds it
}
sample();
</script>
</body>
</html>
Pelbagai jenis fungsi dalam JavaScript
Mengikut definisi dan pengisytiharan fungsi, terdapat banyak jenis fungsi yang akan kita pelajari satu persatu di sini.
Fungsi biasa
Fungsi biasa ialah fungsi yang biasa digunakan oleh semua pembangun JavaScript. Kita boleh mentakrifkan fungsi biasa menggunakan nama fungsi diikuti dengan kata kunci fungsi.
Fungsi biasa kekal di bahagian atas skop semasa fungsi. Ini bermakna kita boleh memanggil fungsi sebelum mentakrifkannya, tetapi ia harus ditakrifkan selepas pelaksanaan.
Tatabahasa
Ikuti sintaks ini untuk menentukan fungsi biasa.
function function_name(){
// function body
}
Dalam sintaks di atas, kami menggunakan kata kunci fungsi untuk mentakrifkan fungsi. 'function_name' ialah nama fungsi, dan kita boleh menulis kod untuk badan fungsi dalam kurungan kerinting.
Ekspresi fungsi
Ekspresi fungsi juga berfungsi seperti fungsi biasa. Walau bagaimanapun, perbezaannya ialah ia tidak mempunyai sebarang nama dan kita perlu menyimpan ungkapan fungsi dalam pembolehubah. Kita boleh menggunakan pengecam untuk memanggil fungsi yang menyimpannya.
JavaScript menilai ungkapan fungsi langkah demi langkah. Oleh itu, ia tidak dinaikkan ke bahagian atas skop, jadi kami tidak boleh memanggilnya sebelum mengisytiharkannya.
Tatabahasa
Ikuti sintaks ini untuk menentukan ungkapan fungsi.
var function_identifier = function () {
// function body
}
function_identifier();
Dalam sintaks di atas, kami telah menentukan fungsi tanpa nama hanya menggunakan kata kunci fungsi dan menyimpannya dalam pembolehubah function_identifier. Selain itu, pengguna boleh melihat cara kami menggunakan function_identifier untuk memanggil ungkapan fungsi.
Fungsi anak panah
Fungsi anak panah telah diperkenalkan dalam ES6, semakan utama terakhir JavaScript pada tahun 2015. Ia adalah sintaks yang lebih pendek untuk mentakrifkan fungsi tanpa nama fungsi. Juga, ia dipanggil ekspresi dan fungsi tanpa nama kerana ia tidak mengandungi identiti mereka.
Tatabahasa
Ikuti sintaks ini untuk menentukan fungsi anak panah.
var function_identifier = (params) => {
// function body
}
function_identifier(arguments);
Dalam sintaks di atas, kami menyimpan ungkapan fungsi anak panah dalam function_identifier. Tambahan pula, kami meluluskan hujah dan hujah di dalam fungsi anak panah sambil memanggil fungsi menggunakan pembolehubah function_identifier.
Tutup fungsi
Kami boleh mencipta fungsi bersarang dalam JavaScript dan mengakses pembolehubah fungsi induk menggunakan fungsi anak. Memandangkan fungsi anak mengandungi akses kepada semua pembolehubah yang ditakrifkan dalam skop fungsi induk, kita boleh memanggil fungsi anak sebagai fungsi penutupan.
Tatabahasa
function parent() {
// variables of the parent
var child = () => {
// variables of child
// access variables of the parent
};
return child;
}
var child = parent();
child();
Dalam sintaks di atas, kita boleh mengakses semua pembolehubah fungsi induk di dalam fungsi anak, dan fungsi induk mengembalikan fungsi anak. Oleh itu, kita boleh memanggil fungsi anak secara tidak langsung dari luar fungsi induk, walaupun ia ditakrifkan dalam skop fungsi induk.
Pembina
Tatabahasa
Kita boleh menggunakan pembina untuk mencipta objek.
function constructor(property){
this.property = property
}
var string = new constructor("value");
Dalam sintaks di atas, kami mencipta objek pembina.
Kami mempelajari cara skop fungsi berfungsi untuk fungsi bersarang dengan dua contoh dalam tutorial ini. Selain itu, kami belajar tentang pelbagai jenis fungsi. Selain itu, terdapat beberapa jenis fungsi lain seperti fungsi rekursif atau panggil balik yang pengguna boleh terokai di internet.
Atas ialah kandungan terperinci Terokai konsep skop fungsi JavaScript dan pelbagai jenis fungsi JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
AI Hentai Generator
Menjana ai hentai secara percuma.
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
1378
52
Bagaimana saya membuat dan menerbitkan perpustakaan JavaScript saya sendiri?
Mar 18, 2025 pm 03:12 PM
Artikel membincangkan membuat, menerbitkan, dan mengekalkan perpustakaan JavaScript, memberi tumpuan kepada perancangan, pembangunan, ujian, dokumentasi, dan strategi promosi.
Bagaimanakah saya mengoptimumkan kod JavaScript untuk prestasi dalam penyemak imbas?
Mar 18, 2025 pm 03:14 PM
Artikel ini membincangkan strategi untuk mengoptimumkan prestasi JavaScript dalam pelayar, memberi tumpuan kepada mengurangkan masa pelaksanaan dan meminimumkan kesan pada kelajuan beban halaman.
Apa yang perlu saya lakukan jika saya menghadapi percetakan kod yang dihiasi untuk resit kertas terma depan?
Apr 04, 2025 pm 02:42 PM
Soalan dan penyelesaian yang sering ditanya untuk percetakan tiket kertas terma depan dalam pembangunan front-end, percetakan tiket adalah keperluan umum. Walau bagaimanapun, banyak pemaju sedang melaksanakan ...
Bagaimanakah saya boleh debug kod javascript dengan berkesan menggunakan alat pemaju pelayar?
Mar 18, 2025 pm 03:16 PM
Artikel ini membincangkan debugging JavaScript yang berkesan menggunakan alat pemaju pelayar, memberi tumpuan kepada menetapkan titik putus, menggunakan konsol, dan menganalisis prestasi.
Siapa yang dibayar lebih banyak Python atau JavaScript?
Apr 04, 2025 am 12:09 AM
Tidak ada gaji mutlak untuk pemaju Python dan JavaScript, bergantung kepada kemahiran dan keperluan industri. 1. Python boleh dibayar lebih banyak dalam sains data dan pembelajaran mesin. 2. JavaScript mempunyai permintaan yang besar dalam perkembangan depan dan stack penuh, dan gajinya juga cukup besar. 3. Faktor mempengaruhi termasuk pengalaman, lokasi geografi, saiz syarikat dan kemahiran khusus.
Bagaimanakah saya menggunakan peta sumber untuk debug kod JavaScript minified?
Mar 18, 2025 pm 03:17 PM
Artikel ini menerangkan cara menggunakan peta sumber untuk debug JavaScript minifikasi dengan memetakannya kembali ke kod asal. Ia membincangkan membolehkan peta sumber, menetapkan titik putus, dan menggunakan alat seperti Chrome Devtools dan Webpack.
Bermula dengan Chart.js: Pie, Donut, dan Carta Bubble
Mar 15, 2025 am 09:19 AM
Tutorial ini akan menerangkan cara membuat carta pai, cincin, dan gelembung menggunakan carta.js. Sebelum ini, kami telah mempelajari empat jenis carta carta.js: carta baris dan carta bar (tutorial 2), serta carta radar dan carta rantau polar (Tutorial 3). Buat carta pai dan cincin Carta pai dan carta cincin sangat sesuai untuk menunjukkan perkadaran keseluruhan yang dibahagikan kepada bahagian yang berlainan. Sebagai contoh, carta pai boleh digunakan untuk menunjukkan peratusan singa lelaki, singa wanita dan singa muda dalam safari, atau peratusan undi yang diterima oleh calon yang berbeza dalam pilihan raya. Carta pai hanya sesuai untuk membandingkan parameter tunggal atau dataset. Harus diingat bahawa carta pai tidak dapat menarik entiti dengan nilai sifar kerana sudut kipas dalam carta pai bergantung pada saiz berangka titik data. Ini bermaksud mana -mana entiti dengan perkadaran sifar
TypeScript untuk pemula, Bahagian 2: Jenis Data Asas
Mar 19, 2025 am 09:10 AM
Sebaik sahaja anda telah menguasai tutorial TypeScript peringkat kemasukan, anda harus dapat menulis kod anda sendiri dalam IDE yang menyokong TypeScript dan menyusunnya ke dalam JavaScript. Tutorial ini akan menyelam ke dalam pelbagai jenis data dalam TypeScript. JavaScript mempunyai tujuh jenis data: null, undefined, boolean, nombor, rentetan, simbol (diperkenalkan oleh ES6) dan objek. Typescript mentakrifkan lebih banyak jenis atas dasar ini, dan tutorial ini akan meliputi semuanya secara terperinci. Jenis data null Seperti JavaScript, Null dalam TypeScript
