ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript ですぐに呼び出される関数式を使用して上書きを防ぐにはどうすればよいですか?

JavaScript ですぐに呼び出される関数式を使用して上書きを防ぐにはどうすればよいですか?

PHPz
PHPz転載
2023-09-03 19:13:02788ブラウズ

如何在 JavaScript 中使用立即调用函数表达式来防止覆盖?

JavaScript を使用すると、開発者は Web ページに機能と動作を追加できます。開発者は、Web ページのさまざまな部分に機能を追加するには、複数の関数と変数を作成する必要があります。

リアルタイム アプリケーションを開発する場合、複数の開発者が同じプロジェクトに取り組みます。したがって、複数の開発者が作業する場合は、関数や変数を誤って上書きしないようにする必要があります。このチュートリアルでは、すぐに呼び出される関数式を使用して上書きを防ぐ方法を学びます。

質問を書き直す

たとえば、2 人の同僚が同じプロジェクトに取り組んでおり、2 人ともコード内で printAge() 関数を定義し、コードをマージします。これで、同じ名前の他のすべての関数定義が上書きされるため、ブラウザーは最後に定義された関数のみを実行します。その結果、ユーザーは Web ページの予期しない動作を目にすることがあります。さらに、これは変数名でも発生する可能性があります。

例 (カバレッジの問題)

次の例では、同じ名前の 2 つの変数を定義します。ウェブページ上に変数値を表示します。出力では、2 番目の「a」変数が最初の「a」変数の値を上書きしていることがわかります。

リーリー

上書きを防ぐために関数をすぐに呼び出す解決策

JavaScript 関数には、関数内で定義された変数の関数スコープがあります。したがって、関数内で定義した変数が何であれ、関数の外では変数にアクセスできません。したがって、スコープが関数に限定された変数を定義できます。

即時関数呼び出しを使用して関数の書き換えを解決できます。つまり、関数を定義した直後に関数を実行します。したがって、関数名を定義する必要はなく、オーバーライドは防止されます。

###文法###

ユーザーは次の構文を使用して関数をすぐに呼び出し、JavaScript でのオーバーライドを防ぐことができます。

リーリー

上記の構文では、括弧内に関数式を追加しました。さらに、関数をすぐに呼び出すために、関数定義の後に括弧を追加しました。

例 (即時呼び出し関数のオーバーライドの防止)

以下の例では、すぐに呼び出される 2 つの関数を定義します。各関数では、「obj」オブジェクト変数を作成し、id、user、age プロパティを保存します。さらに、printAge() 関数をオブジェクトに保存します。

2 つのオブジェクトの printAge() 関数は、異なるメッセージを出力します。その後、これら 2 つのオブジェクトを window オブジェクトに保存して、グローバルにアクセスできるようにします。最後に、両方のオブジェクトの printAge() メソッドを実行しました。ユーザーは、相互に上書きせずに元のメッセージを出力したことがわかります。

リーリー ###例###

この例では、すぐに呼び出される 2 つの関数式も定義します。最初の式では、食品オブジェクトを定義します。さらに、食品オブジェクトの setId() メソッドと setName() メソッドを定義し、それらを window オブジェクトに保存しました。

2 番目の関数式では、setId() メソッドと setName() メソッドを再度定義し、それらを watch() オブジェクトに格納します。その後、時計と食べ物のオブジェクトを参照として使用して、さまざまなメソッドにアクセスします。出力では、元のメッセージが上書きされずに出力されていることがわかります。

リーリー

JavaScript コードを操作するときに、即時関数式を使用してオーバーライドを防ぐ方法を学びました。このアイデアは、関数スコープで変数を定義し、オーバーライドする名前を持たない特定のグローバル オブジェクトを通じて変数にグローバルにアクセスすることです。

即時に呼び出される関数式を使用して上書きを防止する主な利点は、変数名のグローバルな汚染を回避できることです。さらに、コードを保守しやすくし、コードの再利用性を向上させることができます。

以上がJavaScript ですぐに呼び出される関数式を使用して上書きを防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はtutorialspoint.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。