Compartir tecnología

ES6 refleja una explicación detallada (3)

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

El objeto Reflect, al igual que el objeto Proxy, es una nueva API proporcionada por ES6 para operar objetos. Los objetos reflectantes están diseñados para 4 propósitos.

  1. Coloque algunos métodos del objeto Object que obviamente son internos al lenguaje (como Object.defineProperty) en el objeto Reflect. En esta etapa, algunos métodos se implementan en objetos Object y Reflect, y los nuevos métodos en el futuro se implementarán solo en objetos Reflect. En otras palabras, los métodos internos del lenguaje se pueden obtener del objeto Reflect.
  2. Modifique los resultados de retorno de algunos métodos de Objeto para hacerlos más razonables. Por ejemplo, Object.defineProperty(obj, name, desc) generará un error cuando la propiedad no se pueda definir, mientras que Reflect.defineProperty(obj, name, desc) devolverá false.
// 老写法
try {
  Object.defineProperty(target, property, attributes);
  // success
} catch (e) {
  // failure
}
// 新写法
if (Reflect.defineProperty(target, property, attributes)) {
  // success
} else {
  // failure
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  1. Deje que las operaciones de Objetos se conviertan en comportamientos funcionales. Algunas operaciones de objetos son imperativas, como nombrar en obj y eliminar obj[nombre], pero Reflect.has(obj, nombre) y Reflect.deleteProperty(obj, nombre) las convierten en comportamientos funcionales.
// 老写法
'assign' in Object // true
// 新写法
Reflect.has(Object, 'assign') // true
  • 1
  • 2
  • 3
  • 4
  1. Los métodos del objeto Reflect corresponden a los métodos del objeto Proxy uno a uno. Siempre que sea un método del objeto Proxy, el método correspondiente se puede encontrar en el objeto Reflect. Esto permite que el objeto Proxy llame fácilmente al método Reflect correspondiente para completar el comportamiento predeterminado y servir como base para modificar el comportamiento. En otras palabras, no importa cómo modifique Proxy el comportamiento predeterminado, siempre podrá obtener el comportamiento predeterminado en Reflect.
Proxy(target, {
  set: function(target, name, value, receiver) {
    var success = Reflect.set(target, name, value, receiver);
    if (success) {
      console.log('property ' + name + ' on ' + target + ' set to ' + value);
    }
    return success;
  }
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

El método Proxy intercepta el comportamiento de asignación de atributos del objeto de destino. Utiliza el método Reflect.set para asignar valores a las propiedades del objeto, asegurando que se complete el comportamiento original y luego implementa funciones adicionales.

Métodos comúnmente utilizados:

Reflect.get (destino, propiedadKey [, receptor]): obtiene las propiedades del objeto.
Reflect.set (objetivo, clave de propiedad, valor [, receptor]): establece las propiedades del objeto.
Reflect.has (destino, propiedadKey): determina si la propiedad existe en el objeto.
Reflect.deleteProperty (destino, propiedadKey): elimina las propiedades del objeto.
Reflect.ownKeys (objetivo): devuelve una matriz de todas las propiedades del objeto en sí.
Reflect.getOwnPropertyDescriptor (destino, propiedadKey): obtiene el descriptor de la propiedad del objeto.
Reflect.defineProperty (destino, propiedadClave, atributos): define o modifica las propiedades del objeto.
Reflect.preventExtensions (objetivo): evita que el objeto se extienda.
Reflect.isExtensible (objetivo): determina si el objeto es extensible.
Reflect.getExtension (destino): obtiene el prototipo del objeto.
Reflect.setPrototypeOf (objetivo, prototipo): establece el prototipo del objeto.

Ejemplo 1: uso de Reflect.get

let obj = { name: "Alice", age: 25 };
let propName = "name";

console.log(Reflect.get(obj, propName)); // 输出:Alice
console.log(Reflect.get(obj, "gender")); // 输出:undefined
  • 1
  • 2
  • 3
  • 4
  • 5

Ejemplo 2: uso de Reflect.set

let obj = { name: "Alice" };

// 设置属性
console.log(Reflect.set(obj, "age", 30)); // 输出:true

console.log(obj); // 输出:{ name: "Alice", age: 30 }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

Ejemplo 3: uso de Reflect.has

let obj = { name: "Alice" };

console.log(Reflect.has(obj, "name")); // 输出:true
console.log(Reflect.has(obj, "age"));  // 输出:false
  • 1
  • 2
  • 3
  • 4

Ejemplo 4: uso de Reflect.deleteProperty

let obj = { name: "Alice", age: 30 };

// 删除属性
console.log(Reflect.deleteProperty(obj, "age")); // 输出:true

console.log(obj); // 输出:{ name: "Alice" }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

Ejemplo 5: uso de Reflect.ownKeys

let obj = { name: "Alice", age: 30 };

console.log(Reflect.ownKeys(obj)); // 输出:["name", "age"]
  • 1
  • 2
  • 3

Ejemplo 6: uso de Reflect.preventExtensions

let obj = { name: "Alice" };

// 防止对象被扩展
console.log(Reflect.preventExtensions(obj)); // 输出:true

// 尝试添加新属性
console.log(Reflect.set(obj, "age", 30)); // 输出:false
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

Ejemplo 7: uso de Reflect.isExtensible

let obj = { name: "Alice" };

console.log(Reflect.isExtensible(obj)); // 输出:true
  • 1
  • 2
  • 3

Ejemplo 8: uso de Reflect.getPrototypeOf y Reflect.setPrototypeOf

let proto = { sayHello: function() { console.log("Hello!"); }};
let obj = Object.create(proto);

console.log(Reflect.getPrototypeOf(obj) === proto); // 输出:true

// 设置新原型
let newProto = { sayGoodbye: function() { console.log("Goodbye!"); }};
Reflect.setPrototypeOf(obj, newProto);

console.log(obj.sayGoodbye); // 可以访问新原型上的方法
obj.sayGoodbye(); // 输出:Goodbye!
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11

El objeto Reflect proporciona un conjunto de métodos correspondientes a las trampas de Proxy, lo que hace que la interceptación de operaciones de JavaScript sea más intuitiva y conveniente. El uso de Reflect garantiza la coherencia y el comportamiento esperado de las operaciones, especialmente cuando las condiciones de falla o los errores deben capturarse explícitamente.