Rumah >hujung hadapan web >tutorial js >Panggilan fungsi JavaScript dan parameter passing_Pengetahuan asas
Panggilan fungsi JavaScript
Terdapat 4 cara untuk memanggil fungsi JavaScript.
Cara setiap perbezaan adalah dalam permulaan ini.
kata kunci ini
Secara umumnya, dalam Javascript, ini menunjuk kepada objek semasa apabila fungsi itu dilaksanakan.
Sila ambil perhatian bahawa ini adalah kata kunci terpelihara, anda tidak boleh mengubah suai nilai ini.
Panggil fungsi JavaScript
Kod dalam fungsi dilaksanakan selepas fungsi dipanggil.
Panggil sebagai fungsi
Contoh
function myFunction(a, b) { return a * b; } myFunction(10, 2); // myFunction(10, 2) 返回 20
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 pelayar ialah tetingkap pelayar (objek tetingkap). Fungsi di atas secara automatik akan menjadi fungsi objek tetingkap.
myFunction() dan window.myFunction() adalah sama:
Contoh
function myFunction(a, b) { return a * b; } window.myFunction(10, 2); // window.myFunction(10, 2) 返回 20
Nota Ini ialah cara biasa untuk memanggil fungsi JavaScript, tetapi ia bukan amalan pengaturcaraan yang baik
Pembolehubah global, kaedah atau fungsi boleh menyebabkan pepijat konflik penamaan dengan mudah.
Objek Global
Apabila fungsi tidak dipanggil oleh objeknya sendiri, nilai ini akan menjadi objek global.
Dalam pelayar web, objek global ialah tetingkap pelayar (objek tetingkap).
Nilai ini dikembalikan oleh kejadian ini ialah objek tetingkap:
Contoh
function myFunction() { return this; } myFunction(); // 返回 window 对象
Nota: Memanggil fungsi sebagai objek global akan menjadikan nilai ini sebagai objek global.
Menggunakan objek tetingkap sebagai pembolehubah boleh menyebabkan program ranap dengan mudah.
Fungsi dipanggil sebagai kaedah
Dalam JavaScript anda boleh mentakrifkan fungsi sebagai kaedah objek.
Contoh berikut mencipta objek (myObject) dengan dua sifat (firstName dan lastName), dan satu kaedah (fullName):
Contoh
var myObject = { firstName:"John", lastName: "Doe", fullName: function () { return this.firstName + " " + this.lastName; } } myObject.fullName(); // 返回 "John Doe"
Kaedah fullName 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:
Contoh
var myObject = { firstName:"John", lastName: "Doe", fullName: function () { return this; } } myObject.fullName(); // 返回 [object Object] (所有者对象)
Nota: Apabila fungsi dipanggil sebagai kaedah objek, nilai ini menjadi objek itu sendiri.
Gunakan pembina untuk memanggil fungsi
Jika kata kunci baharu digunakan sebelum panggilan fungsi, pembina dipanggil.
Ini kelihatan seperti fungsi baharu dicipta, tetapi sebenarnya fungsi JavaScript ialah objek yang dicipta semula:
Contoh
// 构造函数: function myFunction(arg1, arg2) { this.firstName = arg1; this.lastName = arg2; } // This creates a new object var x = new myFunction("John","Doe"); x.firstName; // 返回 "John"
Panggilan kepada pembina mencipta objek baharu. Objek baru mewarisi sifat dan kaedah pembina.
Nota Kata kunci ini dalam pembina tidak mempunyai sebarang nilai.
Nilai ini dicipta apabila objek (objek baru) dijadikan instantiated apabila fungsi dipanggil.
Fungsi panggilan sebagai kaedah fungsi
Dalam JavaScript, fungsi adalah objek. Fungsi JavaScript mempunyai sifat dan kaedahnya.
call() dan apply() ialah kaedah fungsi yang telah ditetapkan. Dua kaedah boleh digunakan untuk memanggil fungsi, dan parameter pertama kedua-dua kaedah mestilah objek itu sendiri.
Contoh
function myFunction(a, b) { return a * b; } myFunction.call(myObject, 10, 2); // 返回 20
Contoh
function myFunction(a, b) { return a * b; } myArray = [10,2]; myFunction.apply(myObject, myArray); // 返回 20
Kedua-dua kaedah menggunakan objek itu sendiri sebagai parameter pertama. Perbezaan antara kedua-duanya terletak pada parameter kedua: gunakan pas dalam 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 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.
Nota Dengan kaedah call() atau apply() anda boleh menetapkan nilai ini dan memanggilnya sebagai kaedah baharu pada objek sedia ada.
Parameter fungsi JavaScript
Fungsi JavaScript tidak melakukan sebarang semakan pada nilai parameter (argumen).
Fungsi parameter eksplisit dan parameter tersembunyi (argumen)
Dalam tutorial sebelumnya, kami telah mempelajari tentang parameter eksplisit fungsi:
functionName(parameter1, parameter2, parameter3) { code to be executed }
函数显式参数在函数定义时列出。
函数隐藏参数(arguments)在函数调用时传递给函数真正的值。
参数规则
JavaScript 函数定义时参数没有指定数据类型。
JavaScript 函数对隐藏参数(arguments)没有进行检测。
JavaScript 函数对隐藏参数(arguments)的个数没有进行检测。
默认参数
如果函数在调用时缺少参数,参数会默认设置为: undefined
有时这是可以接受的,但是建议最好为参数设置一个默认值:
实例
function myFunction(x, y) { if (y === undefined) { y = 0; } }
或者,更简单的方式:
实例
function myFunction(x, y) { y = y || 0; }
Note 如果y已经定义 , y || 返回 y, 因为 y 是 true, 否则返回 0, 因为 undefined 为 false。
如果函数调用时设置了过多的参数,参数将无法被引用,因为无法找到对应的参数名。 只能使用 arguments 对象来调用。
Arguments 对象
JavaScript 函数有个内置的对象 arguments 对象.
argument 对象包含了函数调用的参数数组。
通过这种方式你可以很方便的找到最后一个参数的值:
实例
x = findMax(1, 123, 500, 115, 44, 88); function findMax() { var i, max = 0; for (i = 0; i < arguments.length; i++) { if (arguments[i] > max) { max = arguments[i]; } } return max; }
或者创建一个函数用来统计所有数值的和:
实例
x = sumAll(1, 123, 500, 115, 44, 88); function sumAll() { var i, sum = 0; for (i = 0; i < arguments.length; i++) { sum += arguments[i]; } return sum; }
通过值传递参数
在函数中调用的参数是函数的参数。
如果函数修改参数的值,将不会修改参数的初始值(在函数外定义)。
函数参数的改变不会影响函数外部的变量(局部变量)。
通过对象传递参数
在JavaScript中,可以引用对象的值。
因此我们在函数内部修改对象的属性就会修改其初始的值。
修改对象属性可作用于函数外部(全局变量)。