使用 JavaScript Proxy 对象进行高级数据操作

            const target = {
  name: 'John Doe',
  age: 30
};

const handler = {
  get: function(target, property, receiver) {
    console.log(`Getting property: ${property}`);
    return Reflect.get(target, property, receiver);
  }
};

const proxy = new Proxy(target, handler);

console.log(proxy.name); // Output: Getting property: name
                         //         John Doe

            

              
                Copy
              
            
          

            const validator = {
  set: function(target, property, value) {
    if (property === 'age') {
      if (!Number.isInteger(value)) {
        throw new TypeError('Age must be an integer');
      }
      if (value < 0) {
        throw new RangeError('Age must be a non-negative number');
      }
    }

    // Continue setting the property
    target[property] = value;
    return true; // Indicate success
  }
};

const person = new Proxy({}, validator);

try {
  person.age = 25.5; // Throws TypeError
} catch (e) {
  console.error(e);
}

try {
  person.age = -5;   // Throws RangeError
} catch (e) {
  console.error(e);
}

person.age = 30;   // Works fine
console.log(person.age); // Output: 30

            

              
                Copy
              
            
          

            const userDatabase = {
  getUserData: function(userId) {
    // Simulate fetching data from a database
    console.log(`Fetching user data for ID: ${userId}`);
    return {
      id: userId,
      name: `User ${userId}`,
      email: `user${userId}@example.com`
    };
  }
};

const userProxyHandler = {
  get: function(target, property) {
    if (!target.userData) {
      target.userData = userDatabase.getUserData(target.userId);
    }
    return target.userData[property];
  }
};

function createUserProxy(userId) {
  return new Proxy({ userId: userId }, userProxyHandler);
}

const user = createUserProxy(123);

console.log(user.name);  // Output: Fetching user data for ID: 123
                         //         User 123
console.log(user.email); // Output: user123@example.com

            

              
                Copy
              
            
          

            const logHandler = {
  get: function(target, property, receiver) {
    console.log(`GET ${property}`);
    return Reflect.get(target, property, receiver);
  },
  set: function(target, property, value, receiver) {
    console.log(`SET ${property} = ${value}`);
    return Reflect.set(target, property, value, receiver);
  }
};

const myObject = { a: 1, b: 2 };
const loggedObject = new Proxy(myObject, logHandler);

console.log(loggedObject.a);  // Output: GET a
                            //         1
loggedObject.b = 5;         // Output: SET b = 5
console.log(myObject.b);    // Output: 5 (original object is modified)

            

              
                Copy
              
            
          

            const secretData = {
  sensitiveInfo: 'This is confidential data'
};

const accessControlHandler = {
  get: function(target, property) {
    if (property === 'sensitiveInfo') {
      // Only allow access if the user is authenticated
      if (!isAuthenticated()) {
        return 'Access denied';
      }
    }
    return target[property];
  }
};

function isAuthenticated() {
  // Replace with your authentication logic
  return false; // Or true based on user authentication
}

const securedData = new Proxy(secretData, accessControlHandler);

console.log(securedData.sensitiveInfo); // Output: Access denied (if not authenticated)

// Simulate authentication (replace with actual authentication logic)
function isAuthenticated() {
  return true;
}

console.log(securedData.sensitiveInfo); // Output: This is confidential data (if authenticated)

            

              
                Copy
              
            
          

            function deepFreeze(obj) {
  if (typeof obj !== 'object' || obj === null) {
    return obj;
  }

  const handler = {
    set: function(target, property, value) {
      throw new Error('Cannot modify immutable object');
    },
    deleteProperty: function(target, property) {
      throw new Error('Cannot delete property from immutable object');
    },
    setPrototypeOf: function(target, prototype) {
      throw new Error('Cannot set prototype of immutable object');
    }
  };

  const proxy = new Proxy(obj, handler);

  // Recursively freeze nested objects
  for (const key in obj) {
    if (obj.hasOwnProperty(key)) {
      obj[key] = deepFreeze(obj[key]);
    }
  }

  return proxy;
}

const immutableObject = deepFreeze({ a: 1, b: { c: 2 } });

try {
  immutableObject.a = 5; // Throws Error
} catch (e) {
  console.error(e);
}

try {
  immutableObject.b.c = 10; // Throws Error (because b is also frozen)
} catch (e) {
  console.error(e);
}

            

              
                Copy
              
            
          

            const defaultValues = {
  name: 'Unknown',
  age: 0,
  country: 'Unknown'
};

const defaultHandler = {
  get: function(target, property) {
    if (property in target) {
      return target[property];
    } else if (property in defaultValues) {
      console.log(`Using default value for ${property}`);
      return defaultValues[property];
    } else {
      return undefined;
    }
  }
};

const myObject = { name: 'Alice' };
const proxiedObject = new Proxy(myObject, defaultHandler);

console.log(proxiedObject.name);    // Output: Alice
console.log(proxiedObject.age);     // Output: Using default value for age
                                  //         0
console.log(proxiedObject.city);    // Output: undefined (no default value)

            

              
                Copy
              
            
          

            if (typeof Proxy === 'undefined') {
  // Proxy is not supported
  console.log('Proxies are not supported in this browser');
  // Implement a fallback mechanism
}

            

              
                Copy