JavaScript 関数呼び出しの知識と応用

JavaScript 関数呼び出しは js で重要な役割を果たします。この記事では、JavaScript 関数呼び出しについて詳しく説明します。

JavaScript 関数を呼び出す方法は 4 つあります。

各メソッドの違いは、この初期化にあります。

このキーワード

一般に、JavaScript では、関数が実行されるときに、これは現在のオブジェクトを指します。

これは予約されたキーワードであり、この値は変更できないことに注意してください。

JavaScript 関数の呼び出し

前の章では、関数の作成方法を学習しました。

関数内のコードは、関数が呼び出された後に実行されます。

関数呼び出しとして

インスタンス

function myFunction(a, b) {
    return a * b;}myFunction(10, 2);           // myFunction(10, 2) 返回 20

上記の関数はどのオブジェクトにも属しません。ただし、JavaScript では、これは常にデフォルトのグローバル オブジェクトです。

HTML のデフォルトのグローバル オブジェクトは HTML ページ自体であるため、関数は HTML ページに属します。

ブラウザのページオブジェクトはブラウザウィンドウ(ウィンドウオブジェクト)です。上記の関数は自動的にウィンドウオブジェクトの関数になります。

myFunction() と window.myFunction() は同じです:

Instance

function myFunction(a, b) {
    return a * b;}window.myFunction(10, 2);    // window.myFunction(10, 2) 返回 20

これは JavaScript 関数を呼び出す一般的な方法ですが、良いプログラミング方法ではありません
グローバル変数、メソッド、または関数競合バグに名前を付けるのは簡単です。

グローバルオブジェクト

関数が自身のオブジェクトから呼び出されない場合、thisの値がグローバルオブジェクトになります。

Web ブラウザでは、グローバル オブジェクトはブラウザ ウィンドウ (ウィンドウ オブジェクト) です。

このインスタンスによって返される this の値はウィンドウ オブジェクトです:

Instance

function myFunction() {
    return this;}myFunction();                // 返回 window 对象

この関数はグローバル オブジェクトとして呼び出され、this の値がグローバル オブジェクトになります。
ウィンドウオブジェクトを変数として使用すると、プログラムがクラッシュしやすくなる可能性があります。

関数はメソッドとして呼び出されます

JavaScriptでは、関数をオブジェクトのメソッドとして定義できます。

次の例では、2 つのプロパティ (firstName と lastName) と 1 つのメソッド (fullName) を持つオブジェクト (myObject) を作成します。

Instance

var myObject = {
    firstName:"John",    lastName: "Doe",    fullName: function () {
        return this.firstName + " " + this.lastName;    }}myObject.fullName();         // 返回 "John Doe"

fullName メソッドは関数です。関数はオブジェクトに属します。 myObject は関数の所有者です。

このオブジェクトは JavaScript コードを保持します。インスタンス内の this の値は myObject オブジェクトです。

以下でテストしてください! fullName メソッドを変更して次の値を返します:

Instance

var myObject = {
    firstName:"John",    lastName: "Doe",    fullName: function () {
        return this;    }}myObject.fullName();          // 返回 [object Object] (所有者对象)

この関数はオブジェクト メソッドとして呼び出され、この値がオブジェクト自体になります。

コンストラクターを使用して関数を呼び出します

関数呼び出しの前に new キーワードが使用される場合、コンストラクターが呼び出されます。

これは新しい関数が作成されたように見えますが、実際には JavaScript 関数はオブジェクトを再作成します:

Instance

// 构造函数:function myFunction(arg1, arg2) {
    this.firstName = arg1;    this.lastName  = arg2;}
 // This    creates a new objectvar x = new myFunction("John","Doe");x.firstName;                             // 返回 "John"

コンストラクターへの呼び出しにより、新しいオブジェクトが作成されます。新しいオブジェクトはコンストラクターのプロパティとメソッドを継承します。

コンストラクター内の this キーワードには値がありません。
this の値は、オブジェクト (新しいオブジェクト) をインスタンス化するために関数が呼び出されたときに作成されます。

関数メソッドとして関数を呼び出す

JavaScript では、関数はオブジェクトです。 JavaScript 関数にはプロパティとメソッドがあります。

call() と apply() は事前定義された関数メソッドです。 関数の呼び出しには 2 つのメソッドを使用できます。両方のメソッドの最初のパラメータはオブジェクト自体である必要があります。

Instance

function myFunction(a, b) {
    return a * b;}myObject = myFunction.call(myObject, 10, 2);     // 返回 20

Instance

function myFunction(a, b) {
    return a * b;}myArray = [10, 2];myObject = myFunction.apply(myObject, myArray);  // 返回 20

どちらのメソッドも、オブジェクト自体を最初のパラメータとして使用します。 2 つの違いは 2 番目のパラメータにあります。apply はパラメータ配列で渡されます。つまり、複数のパラメータが 1 つの配列に結合されて渡されますが、call は call のパラメータとして (2 番目のパラメータから開始して) 渡されます。

JavaScript 厳密モードでは、パラメーターがオブジェクトでなくても、関数を呼び出すときに最初のパラメーターが this の値になります。

JavaScript の非厳密モードでは、最初のパラメーターの値が null または未定義の場合、代わりにグローバル オブジェクトが使用されます。

この記事では、JavaScript 関数呼び出しについて詳しく説明します。その他の学習資料については、php 中国語 Web サイトを参照してください。

関連する推奨事項:

JavaScriptタイミングイベントの知識と使用法

JavaScriptクロージャの知識と使用法

JavaScriptの日付(日付)関連の知識と使用法

以上がJavaScript 関数呼び出しの知識と応用の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。