Panggilan fungsi JavaScript



Terdapat 4 cara untuk memanggil fungsi JavaScript.

Cara masing-masing berbeza adalah dalam permulaan ini.


ini Kata kunci

Secara umumnya, dalam Javascript, ini menunjuk ke objek semasa apabila fungsi itu dilaksanakan.

NotePerhatikan bahawa
Note注意 this 是保留关键字,你不能修改 this 的值。
ini
ialah kata kunci terpelihara, anda tidak boleh mengubah suai nilai

ini

.

Memanggil fungsi JavaScript

Dalam bab sebelumnya, kita telah mempelajari cara mencipta fungsi.

Kod dalam fungsi dilaksanakan selepas fungsi dipanggil. Butang " Jalankan contoh" untuk melihat contoh dalam talian

Fungsi di atas bukan milik mana-mana objek. Tetapi dalam JavaScript ia sentiasa menjadi objek global lalai.

Objek global lalai dalam HTML ialah halaman HTML itu sendiri, jadi fungsi itu tergolong dalam halaman HTML.

Objek halaman dalam penyemak imbas ialah tetingkap penyemak imbas (objek tetingkap). Fungsi di atas secara automatik akan menjadi fungsi objek tetingkap. myFunction() dan window.myFunction() adalah sama:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>
全局函数 (myFunction) 返回参数参数相乘的结果:
</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
	return a * b;
}
document.getElementById("demo").innerHTML = myFunction(10, 2); 
</script>

</body>
</html>

Running instance»

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

NoteIni ialah kaedah biasa untuk memanggil fungsi JavaScript. Tetapi ia bukan amalan pengaturcaraan yang baik

Pembolehubah, kaedah atau fungsi global boleh menyebabkan pepijat konflik dengan mudah.

Objek global

Apabila fungsi tidak dipanggil oleh objeknya sendiri, nilai ini akan menjadi objek global.

Dalam pelayar web, objek global ialah tetingkap penyemak imbas (objek tetingkap).
Note这是调用 JavaScript 函数常用的方法, 但不是良好的编程习惯
全局变量,方法或函数容易造成命名冲突的bug。
Nilai yang dikembalikan oleh tika ini
ini

ialah objek tetingkap:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>全局函数 myFunction() 会自动成为 window 对象的方法。</p>
<p>myFunction() 类似于 window.myFunction()。</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
	return a * b;
}
document.getElementById("demo").innerHTML = window.myFunction(10, 2); 
</script>

</body>
</html>

Running instance »Klik butang "Run Instance" untuk melihat contoh dalam talian

NoteThe fungsi dipanggil sebagai objek global, Akan menjadikan nilai

ini

sebagai objek global.
Menggunakan objek tetingkap sebagai pembolehubah boleh menyebabkan program ranap dengan mudah.

Fungsi sebagai kaedah

Dalam JavaScript anda boleh mentakrifkan fungsi sebagai kaedah objek.

Contoh berikut mencipta objek (myObject), yang mempunyai dua sifat (firstName dan lastName), dan satu kaedah (Nama penuh):

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>在 HTML 中 <b>this</b> 的值, 在全局函数是一个 window 对象。</p>
<p id="demo"></p>
<script>
function myFunction() {
	return this;
}
document.getElementById("demo").innerHTML = myFunction(); 
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk lihat Contoh dalam talian

fullName kaedah ialah fungsi. Fungsi kepunyaan objek. myObject ialah pemilik fungsi tersebut.

objek ini, memegang kod JavaScript. Nilai ini dalam contoh ialah objek myObject.

Uji di bawah! Ubah suai kaedah Nama Penuh dan kembalikan nilai ini:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>myObject.fullName() 返回 John Doe:</p>
<p id="demo"></p>
<script>
var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function() {
		return this.firstName + " " + this.lastName;
    }
}
document.getElementById("demo").innerHTML = myObject.fullName(); 
</script>

</body>
</html>

Jalankan Instance »

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

< img src="https://img.php.cn/upload/course/000/000/009/580430d9613d6751.jpg" alt="Note"/>Fungsinya ialah dipanggil sebagai kaedah objek, yang akan menyebabkan Nilai
Note函数作为对象方法调用,会使得 this 的值成为对象本身。
ini
menjadi objek itu sendiri.

Gunakan pembina untuk memanggil fungsi

Jika kata kunci baharu

digunakan sebelum fungsi panggil, maka Pembina dipanggil.

Ini kelihatan seperti fungsi baharu dicipta, tetapi sebenarnya fungsi JavaScript ialah objek yang dicipta semula:

Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>在一个对象方法中 ,<b>this</b> 的值是对象本身。</p>
<p id="demo"></p>
<script>
var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function() {
		return this;
    }
}
document.getElementById("demo").innerHTML = myObject.fullName();
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Panggilan kepada pembina akan mencipta objek baharu. Objek baru mewarisi sifat dan kaedah pembina.
Note构造函数中 this 关键字没有任何的值。
this 的值在函数调用时实例化对象(new object)时创建。
NoteKata kunci <🎜>ini<🎜> dalam pembina tidak mempunyai nilai. Nilai <🎜> <🎜>ini<🎜> dicipta apabila objek (objek baharu) dibuat seketika apabila fungsi dipanggil.

Memanggil fungsi sebagai kaedah fungsi

Dalam JavaScript, fungsi ialah objek. Fungsi JavaScript mempunyai sifat dan kaedahnya.

call() dan apply() ialah kaedah fungsi yang dipratentukan. Dua kaedah boleh digunakan untuk memanggil fungsi, dan parameter pertama kedua-dua kaedah mestilah objek itu sendiri.

Instance

fungsi myFunction(a, b) {
kembalikan * b;
}
myFunction.call(myObject, 10, 2); // Kembalikan 20

contoh

fungsi myFunction(a , b) {
kembalikan * b;
}
myArray = [10,2];
myFunction.apply(myObject, myArray); // Kembalikan 20

Gunakan kedua-dua kaedah Objek itu sendiri diluluskan sebagai parameter pertama. Perbezaan antara keduanya ialah parameter kedua: Apa yang digunakan pas masuk ialah tatasusunan parameter, iaitu, berbilang parameter digabungkan menjadi tatasusunan dan dihantar masuk, manakala panggilan dihantar sebagai parameter panggilan (bermula dari parameter kedua).

Dalam mod ketat JavaScript, parameter pertama akan menjadi nilai ini apabila memanggil fungsi, walaupun parameter itu bukan objek.

Dalam mod tidak ketat JavaScript, jika nilai parameter pertama adalah batal atau tidak ditentukan, ia akan menggunakan objek global sebaliknya.

NoteAnda boleh menetapkan nilai
Note通过 call() 或 apply() 方法你可以设置 this 的值, 且作为已存在对象的新方法调用。
ini

melalui kaedah panggilan() atau apply() dan kerana sudah ada Panggilan kaedah baharu untuk objek.


<🎜>