The preventExtensions of the catcher

The catcher’s preventExtensions() can detect freeze, seal, and preventExtensions as they all make the object no longer extensible (add new properties) :

const a = {
    name: 'xiaoming'.age: 21};const pro = new Proxy(a, {
    preventExtensions(target) {
        console.log('preventExtensions()');
        return Reflect.preventExtensions(... arguments) } });Object.freeze(pro)//preventExtensions()
Object.seal(pro)//preventExtensions()
Object.preventExtensions()//preventExtensions()
Copy the code

Get of the catcher

The catcher GET has three parameters (target, property, receiver) and the catcher set has four parameters (target, Property, value, receiver).

• Target — is the target object that is passed to the new Proxy as the first argument,
• Property — The name of the target property,
• Property — The value of the target property,
• Receiver — If the target property is a getter accessor property, receiver is the this object from which the property is read. Typically, this is the proxy object itself (or, if we inherit from a proxy, from that proxy). Print receiver or console.log(arguments) in the catcher’s get and set functions; It gets stuck in a loop

Reflect something to watch out for

const target = {
    _name: 'xiaoming'.get name() {
            return this._name; }};const handler = {
    _name: 'xiaohong',
    get (target, property, receiver) {
        //console.log(arguments);
        // If you do this, you will be stuck in an infinite loop because the receiver will be printed
        // Since console.log(arguments) has a reference to receiver, this operation triggers get, in an infinite loop, a memory leak situation
        return target[property];/ / * *
        // return Reflect.get(target, property, receiver);}};const proxy = new Proxy(target, handler);
const admin = {
    __proto__: proxy,
    _name: 'xiaohuang',}console.log(admin.name);//xiaoming
console.log(proxy.name);//xiaoming
Copy the code

Return reflect.get (admin.name) return reflect.get (… arguments); The expected value admin.name is printed. / / xiaohuang. Because reflect.get uses a third argument to specify the point to this that you want to access.

Such as:

console.log(Reflect.get(
    {
        _age: 1.get age() {
            return this._age; }},'age',
    {
        _age: 2}));/ / 2
Copy the code

This example will print out 2.

So in the previous example, if I write theta

const admin = {
    __proto__: proxy,
    _name: 'xiaohuang'.name: 'Admin',}Copy the code

The name attribute of admin will be overwritten with ‘admin ‘; But there are problems if you write it like this:

const admin = {
    __proto__: proxy,
    _name: 'xiaohuang',
}
admin.name = 'Admin';
Copy the code

or

const admin = Object.create(proxy);
admin.name = 'Admin';
Copy the code

If the value of admin.name is printed, the value of admin._name is still displayed. The reason for this is that target only defines the fetch set for name, but does not define the corresponding set, which is considered unmodifiable. Admin.name = ‘admin’ performs the set operation. If the target is set to a corresponding set name, the result is expected.

Internal slots for built-in objects

Proxies encounter some problems when handling Map, Set, Date, Promise and other object methods. These operations cannot be intercepted because they use “internal slots” such as Map Set or Date getTime. It has to do with the direction of this.

The idea is to call this method from the target source inside the catcher. Because every time a method is called, get intercepts are entered first.

get(target, prop, receiver) {
    let value = Reflect.get(... arguments);return typeof value == 'function' ? value.bind(target) : value;
}
Copy the code

Something to watch out for

Prototype === undefined; A function that is also a constructor but does not have a. Prototype property, such as the function returned by bind. Functions such as the arrow function, Symbol and console.log are also missing. Prototype, they cannot be used as constructors.

Object equality tests === cannot be intercepted by the agent