序文JavaScript を学習した人なら誰でも、さまざまな環境で this がどこを指すかという問題を認識しているはずです。次のコードを見てください varタイプ = 1 関数toWhere(){ タイプ = 2; } どこにあるのか(); console.log(タイプ) あなたはきっとこう思うでしょう: ここでグローバル変数の型が宣言されます。type=1 が実行されると、値に 1 が割り当てられます。その後、toWhere 関数が呼び出されます。関数内で this を見ると、this がどこを指しているかがわかります。ここでは、this が window を指していることは明らかです。this.type=2 が実行されると、グローバル変数 type に値 2 が割り当てられます。 最後に、グローバル変数の型が出力され、結果は明らかに 2 になります。 ブラウザを開いて確認すると、そこには明らかに 2 が表示されます。 これで終わりですか? Node を学習し、上記のコードを nodejs で再実行すると、違いがわかります。 1 が間違っていることに気が付きました。2 と同じではないでしょうか? 関連するデバッグ上記の例から、同じ js コードをブラウザと nodejs で実行すると結果が異なることがわかります。 これは実はこの指摘の問題によるものですが、この指摘は私たちが通常知っているものとは異なります。このポインティング問題はノードの動作原理によって引き起こされます varタイプ = 1 関数toWhere() { このタイプ = 2 console.log("関数内の this が指している", this) } どこへ() console.log(タイプ) console.log("グローバルにこれ", this) 1.ブラウザでこれを印刷する 関数内のthisはwindowを指し、グローバルなthisもwindowを指しています。 2. これをNode.jsで印刷する 見つかりました。関数内のこれは、Object [global] を指します。 関数の this に値を割り当てると、その値は実際にはグローバル オブジェクトにアタッチされます。だから、世界的にこの価値は変わらないだろう ノード原理分析では、なぜこのようなことが起こるのか見てみましょう。 まず、Node.jsがどのように動作するかを理解する必要があります
前回の説明で、外部に出力された this は空のオブジェクト {} を指していることがわかりました。実際、ノードで実行されるファイルは {} でラップされているため、スクリプトファイルは次のように独自のクロージャで実行されます。 { (関数(){ //スクリプトファイル })() } 前の例では、関数の外側では this は空のオブジェクト {} を参照し、関数の内側では this には指定された実行コンテキストがないため、グローバル オブジェクト - (匿名関数の実行コンテキストのグローバル スコープにアクセスできる) を参照します。 要約するNodeJS とブラウザの this キーワードの違いについての記事はこれで終わりです。NodeJS とブラウザの this キーワードについての詳細は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続きご覧ください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
<<: MySQL データベースは SQL ステートメントを知っている必要があります (拡張バージョン)
>>: Tencent Cloud で HTTPS を無料で導入する方法
目次序文関数のオーバーロードマッピングタイプ部分的、読み取り専用、Null 可能、必須選択、記録除外...
1. 背景1. vSphere の共有ストレージの背景を簡単に紹介するvSphere の重要な機能は...
実際、XHTML 1.0 は、Transitional DOCTYPE と Strict DOCTY...
目次1. 問題の発見2. プロセスの詳細情報を表示する3. 解決策4. 大法を再開する1. 問題の発...
1. 前提条件JDKがインストールされましたecho $PATHソフトリンクを作成し、JDKのインス...
MJML は、開発者が美しく、応答性に優れ、あらゆるデバイスやメール クライアントで動作する魅力的な...
目次1. プロトタイプとは何ですか? 1.1 関数プロトタイプオブジェクト1.2 コンストラクタを使...
目次1. 4つのコンセプト1. JavaScriptはシングルスレッドです2. タスクキュー3. 同...
TS で時間を過ごした場所をいくつか記録します。 (まず、文句を言わせてください。stackover...
display: flex レイアウトに関しては、深く理解している人もいますし、私も他の人の作業か...
背景最近、面接でデータベース トランザクションについてよく質問されます。通常は、@Transacti...
目次新しい HTML ファイルを作成します。初期テンプレートを作成するHTML の追加CSS パディ...
参考までに、シンプルなナンバープレート入力コンポーネント(vue)です。具体的な内容は次のとおりです...
<TR> タグの属性は、次の表に示すように、テーブル内の各行のプロパティを設定するために...
現在、Docker には中国向けの公式ミラーがあります。詳細については、https://www.do...