ini dalam JavaScript
Meningkatkan Artikel
Simpan Artikel
Seperti Artikel
- Tingkat Kesulitan. Sedang
- Terakhir Diperbarui. 29 Sep, 2022
Meningkatkan Artikel
Simpan Artikel
kata kunci ini dalam javascript selalu menyimpan referensi ke satu objek, yang menentukan baris konteks eksekusi kode saat ini. Fungsi, dalam JavaScript, pada dasarnya adalah objek. Seperti objek, mereka dapat ditugaskan ke variabel, diteruskan ke fungsi lain, dan dikembalikan dari fungsi. Dan seperti halnya objek, mereka memiliki propertinya sendiri. Salah satu properti ini adalah ini
Nilai yang disimpan ini adalah konteks eksekusi saat ini dari program JavaScript. Jadi, ketika digunakan di dalam suatu fungsi, nilai ini akan berubah tergantung pada bagaimana fungsi itu didefinisikan, bagaimana itu dipanggil dan konteks eksekusi default. kata kunci ini akan merujuk ke objek yang berbeda tergantung bagaimana kata kunci itu digunakan.
Fungsi, dalam JavaScript, dapat dipanggil dengan berbagai cara
ini dengan pemanggilan fungsi
Pemanggilan fungsi mengacu pada proses memanggil fungsi menggunakan namanya atau ekspresi yang mengevaluasi objek fungsi diikuti dengan serangkaian tanda kurung buka dan tutup pertama (dimasukkannya tanda kurung menunjukkan bahwa kami meminta mesin JavaScript untuk segera menjalankan fungsi
Contohnya.
JavaScript
<!DOCTYPE html>
<html>
<body>
undefined undefined 0
undefined undefined 1undefined undefined 2 undefined undefined 3
undefined undefined 4undefined undefined 5
undefined undefined 1undefined undefined 7
undefined undefined _8
undefined undefined _9
John is 31 years old _0
John is 31 years old _1
John is 31 years old _2
ini di dalam fungsi doSomething, jika dipanggil melalui pemanggilan fungsi seperti di atas, memiliki nilai objek global, yang merupakan objek jendela di lingkungan browser
JavaScript
<!DOCTYPE html>
<html>
<body>
undefined undefined 0
undefined undefined 1undefined undefined 2 John is 31 years old 9
[object Object] 1 [object Object] 2 0[object Object] 1 [object Object] 2 1
undefined undefined 4[object Object] 1 [object Object] 2 3[object Object] 1 [object Object] 2 4[object Object] 1 [object Object] 2 5[object Object] 1 [object Object] 2 6
undefined undefined 1undefined undefined 7
undefined undefined _8
undefined undefined _9
[object Object] [object Window] NaN [object Object] [object Window] NaN 1
John is 31 years old _0
John is 31 years old _1
[object Object] [object Window] NaN [object Object] [object Window] NaN 4
Keluaran.
test valueNamun, ini tidak selalu terjadi. Jika fungsi doSomething() berjalan dalam mode ketat, itu akan mencatat tidak terdefinisi alih-alih objek jendela global. Ini karena, dalam mode ketat (ditunjukkan oleh garis. 'gunakan ketat';), nilai default ini, untuk objek fungsi apa pun, disetel ke tidak ditentukan alih-alih objek global.
Sebagai contoh.
JavaScript
<!DOCTYPE html>
<html>
<body>
undefined undefined 0
undefined undefined 1undefined undefined 2 undefined undefined 3
undefined undefined 4[object Object] [object Object] 1 [object Object] [object Object] 2 3
undefined undefined 4[object Object] [object Object] 1 [object Object] [object Object] 2 5[object Object] 1 [object Object] 2 6
[object Object] 1 [object Object] 2 0[object Object] [object Object] 1 [object Object] [object Object] 2 8
undefined undefined 4John is 21 years old 0[object Object] 1 [object Object] 2 3 John is 21 years old 2John is 21 years old 3John is 21 years old 4
John is 21 years old 5undefined undefined 2 John is 21 years old 7
John is 21 years old 8John is 21 years old 9
John is 21 years old 8<!DOCTYPE html>1
<!DOCTYPE html>2John is 21 years old 0[object Object] 1 [object Object] 2 3John is 21 years old 4
John is 21 years old 5undefined undefined 7
undefined undefined 4<!DOCTYPE html>9
undefined undefined 1undefined undefined 7
undefined undefined _8
undefined undefined _9
John is 31 years old _0
John is 31 years old _1
<html>_6
Keluaran.
undefined undefinedini dengan pemanggilan metode
Fungsi, ketika didefinisikan sebagai bidang atau properti objek, disebut sebagai metode.
JavaScript
<!DOCTYPE html>
<html>
<body>
undefined undefined 0
undefined undefined 1<body>2
undefined undefined 4<body>4<body>5<body>6
undefined undefined 4<body>8
undefined undefined 4undefined undefined 00undefined undefined 2undefined undefined 02
John is 21 years old 5John is 21 years old 0[object Object] 1 [object Object] 2 3undefined undefined 06undefined undefined 07 John is 21 years old 2[object Object] 1 [object Object] 2 3undefined undefined 10undefined undefined 11________0______12
undefined undefined 4undefined undefined 7
undefined undefined 1undefined undefined 7
[object Object] 1 [object Object] 2 0undefined undefined 18
[object Object] 1 [object Object] 2 0undefined undefined 20
undefined undefined 21John is 31 years old 0
John is 31 years old _1
undefined undefined _24
Keluaran.
John is 31 years oldDalam contoh kode di atas, logInfo() adalah metode dari objek person dan kita memanggilnya menggunakan pola pemanggilan objek. Yaitu, kami menggunakan pengakses properti untuk mengakses metode yang merupakan bagian dari objek
Doa semacam itu membutuhkan penggunaan ekspresi yang mengevaluasi objek yang merupakan bagian dari metode kami, dan pengakses properti (Misalnya. orang. logInfo()) diikuti dengan satu set tanda kurung buka dan tutup. Penting untuk memahami perbedaan fungsi pemanggilan dan pemanggilan metode.
Ini pada gilirannya akan membantu kita memahami apa konteks ini dalam fungsi tertentu karena, dalam setiap pemanggilan ini, nilai this berbeda
Di dalam metode seperti itu, yang telah dipanggil menggunakan pengakses properti, ini akan memiliki nilai dari objek pemanggilan, yaitu ini akan menunjuk ke objek yang digunakan bersama dengan pengakses properti untuk melakukan panggilan
Sebagai contoh.
JavaScript
undefined undefined 0
undefined undefined 1undefined undefined 27
undefined undefined 4________0______29
undefined undefined 4undefined undefined 31undefined undefined 2undefined undefined 02
undefined undefined _1
John is 21 years old 5undefined undefined 36
John is 21 years old 5John is 21 years old 0[object Object] 1 [object Object] 2 3 John is 21 years old 2undefined undefined 41John is 21 years old 4
________294undefined undefined _17_______3undefined undefined 45
<!DOCTYPE html>_2undefined undefined 47
John is 21 years old 5undefined undefined 49 [object Object] 1 [object Object] 2 3undefined undefined 51
undefined undefined 4undefined undefined 7
undefined undefined 1undefined undefined 55
undefined undefined _1
undefined undefined 1undefined undefined 58
undefined undefined 1undefined undefined 60John is 21 years old 3undefined undefined 12
undefined undefined 1undefined undefined 64
undefined undefined 1undefined undefined 66
undefined undefined _67
Keluaran.
[object Object] 1 [object Object] 2Dalam contoh di atas, calc() adalah metode objek tambahan dan karena itu dipanggil menggunakan aturan pemanggilan metode pada baris 9 dan 10.
Dan kita tahu, ketika pola pemanggilan metode digunakan, nilai this disetel ke objek pemanggil. Di dalam metode calc() ini, nilai this disetel ke objek pemanggil, yang dalam kasus kita ditambahkan. dan dengan demikian kita dapat berhasil mengakses properti num add.
Namun, mari kita lihat satu titik kebingungan utama. Apa yang terjadi pada fungsi yang bersarang di dalam metode objek?
JavaScript
undefined undefined 0
undefined undefined 1undefined undefined 27
undefined undefined 4________0______29
undefined undefined 4undefined undefined 31undefined undefined 2undefined undefined 02
undefined undefined _1
undefined undefined 4undefined undefined 36
undefined undefined 4John is 21 years old 0[object Object] 1 [object Object] 2 3 John is 21 years old 2undefined undefined 41John is 21 years old 4
undefined undefined _1
undefined undefined 4undefined undefined 2 undefined undefined 89
John is 21 years old 5[object Object] 1 [object Object] 2 3undefined undefined 92
undefined undefined _1
undefined undefined 4undefined undefined 95
undefined undefined 4John is 21 years old 0[object Object] 1 [object Object] 2 3 John is 21 years old 2undefined undefined 41undefined undefined 12
undefined undefined _1
undefined undefined 4undefined undefined 49 [object Object] 1 [object Object] 2 3undefined undefined 45
undefined undefined _1
undefined undefined 1undefined undefined 7undefined undefined 49 John is 31 years old 11
John is 31 years old 12undefined undefined 7
undefined undefined 1undefined undefined 55
undefined undefined _1
undefined undefined 1John is 31 years old 18
undefined undefined 1undefined undefined 60John is 21 years old 3undefined undefined 12
undefined undefined _1
undefined undefined 1John is 31 years old 18
undefined undefined 1undefined undefined 66
undefined undefined _67
Keluaran.
Mari kita coba memahami apa yang baru saja terjadi. Saat kita memanggil calc() di baris 14 dan 15 kita menggunakan pemanggilan metode yang menyetel ini untuk ditambahkan di calc(). Ini dapat diverifikasi menggunakan pernyataan log pada baris 4
Namun, innerfunc() dipanggil dari dalam metode calc() menggunakan pemanggilan fungsi sederhana(baris 11 ). Ini berarti, di dalam innerfunc() ini diatur ke objek global, yang tidak memiliki properti num, dan karenanya output NaN diperoleh
Bagaimana kita memecahkan masalah ini?
Salah satu solusinya adalah dengan menetapkan nilai ini dari fungsi luar ke variabel yang akan digunakan dalam fungsi bersarang seperti itu.
JavaScript
undefined undefined 0
undefined undefined 1undefined undefined 27
undefined undefined 4________0______29
undefined undefined 4undefined undefined 31undefined undefined 2undefined undefined 02
John is 21 years old 5undefined undefined 36
John is 21 years old 5John is 21 years old 0[object Object] 1 [object Object] 2 3 John is 21 years old 2undefined undefined 41John is 21 years old 4
John is 31 years old _46John is 31 years old 47
John is 31 years old _46John is 31 years old 49
John is 31 years old _46John is 31 years old 51[object Object] 1 [object Object] 2 3[object Object] 1 [object Object] 2 6
John is 21 years old 5undefined undefined 2 John is 31 years old 56
John is 21 years old 5John is 31 years old 58
John is 31 years old _59John is 31 years old 60
John is 31 years old _59John is 31 years old 62
________294undefined undefined _10_______64
John is 31 years old _65undefined undefined 36
<!DOCTYPE html>2John is 31 years old 68undefined undefined 41undefined undefined 12
<!DOCTYPE html>2undefined undefined 49 John is 31 years old 73
John is 21 years old 5undefined undefined 7
John is 21 years old 5undefined undefined 49 John is 31 years old 11
undefined undefined 4undefined undefined 7
undefined undefined 1undefined undefined 55
undefined undefined 1undefined undefined 58
undefined undefined 1undefined undefined 60John is 21 years old 3undefined undefined 12
undefined undefined 1undefined undefined 64
undefined undefined 1undefined undefined 66
John is 31 years old _93
Keluaran.
[object Object] [object Object] 1 [object Object] [object Object] 2Solusi lain untuk masalah ini melibatkan penggunaan bind(), call(), atau apply(), yang akan segera kita bahas
ini dengan doa konstruktor
Doa konstruktor dilakukan ketika kata kunci baru diikuti oleh nama fungsi, dan satu set tanda kurung buka dan tutup (dengan atau tanpa argumen)
Sebagai contoh. biarkan person1= Orang baru('John', 21);
Di sini, person1 adalah objek yang baru dibuat dan People adalah fungsi konstruktor yang digunakan untuk membuat objek ini. Pemanggilan konstruktor adalah salah satu dari beberapa cara untuk membuat objek dalam JavaScript. Apa yang sebenarnya terjadi saat kita menggunakan kata kunci baru bersamaan dengan nama fungsi? .
Mari kita mempelajarinya dengan contoh berikut.
JavaScript
undefined undefined 0
undefined undefined 1John is 31 years old 96undefined undefined 2John is 31 years old 98
John is 31 years old _59[object Object] 1 [object Object] 2 3[object Object] 1 [object Object] 2 01
John is 31 years old _59[object Object] 1 [object Object] 2 3[object Object] 1 [object Object] 2 04
undefined undefined _1
undefined undefined 4[object Object] 1 [object Object] 2 3[object Object] 1 [object Object] 2 08undefined undefined 2undefined undefined 02
John is 31 years old 46John is 21 years old 0[object Object] 1 [object Object] 2 3undefined undefined 06undefined undefined 07 John is 21 years old 2[object Object] 1 [object Object] 2 3undefined undefined 10[object Object] 1 [object Object] 2 19________0______12