Clever Geek Handbook

Mempersiapkan wawancara front-end: 15 pertanyaan

Penulis artikel, yang terjemahannya kami terbitkan hari ini, mencantumkan 15 pertanyaan yang dia ajukan dalam wawancara, dan yang dia tanyakan kepada kandidat untuk posisi pengembang front-end sendiri.







1. Apakah DOM itu?



DOM (Document Object Model) adalah antarmuka pemrograman untuk dokumen HTML. Antarmuka ini memungkinkan Anda untuk mempengaruhi dokumen dari skrip, mengubah tampilan, gaya, isinya. Di DOM, dokumen direpresentasikan sebagai pohon node.



2. Apa perbedaan antara elemen <span> dan <div>?



  • <span> Merupakan elemen inline.
  • <div> Apakah elemen blok.


Elemen <div>harus digunakan untuk mengatur gaya bagian dokumen Elemen bertindak <span>sebagai wadah untuk sejumlah kecil teks, gambar, dan elemen halaman serupa lainnya.



Perlu dicatat bahwa Anda tidak dapat meletakkan elemen blok pada elemen sebaris. Berikut adalah contoh yang menunjukkan, antara lain, penempatan elemen blok yang salah di dalam elemen inline (ini adalah fragmen yang <div>I'm illegal</div>ditempatkan di dalam elemen <span>): 



<div>Hi<span>I'm the start of the span element <div>I'm illegal</div> I'm the end of the span</span> Bye I'm the end of the div</div>


3. Apa itu meta tag?



Tag meta adalah tag yang ditemukan di tag halaman <head>yang mendeskripsikan konten halaman. Tag meta tidak ditampilkan di halaman. Mereka hanya ditemukan dalam kodenya.



Tugas utama mereka adalah menjelaskan secara singkat konten halaman ke mesin pencari. Berikut contohnya: 



<head>
  <meta charset="UTF-8">
  <meta name="description" content="Description search engines use">
  <meta name="keywords" content="Keywords, of, your, page">
  <meta name="author" content="Me">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>


4. Apa perbedaan antara pengenal dan penyeleksi kelas di CSS?



Identifiers ( id) unik. Sebuah item hanya dapat memiliki satu pengenal. Hanya satu elemen dengan ID tertentu yang dapat ditampilkan di halaman.



Nama kelas ( class) tidak unik. Kelas yang sama dapat ditetapkan ke beberapa elemen. Sebuah elemen dapat diberikan beberapa kelas.



Jika gaya tertentu perlu diterapkan ke beberapa elemen halaman, tugas ini harus diselesaikan menggunakan kelas.



5. Bagaimana cara menggunakan kueri media di CSS?



Kueri media menggunakan aturan @mediayang memungkinkan Anda menerapkan gaya CSS ke berbagai jenis konten. Kueri media juga dapat digunakan untuk menyesuaikan elemen halaman berdasarkan karakteristik lingkungan tempat halaman dilihat. 



/*      <div>  "red"   ,      600px   */
@media only screen and (max-width: 600px) {
  div {
    background-color: red;
  }
}


6. Apa itu pseudo-class di CSS?



Di CSS, pseudo-class digunakan untuk mendeskripsikan gaya elemen yang berada dalam status khusus. Kelas semu dapat digunakan bersama dengan pemilih CSS untuk menyesuaikan tampilan elemen berdasarkan statusnya.



Berikut contohnya: 



/* 
     <a>,      ,     green. 
*/
a:hover {
  color: green;
}
/*     <a>      purple.*/
a:visited {
  color: purple;
}


Jika Anda ditanya apakah Anda dapat menamai pseudo-class, berikut adalah halaman dengan daftar besar dari mereka.



7. Apa perbedaan antara jenis pemosisian elemen berikut: relatif, tetap, absolut, statis?



  • Pemosisian relatif adalah ketika suatu elemen dipindahkan dari posisi defaultnya.
  • Pemosisian tetap adalah saat Anda menyesuaikan posisi elemen berdasarkan tepi jendela browser.
  • Pemosisian absolut adalah penempatan elemen relatif terhadap elemen induk yang diposisikan paling dekat, dan tepat di tempat yang ditentukan oleh pengembang.
  • Penentuan posisi statis adalah mode pemosisian default yang menampilkan item dalam urutan yang dijelaskan dalam dokumen.


8. Apa perbedaan antara permintaan PUT dan POST?



Permintaan PUT menghasilkan penggantian sumber daya target dengan data yang dikirimkan dalam permintaan. Ini dapat digunakan untuk memperbarui konten sumber daya yang ada atau untuk membuat sumber daya baru.



Permintaan POST menghasilkan pemrosesan khusus sumber daya dari data yang diteruskan dalam permintaan. Mereka dapat digunakan untuk melakukan berbagai tindakan. Termasuk - untuk membuat sumber daya baru, untuk mengunggah file ke server, untuk mengirimkan formulir.



Perbedaan lain antara permintaan PUT dan POST adalah bahwa permintaan PUT bersifat idempoten, tetapi permintaan POST tidak. Artinya, jika permintaan dengan data yang sama dikirim dan yang dijalankan di URL yang sama dijalankan beberapa kali, ini sama dengan menjalankan permintaan ini satu kali. Menjalankan permintaan POST beberapa kali tidak sama dengan mengeksekusinya satu kali. Artinya, beberapa permintaan semacam itu, misalnya, dapat mengarah pada pembuatan beberapa objek di server.



9. Apa perbedaan antara teknologi Long Polling, protokol WebSocket, dan peristiwa yang dihasilkan server?



  • Long Polling . , , , . .
  • WebSocket .
  • , , HTTP-, .


10. -, ?



Penyimpanan lokal, seperti namanya, adalah tempat yang dapat digunakan browser untuk menyimpan data secara lokal. Itu dapat menyimpan hingga 10 MB data. Penyimpanan sesi adalah jenis penyimpanan lokal yang terkait dengan sesi dan dihapus setelah selesai. Penyimpanan sesi dapat menyimpan data hingga 5 MB.



Cookie digunakan untuk menyimpan data dalam jumlah kecil, tidak melebihi 4 KB. Browser dapat menggunakannya, server dapat memintanya dari browser.



11. Apa itu CORS?



CORS (Cross-Origin Resource Sharing) adalah mekanisme berbasis browser yang memungkinkan halaman mengakses sumber daya di luar domain tertentu. Ini memperluas kapabilitas halaman dan menambah fleksibilitas pada kebijakan asal yang sama.



12. Apakah janji itu?



Janji adalah objek yang digunakan JavaScript saat melakukan operasi asinkron. Mereka membuatnya lebih mudah untuk bekerja dengan operasi asinkron dan menyediakan mekanisme penanganan error yang lebih nyaman daripada callback dan peristiwa.



13. Di negara bagian apa janji bisa dibuat?



Sebuah janji dapat berupa salah satu dari tiga kondisi:



  1. Terpenuhi - Operasi yang terkait dengan janji berhasil diselesaikan.
  2. Ditolak - Operasi yang terkait dengan janji diselesaikan dengan kesalahan.
  3. Menunggu keputusan - suatu janji dalam status menunggu keputusan, artinya, tidak dapat dikatakan telah diselesaikan dengan sukses atau dengan kesalahan.


14. Apakah variabel dan fungsi mengangkat di JavaScript?



Variabel dan fungsi yang diangkat adalah pergerakan deklarasi mereka ke atas ruang lingkupnya (lingkup global atau fungsi).



15. Nilai apa yang salah dalam JavaScript?



Dalam JavaScript, nilai palsu adalah nilai yang, ketika diubah menjadi tipe boolean, menjadi nilai false. Ini adalah nilai-nilai berikut:



  • '' 
  • 0 
  • batal
  • tidak terdefinisi
  • NaN
  • Salah
  • -0
  • 0n // nilai bertipe BigInt, jika dikonversi ke tipe boolean, berperilaku sama dengan nilai tipe Number


Hasil



Pertanyaan yang saya bagikan kepada Anda telah ditanyakan selama wawancara. Saya telah menanyakannya dalam wawancara dengan pengembang lain. Pertanyaan seperti ini, dilengkapi dengan tugas praktik, adalah cara yang baik untuk menguji pengetahuan seorang kandidat untuk posisi programmer front-end.



Saya pikir ada lebih banyak pertanyaan JavaScript untuk dipersiapkan untuk wawancara front-end daripada yang dibahas dalam artikel ini. Parsing pertanyaan tentang naskah juga bisa sangat membantu.



Jika Anda menyatakan dalam resume Anda bahwa Anda sudah familiar dengan kerangka front-end, ini berarti Anda harus mempersiapkan fakta bahwa Anda akan ditanyai pertanyaan tentang pengetahuan kerangka ini.



Pertanyaan apa yang telah Anda tanyakan dalam wawancara front-end?









More articles:


All Articles