JavaScriptを使って対象に登録モニターを修正します.

もっと読む
私たちは大きなフロントエンドプロジェクトを開発する時、ある変数にフィールドがあります.どのプログラムがこの変数のフィールドを変更したかを知りたいです.例えばグローバル変数windowで新しいフィールドをカスタマイズしました.name、どのようなプログラムがこのフィールドに値を与えているのかを知りたいです.
一行でデバッグするのは時間がかかりすぎます.windowという変数があればnameフィールドがプログラムによって価値が与えられた時、私達自身が実現したモニターを実行することができます.これは便利ではないですか?
モニターの実現は簡単です.

<script>

"use strict";

function test(){

  Object.defineProperty(window, "_name", {

  get : function(){ console.log("gett is called ") },

  set : function(newValue){

      debugger;

      console.log("_name is filled!!!!");

  },

  enumerable : true,

  configurable : true

});

for( var i = 0; i < 2; i++)

   console.log(i);

window._name = "2";

};

test();

script>

Objectオブジェクトが持つメソッドdefinePropertyを使用して、最初のパラメータは盗聴対象のwindowで、二つ目のパラメータは盗聴対象のフィールド名です.name
三つ目のパラメータは対象で、属性はsetです.つまり、私達はwindowを監督したいという意味です.nameが割り当てられたこの事件.属性セットの値はJavaScript関数です.つまり、私たち自身が定義したモニターです.このモニターはwindowになります.nameは他のJavaScript関数によって修正されたらトリガされます.
 
テストしてください.ブラウザで上記のコードを実行して、ブレークポイントが私達の期待によって触発されました.
 
コールスタックからも確かにwindow.uであることが分かります.name="2"行のコードがトリガするブレークポイントは、私たち自身が登録した属性修正モニターが作動しました.
 
もっとJerryのオリジナル技術記事を取得するには、公衆番号の「汪子煕」または次の二次元コードをスキャンしてください.