100 Pertanyaan JavaScript Teoretis

Selamat siang teman!



Berikut adalah daftar dari 100 pertanyaan dasar JavaScript teratas dari repositori ini dengan jawaban singkat dan tautan ke Tutorial JavaScript Modern (JSR) Ilya Kantor dan MDN.



Daftar ini dan 300+ soal latihan tersedia di aplikasi saya .



Aplikasi menerapkan mekanisme untuk menghafal pertanyaan yang dipelajari, dan juga menyediakan pekerjaan dalam mode offline.



Saya mohon maaf atas kemungkinan kesalahan dan kesalahan ketik. Segala bentuk umpan balik sangat dihargai.



Edisi 14.09.



Lihat kelanjutannya di sini .

1. Bagaimana cara membuat sebuah benda?

Ada beberapa cara untuk melakukannya. Beberapa di antaranya adalah:

Objek literal:

const object = {}

Konstruktor objek (tidak disarankan):

const object = new Object()

Metode Object.create ()

Ketika menggunakan metode ini, sebuah objek diteruskan ke sana sebagai argumen, yang akan menjadi prototipe dari objek baru.

//     -  
const object = Object.create(null)

Fungsi konstruktor Kami membuat fungsi konstruktor dan menggunakan operator "baru" untuk membuat turunan dari fungsi ini - objek:

function Person (name) {
    const object = {}
    object.name = name
    object.age = 30
    return object
}
const user = new Person('')

Kelas:

class Person {
    constructor(name) {
        this.name = name
    }
}

const user = new Person('')

JSR

MDN

2. Apa prototipe itu?

Prototipe digunakan untuk membuat objek baru berdasarkan yang sudah ada. Teknik ini disebut pewarisan prototipe. Prototipe turunan objek tersedia melalui Object.getPrototypeOf (object) atau properti __proto__ ([[Prototype]] properti tersembunyi internal).







JSR

MDN

3. Apa perbedaan antara call (), apply () dan bind ()?

Perbedaan antara metode ini paling mudah dijelaskan dengan contoh.

Metode call () memanggil fungsi dengan nilai yang ditentukan ini dan argumen yang dipisahkan oleh koma.

const employee1 = { firstName: '', lastName: '' }
const employee2 = { firstName: '', lastName: '' }

