Berbagi teknologi

Pertanyaan wawancara frekuensi tinggi front-end (1)

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Pertanyaan yang sering diajukan dalam wawancara JS front-end mencakup banyak aspek, termasuk sintaksis dasar, struktur dan algoritme data, operasi DOM, pemrograman asinkron, modularisasi, penggunaan kerangka kerja/perpustakaan, dll. Berikut ini adalah beberapa pertanyaan wawancara JS front-end frekuensi tinggi yang umum dan analisis singkatnya:

1. Tata bahasa dasar

  • Tipe data dan perbedaan penyimpanan : Tipe data apa yang ada di JavaScript? Apa perbedaan cara penyimpanannya dalam memori? (Seperti perbedaan antara tipe data primitif dan tipe data referensi)
  • deklarasi variabelvarletconst Apa bedanya? Apa cakupan dan siklus hidupnya?
  • Operatori++Dan++iApa bedanya?breakDancontinueApa bedanya bila digunakan dalam satu lingkaran?

2. Struktur data dan algoritma

  • Operasi susunan : Apa saja metode yang umum digunakan untuk array? (menyukaipushpopshiftunshiftspliceslicejoinsortTunggu)
  • Salinan dalam dan salinan dangkal :Apa itu salinan dalam dan salinan dangkal? Bagaimana cara menerapkannya? (Jika menggunakanJSON.parse(JSON.stringify(obj)), operator spread, rekursi dan metode lainnya)
  • Algoritma Penyortiran: Memahami dan menerapkan algoritma pengurutan (seperti bubble sort, quick sort, dll.)

3. Operasi DOM

  • Operasi DOM umum: Bagaimana cara melakukan operasi seperti memilih, menambah, menghapus, memodifikasi, dan memeriksa elemen DOM?
  • innerHTML dan innerText: Apa perbedaan dan skenario yang dapat diterapkan di antara keduanya?
  • penanganan acara :Apa model acara di JavaScript? Bagaimana cara menerapkan proksi acara?

4. Pemrograman asinkron

  • Janji : Apa itu Janji? Apa tiga negara bagiannya?Cara PenggunaanPromise.allDanPromise.race
  • Async/Menunggu : Bagaimana cara menggunakan async/menunggu untuk menangani operasi asinkron? Apa hubungannya dengan Janji?
  • Fungsi panggilan balik dan loop acara: Memahami mekanisme loop peristiwa JavaScript dan cara kerja fungsi panggilan balik?

5. Modularitas

  • Modular ES6: Memahami sintaks modular di ES6 (import/export), dan apa kelebihannya?
  • CommonJS dan AMD/CMD: Memahami dan membandingkan perbedaan dan skenario yang berlaku dari spesifikasi modul CommonJS, AMD dan CMD.

6. Penggunaan kerangka/perpustakaan

  • Bereaksi/Vue/Angular: Memahami dan membandingkan karakteristik, keunggulan, dan skenario yang dapat diterapkan dari kerangka kerja/pustaka front-end ini.
  • lingkaran kehidupan: Bagaimana siklus hidup komponen dalam framework seperti React dan Vue?
  • Manajemen status: Bagaimana cara menggunakan alat manajemen negara seperti Redux atau Vuex di React?

7. Masalah frekuensi tinggi lainnya

  • Prototipe dan Rantai Prototipe: Memahami mekanisme rantai prototipe dan prototipe dalam JavaScript dan fungsinya.
  • kata kunci ini: Memahami JavaScriptthismenunjukkan aturan dan kinerja dalam skenario yang berbeda.
  • Penutup: Memahami konsep, fungsi dan skenario penggunaan penutupan.
  • Mekanisme pengumpulan sampah: Memahami mekanisme pengumpulan sampah di JavaScript (seperti metode mark-sweep, metode penghitungan referensi, dll.).

Contoh pertanyaan dan analisis

Contoh pertanyaan: Tolong jelaskan mekanisme rantai prototipe dalam JavaScript.

menguraikan

  • Rantai prototipe adalah mekanisme untuk mengimplementasikan pewarisan dalam JavaScript.
  • Setiap benda mempunyai a__proto__Properti (disarankan di ES6Object.getPrototypeOf()metode), properti ini menunjuk ke konstruktornyaprototypeAtribut.
  • Saat mengakses properti atau metode suatu objek, jika properti atau metode tersebut tidak ada pada objek itu sendiri, maka akan dicari sepanjang rantai prototipenya hingga ditemukan atau mencapai puncak rantai prototipe (Object.prototype)。
  • Bagian atas rantai prototipe adalahnull, menunjukkan bahwa tidak ada lagi objek prototipe yang perlu dicari.
  • Melalui rantai prototipe, pembagian properti dan pewarisan metode antar objek dapat dicapai.

1. Apa saja tipe data dalam JavaScript? Apa perbedaan di antara keduanya?

menjawab
Ada 8 tipe data dalam JavaScript, termasuk tipe data dasar (Primitive Types) dan tipe data referensi (Reference Types).

  • Tipe data dasar
    • Belum diartikan: Tidak terdefinisi, nilai ketika variabel dideklarasikan tetapi tidak ditetapkan.
    • Batal: Nilai null, menunjukkan referensi objek kosong.
    • Bahasa Boolean: Tipe Boolean, dengan hanya dua nilai, benar dan salah.
    • Nomor: Tipe numerik, termasuk bilangan bulat dan bilangan floating point.
    • Rangkaian: Tipe string, digunakan untuk mewakili data teks.
    • Simbol: Tipe nilai unik yang digunakan untuk membuat pengidentifikasi unik.
    • BesarInt: Tipe bilangan bulat besar, digunakan untuk mewakili bilangan bulat dengan presisi sembarang.
  • Tipe data referensi
    • Obyek: Tipe objek, yang merupakan kelas dasar untuk semua tipe data kompleks dalam JavaScript, termasuk array (Array), fungsi (Function), tanggal (Date), dll.

