How to implement property hijacking with JavaScript defineProperty

let obj = {};
// Common operation: add/modify new attribute obj.a = 1;
// is equivalent to:
Object.defineProperty(o, "a", {
  value: 1,
  writable: true,
  configurable: true,
  enumerable: true
});

let obj = {};

let value = 1;
Object.defineProperty(obj, "b", {
  get() {
    console.log("Read b attribute", value);
    return value;
  },
  set(newValue) {
    console.log("Set b property", newValue);
    value = newValue;
  }
});
// Trigger the get function, the return value of get is the attribute value // 1
console.log(obj.b);
// Trigger the set function, the value becomes 2, note! ! ! At this time, the attribute value in the memory has not changed obj.b = 2;
// However, when you want to read the property value, the get function will inevitably be triggered, and the property value will naturally change. This idea is really good console.log(obj.b);

function observeKey(obj, key) {
  let value = obj[key];
  Object.defineProperty(obj, key, {
    get() {
      console.log("Read properties", value);
      return value;
    },
    set(newValue) {
      console.log("Set properties", newValue);
      value = newValue;
    }
  });
}
let obj = { a: 1 };
observeKey(obj, "a");
// Read a, trigger the get function console.log(obj.a);
// Set a, trigger the set function obj.a = 1;

function observeObj(obj) {
  for (let key in obj) {
    // Directly using obj.hasOwnProperty will prompt non-standard if (Object.prototype.hasOwnProperty.call(obj, key)) {
      observeKey(obj, key);
    }
  }
  return obj;
}
function observeKey(obj, key) {
  let value = obj[key];
  Object.defineProperty(obj, key, {
    get() {
      console.log("Read properties", value);
      return value;
    },
    set(newValue) {
      console.log("Set properties", newValue);
      value = newValue;
    }
  });
}

let obj = { a: 1, b: 2 };
observeObj(obj);
console.log(obj);
// Read a, trigger the get function console.log(obj.a);
// Set a, trigger the set function obj.a = 1;

function observeObj(obj) {
  // Add parameter restrictions, only objects can be hijacked, which is also the termination condition of recursion if (typeof obj !== "object" || obj == null) {
    return;
  }
  for (let key in obj) {
    // Directly using obj.hasOwnProperty will prompt non-standard if (Object.prototype.hasOwnProperty.call(obj, key)) {
      observeKey(obj, key);
      // Here, the attribute value of the attribute is hijacked. If it is not an object, it is returned directly without affecting observeObj(obj[key]);
    }
  }
  return obj;
}
function observeKey(obj, key) {
  let value = obj[key];
  Object.defineProperty(obj, key, {
    get() {
      console.log("Read properties", value);
      return value;
    },
    set(newValue) {
      console.log("Set properties", newValue);
      value = newValue;
    }
  });
}

let obj = { a: 1, b: 2, c: { name: "c" } };
observeObj(obj);
console.log(obj);
// Read a, trigger the get function console.log(obj.a);
// Set a, trigger the set function obj.a = 1;
// Trigger set function obj.c.name = "d";

let obj = { a: 1, b: [1, 2] };
observeObj(obj);
// Add new attributes obj.c = 3;
// Will not trigger the get function console.log(obj.c);
// Will not trigger the set function obj.b.push(3);

// Mount a single attribute first // options.data is equivalent to source options is equivalent to target
function proxyKey(target, source, key) {
  Object.defineProperty(target, key, {
    // Here source[key] is equivalent to the variable value, so the simplest example is the core get() {
      return source[key];
    },
    set(newValue) {
      if (newValue === source[key]) {
        return;
      }
      source[key] = newValue;
    }
  });
}
// Traverse the attributes and mount function proxyObj(target, source) {
  for (let key in source) {
    // Directly using obj.hasOwnProperty will prompt non-standard if (Object.prototype.hasOwnProperty.call(source, key)) {
      proxyKey(target, source, key);
    }
  }
}
let options = {
  data: { name: 1 }
};
proxyObj(options, options.data);
// 1
console.log(options.name);

let obj = { a: 1 };

let log = [obj.a];

let value = obj.a;
Object.defineProperty(obj, "a", {
  get() {
    return value;
  },
  set(newValue) {
    if (newValue === value) {
      return;
    }
    value = newValue;
    log.push(newValue);
  }
});

obj.a = 2;
obj.a = 3;
obj.a = 4;
// [1,2,3,4]
console.log(log);

class Archiver {
  constructor() {
    let value = null;
    this.archive = [];
    Object.defineProperty(this, "a", {
      get() {
        return value;
      },
      set(newValue) {
        if (newValue === value) {
          return;
        }
        value = newValue;
        this.archive.push(newValue);
      }
    });
  }
}
let archiver = new Archiver();
archiver.a = 1;
archiver.a = 2;
// [1,2]
console.log(archiver.archive);