function invite (greet1, greet2) {
    console.log(\`${greet1}, ${this.firstName} ${this.lastName}. ${greet2}\`)
}

invite.call(employee1, '', ' ?') // ,  .  ?
invite.call(employee2, '', ' ?') // ,  .  ?

Metode apply () memanggil fungsi dengan nilai ini dan argumen larik yang ditentukan.

const employee1 = { firstName: '', lastName: '' }
const employee2 = { firstName: '', lastName: '' }

function invite (greet1, greet2) {
    console.log(\`${greet1}, ${this.firstName} ${this.lastName}. ${greet2}\`)
}

invite.apply(employee1, ['', ' ?']) // ,  .  ?
invite.apply(employee2, ['', ' ?']) // ,  .  ?

Metode bind () mengembalikan fungsi baru dengan nilai yang ditentukan ini dan memungkinkan Anda untuk meneruskan array atau sejumlah argumen yang dipisahkan dengan koma padanya.

const employee1 = { firstName: '', lastName: '' }
const employee2 = { firstName: '', lastName: '' }

function invite (greet1, greet2) {
    console.log(\`${greet1}, ${this.firstName} ${this.lastName}. ${greet2}\`)
}

const inviteEmployee1 = invite.bind(employee1)
const inviteEmployee2 = invite.bind(employee2)
inviteEmployee1('', ' ?') // ,  .  ?
inviteEmployee2('', ' ?') // ,  .  ?

Jadi, metode call () dan apply () memanggil fungsi setelah terikat ke suatu objek. Perbedaan antara keduanya adalah cara penyampaian argumen. Perbedaan ini mudah diingat dengan huruf pertama dari metode ini: panggilan adalah koma (koma, c), terapkan adalah array (array, a). Metode bind () mengembalikan fungsi baru yang terikat ke objek yang ditentukan.



JSR - Panggil / Terapkan

JSR - Ikat

MDN - Hubungi

MDN - Terapkan

MDN - Ikat

4. Apa itu JSON dan metode apa yang dimilikinya?

JSON adalah format data tekstual berdasarkan sintaks objek JavaScript yang ditemukan oleh Douglas Crockford. Ini digunakan untuk mentransfer data melalui jaringan dan biasanya memiliki ekstensi .json dan aplikasi tipe MIME / json.

Parsing: Mengonversi string JSON menjadi objek.

JSON.parse(text)

Stringification: Mengonversi objek menjadi string JSON untuk transmisi melalui jaringan.

JSON.stringify(object)

JSR

MDN

5. Apa yang dilakukan metode Array.slice ()?

Metode slice () mengembalikan elemen array yang dipilih sebagai array baru. Ini mengembalikan item yang dimulai pada indeks yang ditentukan dalam argumen pertama dan diakhiri dengan, tetapi tidak termasuk, indeks yang ditentukan dalam argumen opsional kedua. Jika argumen kedua tidak ada, maka semua elemen yang dimulai dari indeks yang ditentukan dalam argumen pertama akan diambil.

const arrayIntegers = [1, 2, 3, 4, 5]
const arrayIntegers1 = arrayIntegers.slice(0, 2) // [1, 2]
const arrayIntegers2 = arrayIntegers.slice(2, 3) // [3]
const arrayIntegers3 = arrayIntegers.slice(4) // [5]

Perhatikan bahwa metode ini tidak mengubah larik asli, tetapi hanya mengembalikan sebagian darinya sebagai larik baru.



JSR

MDN

6. Apa yang dilakukan metode Array.splice ()?

Metode splice () digunakan untuk menambah atau menghapus elemen ke atau dari array. Argumen pertama menentukan posisi awal untuk menambah atau menghapus elemen, argumen opsional kedua menentukan jumlah elemen yang akan dihapus. Setiap argumen berikutnya (ketiga, dll.) Ditambahkan ke array:

let arrayOriginal1 = [1, 2, 3, 4, 5]
let arrayOriginal2 = [1, 2, 3, 4, 5]
let arrayOriginal3 = [1, 2, 3, 4, 5]

let array1 = arrayOriginal1.splice(0, 2) //  [1, 2];   = [3, 4, 5]
let array2 = arrayOriginal2.slice(3) //  [4, 5];   = [1, 2, 3]
let array3 = arrayOriginal3.slice(3, 1, 'a', 'b', 'c') //  [4];   = [1, 2, 3, 'a', 'b', 'c']

Perhatikan bahwa metode splice () memodifikasi larik asli dan mengembalikan larik dari elemen yang diekstrak.



JSR

MDN

7. Apa perbedaan antara slice () dan splice ()?

Perbedaan utamanya adalah sebagai berikut:



JSR

MDN - Slice

MDN - Sambungan

8. Bagaimana objek dan peta dibandingkan?

Objek mirip dengan peta karena keduanya memungkinkan Anda untuk mengatur kunci pada nilai, mengambil nilai, menghapus kunci, dan menentukan apakah suatu nilai ada berdasarkan kunci. Untuk alasan ini, objek digunakan sebagai peta. Namun, ada beberapa perbedaan di antara keduanya yang membuat penggunaan kartu lebih disukai dalam kasus tertentu.

• Tombol objek hanya dapat berupa string dan simbol, dan tombol peta dapat berupa nilai apa pun, termasuk fungsi dan objek
• Kunci peta diurutkan, tetapi kunci objek tidak. Jadi saat melakukan iterasi, kunci peta dikembalikan sesuai urutan penambahannya
• Anda bisa mendapatkan ukuran peta menggunakan properti size dan jumlah properti objek ditentukan secara manual
• Peta adalah entitas yang dapat berulang, dan untuk melakukan iterasi pada suatu objek, Anda harus terlebih dahulu mendapatkan kuncinya, dan kemudian mengulanginya
• Saat menggunakan objek sebagai peta, ingatlah bahwa objek apa pun memiliki prototipe, sehingga kunci peta itu sendiri dapat tumpang tindih dengan kunci yang ditentukan pengguna. Oleh karena itu, Object.create (null) harus digunakan untuk membuat objek peta, tetapi sekarang metode ini jarang digunakan.
• Objek lebih rendah dari peta dalam hal kinerja ketika harus menambahkan / menghapus kunci dengan cepat

JSR

MDN

9. Apa perbedaan antara operator "==" dan "==="?

JavaScript menyediakan dua cara untuk membandingkan nilai: ketat (=== ,! ==) dan abstrak (== ,! ==). Dalam perbandingan yang ketat, nilai dibandingkan sebagaimana adanya, dan dalam perbandingan yang lemah, jika perlu, konversi implisit (casting) jenis nilai dilakukan. Operator yang ketat menggunakan aturan berikut untuk membandingkan tipe nilai yang berbeda:

• Dua string sama persis jika memiliki himpunan karakter yang sama, panjang yang sama, dan karakter yang sama pada posisi yang sama
• Dua angka benar-benar sama jika nilainya sama. Ada dua kasus khusus:
  
  
  
  
  • NaN sama dengan tidak ada, termasuk NaN
  • Angka nol positif dan negatif sama satu sama lain
  
  
  
• Nilai Boolean benar-benar sama jika keduanya benar atau salah, mis. benar atau salah
• Dua objek sama persis jika merujuk ke objek yang sama (lokasi memori)
• null === undefined mengembalikan false dan null == undefined mengembalikan true

Beberapa contoh:

0 == false // true
0 === false // false
1 == "1" // true
1 === "1" // false
null == undefined // true
null === undefined // false
'0' == false // true
'0' === false // false
[] == [] // 
[] === [] // false,      
{} == {} // 
{} === {} // false,      

JSR

MDN

10. Apa fungsi lambda atau panah?

Fungsi panah adalah cara singkat menulis ekspresi fungsional. Mereka tidak memiliki ini, argumen, super dan target baru. Fungsi ini berfungsi sebagai alternatif yang baik untuk fungsi yang tidak memiliki metode, tetapi tidak dapat digunakan sebagai konstruktor.

function regularSum (x, y) {
    return x + y
}

const arrowSum = (x, y) => x + y

JSR

MDN

11. Mengapa fungsi disebut objek kelas satu?

Dalam JavaScript, fungsi adalah objek kelas satu. Artinya, fungsi dapat digunakan seperti variabel biasa.

Misalnya, suatu fungsi dapat dikirimkan sebagai argumen ke fungsi lain, dikembalikan sebagai nilai dari fungsi lain, dan ditetapkan ke variabel. Contoh berikut menetapkan fungsi ke penangan:

const handler = () => console.log(' -   ')
document.addEventListener('click', handler)

JSR

MDN

12. Apa itu fungsi orde pertama?

Fungsi orde pertama adalah fungsi yang tidak menggunakan fungsi lain sebagai argumen dan tidak mengembalikan fungsi sebagai nilai:

const firstOrder = () => console.log(' -   ')

JSR

MDN

13. Apakah fungsi orde tinggi itu?

Fungsi tingkat tinggi adalah fungsi yang menggunakan fungsi lain sebagai argumen, atau mengembalikan fungsi lain sebagai nilai:

const firstOrderFun = () => console.log(' -   ')
const higherOrder = returnFirstOrderFun => returnFirstOrderFun()
higherOrder(firstOrderFunc)

JSR

MDN

14. Apa yang dimaksud dengan fungsi unary?

Fungsi unary (fungsi monad) adalah fungsi yang hanya membutuhkan satu argumen:

const unaryFun = a => console.log(a + 10) //  10        

JSR

MDN

15. Apa itu kari?

Currying adalah proses mengubah fungsi dengan banyak parameter menjadi beberapa fungsi dengan satu parameter. Proses ini dinamai ahli matematika Haskell Curry. Currying mengubah satu fungsi n-ary menjadi beberapa fungsi unary (mengurangi arity dari fungsi tersebut):

const sum = (a, b, c) => a + b + c
const currySum = a => b => c => a + b + c

currySum(1) //  : b => c => 1 + b + c
currySum(1)(2) //  : c => 3 + c
currySum(1)(2)(3) //   6

Currying digunakan untuk mengaktifkan kembali kode (aplikasi fungsi parsial) dan untuk membuat komposisi fungsi.



JSR

16. Apakah fungsi murni?

Fungsi murni adalah fungsi yang nilai kembaliannya hanya bergantung pada argumen yang diteruskan, tanpa efek samping. Sederhananya, jika Anda memanggil suatu fungsi n kali dengan n argumen, dan fungsi tersebut selalu mengembalikan nilai yang sama, maka itu bersih:

//  
let numberArray = []
const impureAddNumber = number => numberArray.push(number)
// 
const pureAddNumber = number => argNumberArray => argNumberArray.concat([number])

console.log(impureAddNumber(1)) // 1
console.log(numberArray) // [1]
console.log(pureAddNumber(2)(numberArray)) // [1, 2]
console.log(numberArray) // [1]

Dalam contoh di atas, impureAddNumber bukanlah fungsi murni karena metode push () mengembalikan panjang baru array, yang tidak bergantung pada argumen yang diteruskan. Fungsi kedua adalah murni karena metode concat () menggabungkan dua larik tanpa efek samping dan mengembalikan larik baru. Fungsi murni sangat penting untuk pengujian unit dan tidak memerlukan injeksi ketergantungan. Tidak adanya efek samping meningkatkan keandalan aplikasi karena koneksi yang lebih lemah antara elemen-elemennya. Salah satu inkarnasi prinsip ini adalah konsep kekekalan, yang diperkenalkan di ES6, yang lebih memilih const daripada membiarkan.



JSR

MDN

17. Untuk apa kata kunci "biarkan" digunakan?

Kata kunci let mendeklarasikan variabel lokal cakupan-blok. Ruang lingkup variabel semacam itu dibatasi oleh blok, operator, atau ekspresi yang digunakannya. Variabel yang dideklarasikan dengan kata kunci "var" memiliki cakupan global atau fungsi di mana mereka didefinisikan:

let counter = 1
if (counter === 1) {
    let counter = 2
    console.log(counter) // 2
}
console.log(counter) // 1 ( counter,   ,   )

JSR

MDN

18. Apa perbedaan antara let dan var?

Perbedaan utamanya adalah sebagai berikut:



Beberapa contoh:

function userDetails(username) {
    if (username) {
        console.log(salary)
        console.log(age)
        let age = 30
        var salary = 10000
    }
    console.log(salary) // 10000 (  )
    console.log(age) // SyntaxError: "age" is not defined (  )
}

JSR

MDN - misalkan

MDN - var

19. Mengapa kata "biarkan" dipilih sebagai kata kunci?

Let adalah operator matematika yang digunakan oleh bahasa pemrograman awal seperti Skema dan Dasar. Sekarang mari digunakan oleh banyak bahasa pemrograman, jadi kata ini adalah alternatif yang paling dekat dengan singkatan "var" (variabel).



JSR

MDN

20. Bagaimana cara menimpa variabel dalam blok saklar?

Jika Anda mencoba untuk mengganti variabel yang dideklarasikan dengan kata kunci "let" di blok saklar, Anda akan mendapatkan kesalahan:

let counter = 1
switch(x) {
    case 0:
        let name
        break
    case 1:
        let name // SyntaxError
        break
}

Untuk mengatasi masalah ini, Anda perlu membuat blok baru di dalam case - lingkup leksikal baru:

let counter = 1
switch(x) {
    case 0: {
        let name
        break
    }
    case 1: {
        let name
        break
    }
}

JSR

MDN

21. Apakah zona mati sementara itu?

Jika Anda mencoba mengakses variabel yang dideklarasikan dengan kata kunci "let" atau "const" (tetapi bukan "var") sebelum variabel tersebut ditentukan (yaitu, sebelum variabel tersebut diberi nilai dalam cakupan saat ini), pengecualian ReferenceError akan muncul (error referensi ). Dengan kata lain, zona waktu mati adalah waktu antara pembuatan konteks (cakupan) variabel dan definisinya:

function someMethod () {
    console.log(counter1) // undefined
    console.log(counter2) // ReferenceError
    var counter1 = 1
    const counter2 = 2
}

MDN

22. Apa yang dimaksud dengan Ekspresi Fungsi Segera Diminta (IIFE)?

IIFE adalah fungsi yang dipanggil segera setelah definisi. Sintaks untuk fungsi semacam itu mungkin terlihat seperti ini (salah satu opsinya, yang paling umum):

(function () {
    // 
})()

// ,      
(() => {
    // 
})()

Alasan utama menggunakan IIFE adalah untuk menjaga kerahasiaan variabel, karena variabel yang dideklarasikan di dalam IIFE tidak dapat diakses dari lingkungan luar:

(function () {
    var message = 'IIFE'
    console.log(message)
})()
console.log(message) // SyntaxError: "message" is not defined

JSR

MDN

23. Apa keuntungan menggunakan modul?

Di antaranya, berikut ini yang bisa disebutkan:

• Meningkatkan keterbacaan dan pemeliharaan kode yang lebih mudah
• Kode yang dapat digunakan kembali
• Menjaga Kebersihan Ruang Nama Global

JSR

MDN

24. Apakah menghafal atau memoization?

Memoisasi adalah cara untuk meningkatkan kinerja suatu fungsi dengan menyimpan hasil yang diterima sebelumnya dari fungsi itu di cache. Setiap kali fungsi dipanggil, argumen yang diteruskan ke sana menjadi indeks cache. Jika data ada di cache, itu dikembalikan tanpa menjalankan kembali fungsinya. Jika tidak, fungsi akan dijalankan dan hasilnya akan ditulis ke cache:

const memoAdd = () => {
    let cache = {}
    return value => {
        if (value in cache) {
            console.log('   ')
            return cache[value] //   , cache.value        ,     JavaScript     .    
        } else {
            console.log(' ')
            let result = value + 20
            cache[value] = result
            return result
        }
    }
}
//    memoAdd
const add = memoAdd()
console.log(add(20)) //   40
console.log(add(20)) //     40

25. Apa itu hoisting?

Mengangkat adalah proses pemindahan variabel dan ekspresi fungsi ke awal ruang lingkupnya sebelum menjalankan kode. Ingat: hanya variabel dan ekspresi itu sendiri yang diangkat, bukan inisialisasinya (yaitu deklarasi variabel diangkat, bukan pemberian nilai padanya):

console.log(message) // undefined
var message = '!'

Untuk interpreter, kode ini terlihat seperti ini:

var message
console.log(message)
message = '!'

JSR

MDN

26. Apakah kelas itu?

Kelas yang diperkenalkan di ES6 adalah gula sintaksis (pembungkus, abstraksi, atau add-on) untuk pewarisan prototipe (untuk prototipe fungsi konstruktor). Contoh fungsi konstruktor:

function Bike(model, color) {
    this.model = model
    this.color = color
}

Bike.prototype.getDetails = function () {
    return ' ' + this.model + '   ' + this.color + ' .'
}

Contoh yang sama menggunakan kelas:

class Bike {
    constructor (color, model) {
        this.color = color
        this.model = model
    }

    getDetails () {
        return \` ${this.model}   ${this.color} .\`
    }
}

JSR

MDN

27. Apakah penutupan?

Closure adalah kombinasi dari fungsi dan lingkungan leksikal nya. Secara sederhana, closure adalah saat fungsi dalam memiliki akses ke variabel yang dideklarasikan di fungsi luar. Penutupan memiliki rantai tiga cakupan:

• Ruang lingkupnya sendiri
• Ruang lingkup fungsi eksternal
• Ruang lingkup global

const welcome = name => {
    const greet = message => {
        console.log(\`${message}, ${name}!\`)
    }
    return greet
}

const fun = welcome('')
fun('') // , !

JSR

MDN

28. Apa itu modul?

Modul adalah potongan kecil kode independen dan dapat digunakan kembali yang mendasari banyak pola desain. Kebanyakan modul diekspor sebagai objek, fungsi, atau konstruktor.



JSR

MDN

29. Apa itu ruang lingkup?

Scope mendefinisikan ketersediaan variabel, fungsi, dan objek di berbagai tempat dalam kode selama pelaksanaannya. Dengan kata lain, ruang lingkup adalah visibilitas variabel dan sumber daya lain dalam konteks eksekusi kode saat ini.



MDN

30. Apakah pekerja layanan itu?

Pekerja layanan adalah skrip yang berjalan secara independen dari halaman web tempat ia dijalankan dan tindakan pengguna. Faktanya, pekerja layanan bertindak sebagai server proxy antara aplikasi dan browser. Kemampuan utama service worker adalah sebagai berikut: memastikan aplikasi offline, sinkronisasi latar belakang berkala, pemberitahuan push, mencegat dan memproses permintaan jaringan, dan mengelola cache secara terprogram.



MDN

31. Bagaimana Anda berinteraksi dengan Document Object Model (DOM) menggunakan service worker?

Pekerja layanan tidak memiliki akses langsung ke DOM. Namun, mereka dapat berinteraksi dengan halaman melalui antarmuka postMessage, dan halaman dapat memodifikasi DOM.



MDN - ServiceWorker

MDN - postMessage

32. Bagaimana cara menggunakan kembali informasi saat memulai ulang service worker?

Salah satu masalah dengan service worker adalah mereka berhenti mengeksekusi saat tidak digunakan dan memulai ulang saat diperlukan. Ini mencegah Anda menambahkan penangan peristiwa pengambilan dan pesan secara global. Untuk menggunakan kembali informasi, penting untuk memastikan bahwa service worker berinteraksi dengan database terindeks (IndexedDB) atau penyimpanan lokal (penyimpanan lokal).



MDN

33. Apa itu database terindeks (IndexedDB)?

IndexedDB adalah API tingkat rendah untuk menyimpan data terstruktur dalam jumlah besar, termasuk file dan blob, di sisi klien. Antarmuka ini menggunakan indeks untuk meningkatkan kecepatan pengambilan data.



JSR

MDN

34. Apakah Penyimpanan Web itu?

Penyimpanan web adalah antarmuka yang memungkinkan Anda menyimpan data sebagai pasangan kunci / nilai secara lokal, mis. di browser pengguna, dengan cara yang lebih nyaman daripada menggunakan cookie. Penyimpanan web menyediakan dua mekanisme penyimpanan:

• Penyimpanan lokal (penyimpanan lokal) - menyimpan data pengguna saat ini untuk waktu yang tidak terbatas
• Penyimpanan sesi - menyimpan data selama sesi saat ini, mis. saat menutup tab browser, data akan hilang

JSR

MDN

35. Apakah postMessage itu?

postMessage adalah cara berkomunikasi antara berbagai sumber objek jendela (misalnya, halaman dan popup yang dihasilkannya (jendela pop-up) atau halaman dan iframe tertanam). Biasanya, skrip di satu halaman tidak memiliki akses ke halaman lain jika halaman tersebut mengikuti Common Origin atau Single Source Policy (source - protocol, host dan port).



MDN - postMessage

36. Apakah cookie itu?

Cookie adalah sepotong kecil data yang disimpan di komputer pengguna untuk digunakan nanti oleh browser. Cookie disimpan sebagai pasangan kunci / nilai:

document.cookie = 'username='

JSR

MDN

37. Mengapa kita membutuhkan cookie?

Cookies digunakan untuk menyimpan informasi tentang pengguna (tidak disarankan untuk menyimpan informasi rahasia). Biasanya proses ini terdiri dari dua tahap:

• Pada kunjungan pertama ke halaman tersebut, profil pengguna disimpan dalam cookie
• Saat mengunjungi kembali halaman tersebut, profil pengguna diambil dari cookie

JSR

MDN

38. Apa saja kemampuan cookie?

Secara default, cookie dihapus saat browser ditutup, namun ini dapat diubah dengan menyetel kedaluwarsa dalam UTC:

document.cookie = 'username=; expires=Sat, 5 Sep 2020 12:00:00 UTC'

Secara default, cookie adalah milik halaman saat ini, namun ini juga dapat diubah dengan menyetel jalur:

document.cookie = 'username=; path=/services'

JSR

MDN

39. Bagaimana cara menghapus cookie?

Anda dapat menghapus cookie dengan menyetel waktu yang telah berlalu sebagai seumur hidup. Dalam kasus ini, Anda tidak perlu menentukan nilai cookie:

document.cookie = 'username=; expires=Sat, 05 Jun 2020 00:00:00 UTC; path=/;'

Harap dicatat bahwa dalam kasus ini perlu untuk menentukan jalur untuk menghapus cookie yang benar. Beberapa browser tidak mengizinkan Anda menghapus cookie tanpa menentukan parameter ini.



JSR

MDN

40. Apa perbedaan antara cookie, penyimpanan lokal, dan penyimpanan sesi?

Perbedaan utamanya adalah sebagai berikut:



JSR - Cookie

MDN - Cookie

JSR - Penyimpanan Lokal, MDN SessionStotage

- Penyimpanan Web

41. Apa perbedaan utama antara penyimpanan lokal dan sesi?

Penyimpanan lokal sama dengan penyimpanan sesi, kecuali yang pertama, data disimpan bahkan ketika browser ditutup dan dimulai ulang, dan yang kedua, data dihapus di akhir sesi (menutup tab browser).



JSR

MDN

42. Bagaimana cara mengakses penyimpanan web?

Objek jendela menyediakan objek WindowLocalStorage dan WindowSessionStorage yang masing-masing memiliki properti localStorage dan sessionStorage. Properti ini membuat instance objek Storage, yang dengannya Anda dapat menulis, mengambil, dan menghapus data untuk domain dan jenis penyimpanan tertentu (sesi atau lokal):

//  
localStorage.setItem('data', document.querySelector('.data').value)
//  
localStorage.getItem('data')

JSR

MDN

43. Metode apa yang disediakan penyimpanan sesi?

Penyimpanan sesi menyediakan metode untuk membaca, menulis, dan menghapus data:

//  
sessionStorage.setItem('key', 'value')

//  
const data = sessionStorage.getItem('key')

//   
sessionStorage.removeItem('key')

//   
sessionStorage.clear()

JSR

MDN

44. Peristiwa apa yang terjadi saat bekerja dengan penyimpanan web?

Ketika penyimpanan berubah dalam konteks dokumen lain, acara penyimpanan dimunculkan:

window.onstorage = function () {}

Contoh penanganan event ini:

window.onstorage = event => {
    console.log(\`${event.key}  .
     : ${event.oldValue}.
     : ${event.newValue}.\`)
}

Acara ini memungkinkan Anda menerapkan semacam obrolan.



JSR

MDN

45. Untuk apa penyimpanan web digunakan?

Penyimpanan web lebih aman dan dapat menyimpan lebih banyak data daripada cookie tanpa memengaruhi kinerja. Selain itu, tidak ada data yang dikirim ke server (dalam kasus cookie, data disertakan dalam header permintaan dan respons setiap kali klien mengakses server). Oleh karena itu, cara menyimpan data ini lebih disukai daripada cookie.



JSR

MDN

46. ​​Bagaimana cara mengetahui apakah browser mendukung Penyimpanan Web?

Sebelum menggunakan penyimpanan web, disarankan untuk memeriksa dukungan browser untuk antarmuka ini:

if (typeof(Storage) !== 'undefined') {
    // 
} else {
    // -  
}

// 
if ('Storage' in window) {
    console.log('ok')
} else {
    console.warn(' ok')
}

Menurut CanIUse , dukungan penyimpanan web adalah 98% saat ini.



JSR

MDN

47. Bagaimana cara mengetahui apakah browser mendukung pekerja layanan?

Sebelum menggunakan service worker, disarankan untuk memeriksa dukungan browser untuk antarmuka ini:

if (typeof(Worker) !== undefined) {
    // 
} else {
    // -  
}
// 
if ('Worker' in window) {
    console.log('ok')
} else {
    console.warn(' ok')
}

Menurut CanIUse , dukungan pekerja layanan adalah 94% hari ini.



MDN

48. Berikan contoh web worker

Untuk menggunakan pekerja web, Anda perlu melakukan hal berikut.

Buat file untuk pekerja, misalnya get-current-time.js:

const getCurrentTime = () => {
    let time = new Date().toLocaleTimeString()
    postMessage(time)
    setTimeout(() => getCurrentTime(), 1000)
}

getCurrentTime()

Metode postMessage () digunakan untuk mengirim pesan ke halaman.

Buat objek pekerja:

const worker = new Worker('get-current-time.js')

Setelah itu, kami memproses penerimaan pesan dari pekerja:

<output></output>
<button></button>

worker
    .addEventListener('message', event => document.querySelector('output')
    .textContent = event.data)

Pekerja akan terus memproses peristiwa pesan bahkan setelah skrip eksternal menyelesaikan pekerjaannya, jadi harus dihentikan secara paksa:

document.querySelector('button')
    .addEventListener('click', () => worker.terminate())

Jika Anda menyetel pekerja ke tidak ditentukan, Anda dapat menggunakannya kembali:

worker = undefined

MDN

49. Apa batasan pekerja web untuk bekerja dengan DOM

Karena pekerja web dibuat dalam file terpisah, mereka tidak memiliki akses ke objek berikut:

• jendela
• Dokumen
• Objek induk - objek yang memulai pekerja

MDN

50. Apakah janji itu?

Promise (komunikasi) adalah objek yang dieksekusi dengan beberapa nilai atau ditolak dengan kesalahan. Janji diselesaikan baik setelah waktu tertentu berlalu atau setelah peristiwa tertentu terjadi. Sebuah janji dapat memiliki salah satu dari tiga kondisi: menunggu keputusan, dipenuhi, dan ditolak.

Sintaks janji:

const promise = new Promise((resolve, reject) => {
    // 
})

// ,   ,    
const promise = Promise.resolve(value)
promise.then(value => {
    // 
})

Contoh penggunaan promise:

const promise = new Promise(resolve => {
    const timer = setTimeout(() => {
        resolve('  !')
        clearTimeout(timer)
    }, 5000);
}, reject => {
    reject('-   ')
})

promise
    .then(value => console.log(value))
    .catch(error => console.error(error))
    .finally(() => console.log(' ')) //     "  !"  5    " "

Algoritma Resolusi Janji:







JSR

MDN

51. Mengapa janji dibutuhkan?

Janji digunakan untuk bekerja dengan kode asinkron. Mereka adalah alternatif dari fungsi callback, menghindari apa yang disebut "callback hell", membuat kode lebih bersih dan lebih mudah dibaca.



JSR

MDN

52. Sebutkan tiga kemungkinan kondisi janji

Janji memiliki tiga kondisi:

• Tertunda: tahapan sebelum memulai operasi
• Terpenuhi: operasi berhasil diselesaikan
• Ditolak: Operasi gagal. Pengecualian dilemparkan

JSR

MDN

53. Apakah yang dimaksud dengan fungsi panggilan balik?

Callback adalah fungsi yang diteruskan ke fungsi lain sebagai argumen. Fungsi ini (internal) dipanggil di dalam induk (eksternal) untuk melakukan operasi ketika peristiwa tertentu terjadi. Mari kita lihat contoh sederhana:

function callback(name) {
    alert(\`, ${name}!\`)
}

function outer(cb) {
    const name = prompt(',   ')
    cb(name)
}
outer(callback)

Dalam contoh di atas, fungsi luar meminta nama pengguna dan menyimpannya dalam variabel nama. Fungsi ini kemudian meneruskan nama ke fungsi panggilan balik, yang menghasilkan salam dengan nama pengguna.



JSR

MDN

54. Mengapa kita membutuhkan panggilan balik?

Callback diperlukan karena JavaScript adalah bahasa yang digerakkan oleh peristiwa. Artinya, sebagai contoh, alih-alih menunggu respons atas permintaan atau peristiwa tertentu diproses, JavaScript terus merespons peristiwa lain. Pertimbangkan contoh di mana satu fungsi mengakses antarmuka dan fungsi lainnya mencetak pesan ke konsol:

function first () {
    //    API
    setTimeout(() => console.log('  '), 1000)
}

function second () {
    console.log('  ')
}

first()
second()
//    "  ",  "  "

Seperti yang Anda lihat, JavaScript tidak menunggu hingga fungsi pertama selesai, tetapi terus menjalankan kode. Oleh karena itu, callback digunakan untuk mensimulasikan asynchrony, mencegah pemblokiran thread program utama.



JSR

MDN

55. Apakah callback hell?

Callback hell adalah anti-pola di mana beberapa fungsi callback bertumpuk satu sama lain untuk mengimplementasikan logika asynchronous. Struktur kode ini sulit untuk dipahami dan dipelihara. Ini mungkin terlihat seperti ini:

function first () {
    return function second () {
        return function third () {
            return function fourth () {
                //  ..
            }
        }
    }
}

Pendekatan pengkodean ini dianggap praktik yang buruk, kecuali dalam kasus kari, aplikasi sebagian, atau komposisi fungsi.



JSR

MDN

56. Apakah peristiwa yang dikirim server (SSE) itu?

Peristiwa Terkirim Server adalah teknologi pemberitahuan push yang memungkinkan browser menerima data yang diperbarui dari server melalui koneksi HTTP tanpa mengirim permintaan. Ini adalah salah satu cara komunikasi antara klien dan server, ketika pesan hanya dikirim oleh server. Teknologi ini digunakan untuk memperbarui Facebook / Twitter, harga toko, umpan berita, dll.



JSR

MDN

57. Bagaimana cara menerima pesan (notifikasi atau peristiwa) yang dikirim oleh server?

Objek EventSource digunakan untuk ini:

if('EventSource' in window) {
    const source = new EventSource('sse.js')
    source.addEventListener('message', event => document.querySelector('output')
        .textContent = event.data)
}

JSR

MDN

58. Bagaimana cara memeriksa dukungan browser untuk SSE?

Ini dilakukan seperti ini:

if (typeof EventSource !== 'undefined') {
    // 
} else {
    // SSE  
}

// 
('EventSource' in window)
    ? console.log('ok')
    : console.warn('! ok')

Menurut CanIUse, 95% browser saat ini didukung oleh SSE.



JSR

MDN

59. Peristiwa apa yang terjadi saat bekerja dengan SSE?

Berikut adalah daftar acara tersebut:



JSR

MDN

60. Apa aturan dasar untuk bekerja dengan janji?

Aturan dasar untuk bekerja dengan promise adalah sebagai berikut:

• Promise adalah objek yang berisi metode built-in atau standar then ()
• Tahap menunggu janji, biasanya diakhiri dengan tahap pemenuhan atau penolakannya
• Status janji yang dipenuhi atau ditolak tidak boleh berubah setelah diputuskan
• Setelah menyelesaikan sebuah janji, nilainya juga tidak boleh berubah.

JSR

MDN

61. Apakah yang dimaksud dengan panggilan balik dalam panggilan balik?

Anda dapat menyarangkan callback satu sama lain untuk melakukan operasi tertentu secara berurutan:

loadScript('/script1.js', script => {
    console.log(\` ${script} \`)

    loadScript('/script2.js', script => {
        console.log(\` ${script} \`)

        loadScript('/script3.js', script => {
            console.log(\` ${script} \`)
        })
    })
})

JSR

MDN

62. Apakah rantai janji itu?

Eksekusi berurutan dari beberapa tugas asinkron menggunakan janji disebut rantai janji. Mari pertimbangkan sebuah contoh:

new Promise((resolve, reject) => {
    const id = setTimeout(() => {
        resolve(1)
        clearTimeout(id)
    }, 1000)
}).then(result => {
    console.log(result) // 1
    return result * 2
}).then(result2 => {
    console.log(result2) // 2
    return result2 * 3
}).then(result3 => {
    console.log(result3) // 6
}).catch(error => console.error(error))

Algoritma eksekusi:

• Janji pertama terpecahkan dengan nilai 1
• Setelah itu, metode then () pertama mencetak nilai ini ke konsol dan mengembalikannya dikalikan dengan 2
• Yang kedua then () mencetak hasil dari yang pertama kemudian () ke konsol (2) dan mengembalikan hasil dikalikan dengan 3
• Last then () mencetak hasil detik then () ke konsol (6)
• Blok tangkapan digunakan untuk menangani kesalahan

JSR

MDN

63. Apa itu Promise.all ()?

Promise.all () adalah sebuah janji yang mengambil array dari promise lain sebagai argumen dan mengembalikan hasil dari promise yang terpenuhi atau kesalahan jika ditolak. Sintaksis:

Promise.all([Promise1, Promise2, Promise3])
    .then(results => console.log(results))
    .catch(error => console.error(error))

Ingat, urutan pengaktifan hasil bergantung pada urutan promise dalam larik.



JSR

MDN

64. Apa itu Promise.race ()?

Promise.race () mengembalikan hasil dari janji yang dipenuhi atau ditolak pertama yang diteruskan sebagai larik promise:

const promise1 = new Promise((resolve, reject) => setTimeout(resolve, 500, ''))

const promise2 = new Promise((resolve, reject) => setTimeout(resolve, 100, ''))

Promise.race([promise1, promise2]).then(value => console.log(value)) // ""

JSR

MDN

65. Apakah rezim ketat itu?

Untuk mengaktifkan mode ketat, gunakan pernyataan 'gunakan ketat' (atau 'gunakan ketat') di awal semua kode atau fungsi individu. Mode ketat diperkenalkan di ES5. Dalam mode ini, beberapa tindakan dilarang dan lebih banyak pengecualian dilemparkan.



JSR

MDN

66. Mengapa Anda membutuhkan rezim yang ketat?

Mode ketat memungkinkan Anda menulis kode yang lebih aman dengan mencegah banyak kesalahan terjadi. Misalnya, ia melarang pembuatan variabel global yang tidak disengaja (tanpa kata kunci, variabel = nilai), penugasan nilai ke properti hanya-baca, properti yang hanya dapat diperoleh menggunakan pengambil, properti yang tidak ada, dan variabel atau objek yang tidak ada. Dalam mode non-ketat, tidak ada pengecualian yang diterapkan dalam semua kasus ini.



JSR

MDN

67. Bagaimana saya mengaktifkan keamanan ketat?

Mode ketat diaktifkan oleh pernyataan 'gunakan ketat' (atau 'gunakan ketat') di awal kode atau fungsi. Biasanya, instruksi ini ditunjukkan di awal skrip, mis. di namespace global:

'use strict'
x = 3.14 // ReferenceError: "x" is not defined

Jika 'gunakan ketat' ditentukan dalam suatu fungsi, maka mode ketat hanya berlaku untuk fungsi itu:

x = 3.14 //   
f() // ReferenceError: "y" is not defined

function f () {
    'use strict'
    y = 3.14
}

JSR

MDN

68. Untuk apa negasi ganda digunakan?

Negasi ganda (!!) mengonversi nilai menjadi boolean. Jika nilainya salah, maka salah dikembalikan, jika tidak - benar:

const x = 1
console.log(x) // 1
console.log(!!x) // true
const y = ''
console.log(y) // ''
console.log(!!str) // false

Catatan:!!! Bukan operator terpisah, tapi dua operator! ..



MDN

JSR

69. Untuk apa operator delete digunakan?

Operator ini digunakan untuk menghapus properti objek dan nilai properti ini:

'use strict'
const user = {
    name: '',
    age: 30
}

delete user.age

console.log(user) // { name: "" }

delete user // SyntaxError: Delete of an unqualified identifier in strict mode

Perhatikan bahwa dalam mode non-ketat, upaya untuk menghapus objek akan gagal secara diam-diam.

Karena array juga merupakan objek, menerapkan delete ke elemen array akan menghapus nilainya dan menulis tidak terdefinisi padanya, mis. indeks dari elemen yang dihapus dari array akan dipertahankan dan panjang dari array tidak akan berubah.



JSR

MDN

70. Untuk apa tipe operator digunakan?

Operator ini digunakan untuk menentukan tipe variabel atau ekspresi:

typeof 1 // number
typeof [] // object
typeof '' // string
typeof (1 + 2) // number

typeof null // object
typeof NaN // number

JSR

MDN

71. Apa itu undefined?

undefined adalah nilai standar yang tidak terdefinisi (tapi tidak hilang) (nilai default) dari variabel yang belum diberi nilai, serta variabel yang tidak dideklarasikan. Ini adalah salah satu tipe data primitif:

let name
console.log(typeof name) // undefined
console.log(typeof age) // undefined

Nilai ini dapat ditetapkan ke variabel secara eksplisit:

user = undefined

JSR

MDN

72. Apa itu null?

null adalah nilai yang mewakili ketiadaan set nilai secara eksplisit. Ini adalah salah satu tipe data primitif. Menggunakan null Anda dapat menghapus nilai variabel:

const user = null
console.log(typeof user) // object

JSR

MDN

73. Apa perbedaan antara null dan undefined?

Perbedaan utamanya adalah sebagai berikut:



JSR - JSR tidak ditentukan

-

MDN nol - MDN tidak terdefinisi

- null

74. Apa itu eval?

Fungsi eval () mengevaluasi string yang diteruskan ke sana. Sebuah string bisa menjadi ekspresi, variabel, satu atau lebih operator:

console.log(eval('1 + 2')) // 3

//   
const curryCalc = x => operator => y =>
    new Promise((resolve, reject) =>
        resolve(eval(\`x${operator}y\`))
    ).then(
        result => console.log(result),
        error => console.error(' !')
    )

curryCalc(1)('+')(2) // 3
curryCalc(4)('-')(3) // 1
curryCalc(5)('x')(6) //  !

Tidak direkomendasikan untuk digunakan.



JSR

MDN

75. Bagaimana cara mengakses riwayat browser?

Informasi tentang sejarah pergerakan antar halaman di browser berisi properti sejarah dari objek jendela. Untuk pergi ke halaman sebelumnya atau berikutnya, gunakan metode back (), next () atau go ():

const goBack = () => {
    history.back()
    // 
    history.go(-1)
}

const goForward = () => history.forward()

MDN

76. Tipe data apa yang ada di JavaScript?

Ada 8 tipe utama dalam JavaScript:

• angka untuk sembarang angka: integer atau floating point, nilai integer dibatasi hingga ± 2 ⁵³
• bigint untuk bilangan bulat dengan panjang sembarang
• string untuk string. Sebuah string dapat berisi satu atau lebih karakter, tidak ada tipe karakter yang terpisah
• boolean untuk true / false
• null untuk nilai yang tidak diketahui - tipe berbeda dengan satu nilai null
• undefined for unassigned values ​​- tipe terpisah yang memiliki satu nilai tak terdefinisi
• objek untuk struktur data yang lebih kompleks
• simbol untuk pengenal unik

JSR

MDN

77. Apa yang dilakukan isNaN ()?

Fungsi isNaN () mengonversi nilai menjadi angka dan memeriksa apakah itu NaN.

isNaN('hello') // true
isNaN(100) // false

Versi yang lebih kuat dari fungsionalitas ini adalah metode Number.isNaN () yang diperkenalkan di ES6.



JSR

MDN

78. Apa perbedaan antara variabel yang tidak dideklarasikan dan tidak ditentukan?

Perbedaan utamanya adalah sebagai berikut:



JSR

MDN

79. Apakah variabel global itu?

Di browser, fungsi dan variabel global yang dideklarasikan dengan kata kunci "var", atau tanpa kata kunci (dalam mode lax), menjadi properti dari objek jendela global (tidak berfungsi di modul). Variabel semacam itu dapat diakses dari mana saja di program. Tidak disarankan untuk menggunakan variabel global. Jika Anda perlu membuat variabel global, lebih baik melakukannya secara eksplisit:

window.currentUser = {
    name: ''
}

// 
globalThis.currentUser = {
    name: ''
}

console.log(currentUser.name) // 

JSR

80. Masalah apa yang ditimbulkan oleh pembuatan variabel global?

Membuat variabel global mencemari namespace global, yang dapat menyebabkan konflik antara nama variabel. Ini juga membuat lebih sulit untuk men-debug dan menguji kode Anda.



JSR

81. Apa itu NaN?

Properti NaN global adalah nilai Not-a-Number. Lebih tepatnya, NaN menunjukkan bahwa nilainya salah, tetapi masih berupa angka. Oleh karena itu jenis nomor pengembalian NaN.

parseInt('bla') // NaN
Math.sqrt(-1) // NaN

MDN

82. Apa yang dilakukan isFinite ()?

Fungsi global isFinite () mengubah argumen menjadi angka dan mengembalikan nilai true jika itu adalah angka biasa (terbatas), mis. bukan NaN, Infinity (tak terhingga positif), -Infinity (tak terhingga negatif). Jika tidak, salah dikembalikan.

isFinite(Infinity) // false
isFinite(-Infinity) // false
isFinite(NaN) // false

isFinite(100) // true

Ada juga metode Number.isFinite (), yang tidak seperti isFinite (), tidak mengonversi argumen menjadi angka sebelum diperiksa.



MDN

JSR

83. Apakah aliran / propagasi peristiwa?

Alur peristiwa (penyebaran peristiwa) adalah urutan terjadinya peristiwa di halaman. Saat Anda mengklik elemen yang disarangkan di dalam elemen lain, sebelum peristiwa mencapai elemen target, ini akan secara berurutan melewati semua leluhurnya, mulai dari objek jendela global. Ada tiga tahap penyebaran acara:

• Atas ke bawah - tahap menangkap atau menyelam
• Tahap target
• Bottom up - tahap pendakian atau pendakian (jangan bingung dengan menaikkan variabel - mengangkat)

JSR

84. Apakah peristiwa menggelegak?

Gelembung adalah tahap penyebaran suatu peristiwa, ketika peristiwa tersebut pertama kali didaftarkan pada elemen target, dan kemudian naik rantai dari leluhur elemen ini ke elemen paling atas (luar) - objek jendela global.



JSR

85. Apakah pencelupan atau penangkapan peristiwa itu?

Immersion adalah tahapan di mana sebuah peristiwa diaktifkan, ketika pertama kali mendaftar pada elemen paling atas (luar) (objek jendela global) dan kemudian turun ke rantai leluhur ke elemen target.



JSR

86. Bagaimana cara mengirimkan formulir untuk diproses?

Ini dapat dilakukan dengan berbagai cara:

function submitForm() {
    document.forms[0].submit()
}

form.onsubmit = function(event) {
    event.preventDefault()
    // 
}

form.addEventListener('submit', event => {
    event.preventDefault()
    // 
})

Setiap tombol pada formulir dikirim secara default, mis. berfungsi untuk mengirimkan formulir.



JSR

MDN

87. Bagaimana saya bisa mendapatkan informasi tentang sistem operasi?

Informasi ini terdapat dalam objek navigator global. Beberapa dari informasi ini dapat diperoleh melalui properti platformnya:

console.log(navigator.platform)

MDN

88. Apa perbedaan antara DOMContentLoaded dan event load?

Peristiwa DOMContentLoaded dimunculkan ketika dokumen HTML asli telah sepenuhnya dimuat dan diurai tanpa menunggu stylesheet, gambar, atau bingkai dimuat sepenuhnya. Peristiwa pemuatan diaktifkan setelah halaman dimuat sepenuhnya, termasuk sumber daya tambahan apa pun.



JSR

MDN - DOMContentLoaded

MDN - memuat

89. Apa perbedaan antara native, host (dimiliki oleh runtime kode) dan objek kustom?

Objek asli adalah bagian dari bahasa dan ditentukan dalam spesifikasi ECMAScript. Objek seperti itu, misalnya, Angka, String, Fungsi, Objek, Matematika, Ekspresi Reguler, Tanggal, dll. Objek host disediakan oleh browser atau runtime lain seperti Node.js. Objek tersebut adalah, misalnya, jendela, dokumen (DOM), XMLHttpRequest, API Web (tumpukan panggilan, antrian tugas), dll. Objek pengguna adalah objek apa pun yang dibuat dalam kode, misalnya, objek. berisi informasi tentang pengguna:

const user = {
    name: '',
    age: 30
}

JSR

MDN

90. Alat apa yang digunakan untuk menunda kode?

Sarana tersebut adalah:

• Alat pengembang dalam browser seperti Chrome DevTools
• Ekspresi debugger
• Console lama yang bagus.log ()

JSR

MDN - debugger

MDN - Konsol

91. Apa keuntungan dan kerugian dari promise versus callback?

Manfaat:

• Mencegah panggilan balik
• Memungkinkan Anda menjalankan kode asinkron secara berurutan menggunakan then ()
• Izinkan kode asinkron untuk dieksekusi secara paralel menggunakan Promise.all ()
• Memecahkan banyak masalah panggilan balik (menelepon terlalu terlambat atau terlalu dini, lebih dari satu panggilan, menyembunyikan kesalahan)

kerugian

• Kode semakin sulit untuk ditulis
• Untuk memberikan dukungan untuk browser lama, diperlukan polyfill (hampir tidak ada browser seperti itu yang tersisa hari ini)

JSR - Menjanjikan

JSR - Callback MDN - MDN

Janji

- Callback

92. Apa perbedaan antara atribut dan properti elemen?

Saat browser memuat halaman, itu mengurai HTML dan menghasilkan objek DOM darinya. Untuk node elemen, sebagian besar atribut HTML standar secara otomatis menjadi properti objek DOM. Itu. atribut elemen ditentukan di markup, dan propertinya ada di DOM. Misalnya, untuk tag body dengan atribut id = "page", objek DOM akan memiliki properti body.id = "page".

<input type="text" value=" !">
//     : type  value

const input = document.querySelector('input')
//  
console.log(input.getAttribute('value'))
//  
console.log(input.value)

//   
input.setAttribute('value', ' !')
//   
input.value = ' !'

Perhatikan bahwa spesifikasi ECMAScript juga menentukan atribut untuk properti objek - [[Value]], [[Writable]], [[Enumerable]], dan [[Configurable]].



JSR

93. Apa yang dimaksud dengan kebijakan asal yang sama (SOP)?

Kebijakan asal bersama (sumber yang sama) memblokir akses ke data dari sumber lain. Sumber adalah kombinasi dari protokol, host, dan port. Secara default, berbagi sumber daya lintas sumber (CORS) dilarang, yaitu. data disediakan hanya sebagai tanggapan atas permintaan dari sumber yang sama dengan lokasinya. Perilaku ini dapat diubah menggunakan header HTTP khusus.



JSR

MDN - SOP

MDN - CORS

94. Apa yang dilakukan void 0?

Operator void mengevaluasi ekspresi yang diteruskan dan mengembalikan tidak terdefinisi. Biasanya, saat kita mengklik link, browser memuat halaman baru atau memuat ulang halaman saat ini. Anda dapat menghindari ini dengan menggunakan ekspresi "void (0)":

<a href="javascript:void(0)" onclick="alert('!')">  !
</a>

Pemuatan ulang halaman juga dapat dicegah dengan stub sederhana:

<a href="#"> </a>
//     "#"   URL   

MDN

95. Apakah JavaScript merupakan bahasa pemrograman yang dikompilasi atau ditafsirkan?

JavaScript sendiri adalah bahasa pemrograman yang ditafsirkan. Mesin mengurai kode, menafsirkan setiap baris, dan menjalankannya. Namun, browser modern menggunakan teknologi yang disebut just-in-time (JIT compilation) di mana kode dikompilasi (dioptimalkan) sebelum dieksekusi. Ini meningkatkan waktu persiapan untuk eksekusi kode, tetapi secara signifikan mempercepat eksekusi itu sendiri. Misalnya, V8, mesin yang digunakan di Chrome dan Node.js, menggunakan juru bahasa Pengapian untuk mengurai kode dan kompiler TurboFan untuk mengoptimalkan kode.



JSR

MDN

96. Apakah JavaScript case sensitive?

Ya, JavaScript peka huruf besar / kecil. Oleh karena itu, kata kunci, nama variabel, fungsi, dan objek harus identik saat menggunakannya. Misalnya, const somename dan const someName adalah variabel yang berbeda, typeof (1) adalah angka, dan typeOf 1 adalah ReferenceError: typeOf tidak ditentukan.



JSR

MDN

97. Apakah Java dan JavaScript terkait?

Tidak, mereka adalah dua bahasa pemrograman yang berbeda. Namun, keduanya termasuk dalam bahasa berorientasi objek dan, seperti banyak bahasa lainnya, menggunakan sintaks yang serupa (if, else, for, switch, break, continue, dll.). Pada dasarnya, Java to JavaScript adalah taktik pemasaran.



JSR

MDN

98. Apakah peristiwa itu?

Peristiwa adalah reaksi browser terhadap tindakan tertentu. Tindakan ini dapat berupa tindakan pengguna, misalnya, mengklik tombol atau memasukkan teks, memuat halaman, menerima tanggapan atas permintaan, dll. (Tindakan yang memicu peristiwa belum tentu khusus pengguna). Peristiwa dicatat untuk diproses lebih lanjut.

button.onclick = () => alert('!')

input.addEventListener('change', function() {
    p.textContent = this.value
})

window.onload = () => console.log('  ')

MDN

JSR

99. Siapa yang Menciptakan JavaScript?

JavaScript dibuat oleh Brendan Eich selama waktunya di Netscape Communications. Bahasa ini awalnya bernama Mocha, kemudian diubah namanya menjadi LiveScript dan dimaksudkan untuk pemrograman sisi klien dan pemrograman sisi server (yang seharusnya disebut LiveWire).



JSR

MDN