Perbedaan utama antara tipe data primitif dan tipe data referensi adalah cara penyimpanan dan penetapannya. Nilai tipe data dasar disimpan dalam memori tumpukan, dan nilai disalin langsung selama penugasan; sedangkan nilai tipe data referensi disimpan dalam memori tumpukan, dan memori tumpukan menyimpan referensi (yaitu alamat) ke nilai tersebut. ​​di memori heap, yang disalin selama penugasan adalah referensi.

2. Bicara tentang cakupan dan penutupan dalam JavaScript?

menjawab

  • Cakupan : mengacu pada rentang pengidentifikasi yang valid seperti variabel dan fungsi dalam blok kode. JavaScript pada dasarnya memiliki dua cakupan: cakupan global dan cakupan lokal (termasuk cakupan fungsi, cakupan tingkat blok, dll.). Variabel dalam lingkup global terlihat di seluruh skrip, sedangkan variabel dalam lingkup lokal hanya dapat diakses di dalam blok kode yang mendefinisikannya.

  • Penutup : berarti suatu fungsi mengingat dan memiliki akses ke cakupan leksikalnya, meskipun fungsi tersebut dijalankan di luar cakupan leksikalnya. Kegunaan utama dari penutupan adalah untuk merangkum variabel pribadi, membuat modul, dll. Penutupan memungkinkan fungsi mengakses dan memanipulasi variabel di luar fungsi, dan variabel ini tidak mudah terkontaminasi atau diubah bahkan di luar fungsi.

3. Jelaskan pemrograman asynchronous dan Promise dalam JavaScript?

menjawab

  • Pemrograman asinkron : berarti urutan eksekusi kode tidak berdasarkan perintah penulisan, tetapi ditentukan berdasarkan selesainya kondisi tertentu (seperti permintaan jaringan, pembacaan dan penulisan file, dll.). JavaScript adalah single-threaded, tetapi mengimplementasikan pemrograman asinkron melalui event loop dan fungsi callback.

  • Janji : adalah objek baru yang diperkenalkan di ES6, digunakan untuk menangani operasi asinkron. Objek Promise mewakili operasi yang mungkin tidak selesai sekarang, namun akan selesai (atau gagal) di masa depan dan nilai hasilnya. Janji memiliki tiga keadaan: tertunda (sedang berlangsung), terpenuhi (berhasil) dan ditolak (gagal). Melalui Promise, kita dapat menulis kode asynchronous secara sinkron, membuat kode lebih ringkas, lebih mudah dipahami dan dipelihara.

4. Bicara tentang penggelembungan peristiwa dan pengambilan peristiwa dalam JavaScript?

menjawab

  • Acara menggelegak : berarti peristiwa dimulai dari elemen target dan kemudian menyebar hingga tingkat teratas pohon DOM (yaitu objek dokumen). Selama proses penggelembungan peristiwa, level elemen DOM mana pun dapat menangkap peristiwa tersebut dan memprosesnya.

  • penangkapan acara : Berlawanan dengan penggelembungan peristiwa, penangkapan peristiwa dimulai dari bagian atas pohon DOM dan kemudian menyebar ke bawah ke elemen target. Selama proses pengambilan peristiwa, elemen DOM tingkat mana pun dapat menangkap peristiwa dan memprosesnya.

Dalam JavaScript, Anda dapat mengatur metode pemrosesan peristiwa melalui parameter ketiga dari metode addEventListener, yaitu menggunakan penggelembungan peristiwa atau penangkapan peristiwa. Jika parameter ketiga benar berarti menggunakan event capture; jika salah atau dihilangkan berarti menggunakan event bubble.

5. Fitur baru apa saja yang diperkenalkan di ES6+?

menjawab
Banyak fitur baru telah diperkenalkan di ES6 (ECMAScript 2015) dan versi berikutnya, termasuk namun tidak terbatas pada:

  • biarkan dan konstanta: Digunakan untuk mendeklarasikan variabel lokal dan konstanta cakupan tingkat blok.
  • fungsi panah: Menyediakan cara penulisan fungsi yang lebih ringkas dan tidak mengikat this, argumen, dll.
  • string templat: Mengizinkan ekspresi tersemat dan mendukung string multi-baris.
  • Menghancurkan tugas: Memungkinkan data diekstraksi dari array atau objek dan ditetapkan ke variabel yang dideklarasikan.
  • Nilai parameter default, parameter yang tersisa, dan operator spread: Peningkatan kemampuan pemrosesan parameter fungsi.
  • Janji dan async/menunggu: Digunakan untuk menangani operasi asinkron, membuat kode asinkron lebih ringkas dan mudah dipahami.
  • Sintaks kelas: Menyediakan gula sintaksis untuk kelas yang lebih dekat dengan pemrograman berorientasi objek tradisional.
  • Modul: Mendukung sintaks modul ES6 dan mengimplementasikan pemrograman modular dalam JavaScript.