Pembaca seperti Anda membantu mendukung MUO. Saat Anda melakukan pembelian menggunakan tautan di situs kami, kami dapat memperoleh komisi afiliasi.
Hoisting adalah mekanisme JavaScript yang memungkinkan Anda mengakses variabel dan fungsi sebelum Anda menginisialisasinya. Mengangkat deklarasi semacam itu secara efektif memindahkannya ke puncak cakupannya.
Pelajari semua tentang cara kerja hoisting di JavaScript dan cara terbaik mengelolanya untuk menghindari kesalahan dalam kode Anda.
Mengangkat Variabel Dengan var, let, dan const
Pengangkatan dimungkinkan karena JavaScript menggunakan sistem kompilasi JIT (Just-in-Time), yang memindai kode Anda untuk mengidentifikasi semua variabel dalam cakupannya masing-masing.
Kompiler JIT kemudian mengerek semua instance deklarasi variabel ke atas cakupannya saat kompilasi. JavaScript hanya mengerek deklarasi variabel, bukan inisialisasinya.
Perilaku variabel, saat diangkat, bergantung pada kata kunci yang Anda deklarasikan, karena setiap kata kunci berperilaku berbeda.
var
Mengakses variabel yang tidak diinisialisasi yang dideklarasikan dengan var kata kunci akan kembali belum diartikan. Misalnya:
menghibur.log (foo); // belum diartikan
var foo = 2;
Log kode di atas belum diartikan karena memanggil console.log sebelum menginisialisasi variabel.
Kompiler JavaScript melihat blok kode sebelumnya seperti ini:
var foo;
menghibur.log (foo); // belum diartikan
foo = 2;
Selama mengangkat, variabel mematuhi aturan pelingkupan JavaScript. Javascript hanya akan mengangkat variabel ke bagian atas cakupan tempat Anda mendeklarasikannya. Mencoba mencatat nilai variabel di luar cakupan yang dideklarasikan akan menghasilkan a ReferensiKesalahan. Misalnya, jika Anda mendeklarasikan sebuah variabel di dalam sebuah fungsi, itu tidak akan terlihat di luar lingkup itu:
fungsimyFunction() {
menghibur.log (foo); // belum diartikan
var foo = 10;
}
myFunction();
menghibur.log (foo); // ReferenceError: foo tidak didefinisikan
Mencoba mengakses variabel di luar cakupannya akan menghasilkan a ReferensiKesalahan.
biarkan dan const
Menurut MDN dokumentasi aktif membiarkan Dan const mengangkat, JavaScript juga mengangkat variabel yang dideklarasikan dengan the membiarkan Dan const kata kunci. Namun, tidak seperti variabel yang dideklarasikan dengan the var kata kunci, mereka tidak diinisialisasi dengan an belum diartikan nilai.
Misalnya:
fungsimyFunction() {
menghibur.log (foo); // belum diartikan
menghibur.log (bilah); // ReferenceError: Tidak dapat mengakses 'bar' sebelum inisialisasi
menghibur.log (baz); // ReferenceError: Tidak dapat mengakses 'baz' sebelum inisialisasivar foo = 5;
membiarkan batang = 10;
const baz = 15;
}
myFunction();
Anda tidak dapat mengakses variabel yang dideklarasikan dengan kata kunci let dan const sebelum menginisialisasinya dengan nilai.
Fungsi Angkat
Kerekan JavaScript berfungsi mirip dengan variabel. Seperti variabel, itu tergantung pada bagaimana Anda mendeklarasikannya. Misalnya, JavaScript mengerek deklarasi fungsi secara berbeda dari ekspresi fungsi.
Deklarasi fungsi adalah fungsi yang dideklarasikan dengan nama, sedangkan ekspresi fungsi adalah fungsi yang namanya dapat Anda hilangkan. Misalnya:
fungsifoo() {
// deklarasi fungsi
}
const bilah = () => {
// ekspresi fungsi
}
JavaScript mengerek deklarasi fungsi tetapi bukan ekspresi fungsi. Misalnya:
foo(); // 5
batang(); // TypeError: bar() bukan fungsi// Deklarasi Fungsi
fungsifoo() {
menghibur.catatan(5);
}
// Ekspresi Fungsi
var batang = fungsiekspresi() {
menghibur.catatan(10);
};
Kode ini memanggil foo sebelum mendeklarasikan dan menginisialisasi sebagai fungsi, tetapi masih mencatat 5 ke konsol. Namun, mencoba menelepon batang menghasilkan a TypeError.
Mengelola Mengangkat
Menyadari pengangkatan dan potensi kesalahan yang dapat terjadi jika dikelola secara salah dapat menghemat waktu lama Anda untuk melakukan debug. Berikut adalah beberapa cara Anda dapat mengelola mengangkat.
Mendeklarasikan Variabel Di Dalam Fungsi
Deklarasikan variabel di dalam fungsi yang akan mengaksesnya. Anda tidak selalu dapat melakukan ini, karena Anda mungkin memerlukan variabel global yang dapat Anda akses dalam beberapa fungsi. Jadi pastikan Anda hanya mendeklarasikan variabel secara global jika Anda benar-benar membutuhkannya.
Deklarasikan Variabel Dengan let atau const
Anda harus selalu menggunakan let dan Cawal kata kunci di tempat var kata kunci saat mendeklarasikan variabel. Praktik ini bermanfaat saat mendeklarasikan variabel lokal di dalam suatu fungsi. Mengetahui cara yang tepat untuk mendeklarasikan variabel dalam JavaScript mengurangi kemungkinan kesalahan yang disebabkan oleh pengangkatan yang terjadi di kode Anda.
Mendeklarasikan Variabel di Puncak Cakupannya
Deklarasikan semua variabel Anda di bagian atas cakupannya masing-masing, sebelum pernyataan lainnya. Melakukan hal itu akan memastikan kompiler JavaScript tidak harus mengangkat variabel tersebut untuk mengaksesnya.
Menggunakan Mode Ketat
Mode ketat adalah mode JavaScript yang mengatur sintaksis yang buruk, mengoptimalkan waktu proses kode Anda, dan melarang penyalahgunaan sintaks JavaScript yang diketik secara longgar dengan melempar kesalahan pada waktu kompilasi.
Misalnya, dalam "mode ceroboh", karena mengangkat, Anda dapat mengakses variabel di luar fungsi yang diinisialisasi, meskipun tidak dideklarasikan:
myFunction();
menghibur.log (foo); // 20
fungsimyFunction() {
foo = 20;
}
Pada blok kode di atas, JavaScript secara otomatis mendeklarasikan foo dan angkat ke atas lingkup global, abaikan lingkup tempat Anda menginisialisasi.
Anda dapat menggunakan mode ketat untuk memperbaiki perilaku ini dan melontarkan kesalahan jika Anda mencoba mengakses variabel di luar cakupan fungsinya.
Mode ketat tidak berhenti mengangkat sama sekali. Sebaliknya, ini mencegah bentuk pengangkat yang paling membingungkan dan rawan kesalahan. Masih penting untuk memahami konsep umum dan aturan di balik pengangkatan, bahkan saat menggunakan jaring pengaman mode ketat.
Untuk ikut serta dalam mode ketat di tingkat global, nyatakan sintaks di bagian atas file skrip Anda:
"menggunakanketat"; // atau 'menggunakanketat'
Untuk ikut serta dalam mode ketat pada tingkat fungsi, nyatakan sintaks di bagian atas badan fungsi sebelum pernyataan apa pun:
fungsimyStrictFunction() {
"menggunakanketat";
}
Jika Anda mendeklarasikan mode ketat pada level fungsi, pengaturan hanya akan berlaku untuk pernyataan di dalam fungsi tersebut.
Mendeklarasikan mode ketat di tingkat global mencegah variabel diakses di luar cakupannya masing-masing:
"menggunakanketat";
myFunction();
menghibur.log (foo); // ReferenceError: foo tidak didefinisikan
fungsimyFunction() {
foo = 20;
}
Dengan mode ketat dihidupkan, kompiler JavaScript akan mengerek Fungsiku() ke atas cakupannya tanpa variabel yang tidak dideklarasikan.
Pahami Apa yang Mempengaruhi Hoisting
Mengangkat cukup unik untuk JavaScript dan bisa menjadi perilaku yang sangat membingungkan untuk dipahami. Itu dapat memengaruhi variabel dan fungsi, tetapi ada cara untuk mencegahnya jika perlu.
Beberapa faktor dapat memengaruhi pengangkatan, jadi sebaiknya hindari kemunculan variabel atau fungsi yang mengangkat dalam kode Anda.
