Bagaimanakah Saya Boleh Mengesan Perubahan Pembolehubah dalam JavaScript?

Mendengar Perubahan Pembolehubah dalam JavaScript

Dalam JavaScript, selalunya wajar untuk dimaklumkan apabila nilai pembolehubah berubah. Ini boleh dicapai menggunakan objek Proksi, yang diperkenalkan pada 2018. Objek Proksi membenarkan penciptaan proksi yang memintas perubahan sifat dan bertindak balas sewajarnya.

Untuk menggunakan objek Proksi, mula-mula buat objek sasaran untuk menjadi diperhatikan:

var targetObj = {};

Seterusnya, cipta proksi menggunakan objek Proksi, menyatakan panggilan balik untuk dilaksanakan apabila harta set:

var targetProxy = new Proxy(targetObj, {
  set: function (target, key, value) {
      console.log(`${key} set to ${value}`);
      target[key] = value;
      return true;
  }
});

Apabila sifat objek sasaran ditetapkan melalui proksi, fungsi panggil balik dilaksanakan. Contohnya:

targetProxy.hello_world = "test"; // console: 'hello_world set to test'

Objek Proksi mempunyai kelemahan kerana ia tidak tersedia dalam penyemak imbas lama dan mungkin tidak berkelakuan seperti yang diharapkan dengan objek tertentu. Untuk memerhatikan perubahan dalam objek bersarang, perpustakaan khusus seperti Observable Slim boleh digunakan.

Observable Slim

Observable Slim ialah perpustakaan yang direka untuk memerhati perubahan dalam objek bersarang. Untuk menggunakannya, mula-mula buat objek untuk diperhatikan:

var test = {testing:{}};

Kemudian, gunakan Observable Slim untuk mencipta proksi dengan fungsi cipta, menyatakan panggilan balik untuk dilaksanakan apabila perubahan berlaku:

var p = ObservableSlim.create(test, true, function(changes) {
    console.log(JSON.stringify(changes));
});

Apabila sifat objek yang diperhatikan berubah, fungsi panggil balik dilaksanakan. Contohnya:

p.testing.blah = 42; // console:  [{"type":"add","target":{"blah":42},"property":"blah","newValue":42,"currentPath":"testing.blah",jsonPointer:"/testing/blah","proxy":{"blah":42}}]

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengesan Perubahan Pembolehubah dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!