Berbagi teknologi

ES6 Mencerminkan Penjelasan Rinci (3)

2024-07-12

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

Objek refleksi, seperti objek Proxy, adalah API baru yang disediakan oleh ES6 untuk objek pengoperasian. Objek refleksi dirancang untuk 4 tujuan.

  1. Letakkan beberapa metode objek Object yang jelas merupakan internal bahasa (seperti Object.defineProperty) ke objek Reflect. Pada tahap ini, beberapa metode diterapkan pada objek Object dan Reflect, dan metode baru di masa depan akan diterapkan hanya pada objek Reflect. Dengan kata lain, metode internal bahasa dapat diperoleh dari objek Reflect.
  2. Ubah hasil pengembalian beberapa metode Objek agar lebih masuk akal. Misalnya, Object.defineProperty(obj, name, desc) akan memunculkan kesalahan ketika properti tidak dapat ditentukan, sedangkan Reflect.defineProperty(obj, name, desc) akan menghasilkan 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. Biarkan operasi Objek menjadi perilaku fungsional. Beberapa operasi Objek sangat penting, seperti memberi nama pada obj dan menghapus obj[nama], tetapi Reflect.has(obj, name) dan Reflect.deleteProperty(obj, name) mengubahnya menjadi perilaku fungsional.
// 老写法
'assign' in Object // true
// 新写法
Reflect.has(Object, 'assign') // true
  • 1
  • 2
  • 3
  • 4
  1. Metode objek Reflect sesuai dengan metode objek Proxy satu-ke-satu. Selama itu adalah metode objek Proxy, metode yang sesuai dapat ditemukan pada objek Reflect. Hal ini memungkinkan objek Proxy dengan mudah memanggil metode Reflect yang sesuai untuk menyelesaikan perilaku default dan berfungsi sebagai dasar untuk mengubah perilaku. Dengan kata lain, tidak peduli bagaimana Proxy mengubah perilaku default, Anda selalu bisa mendapatkan perilaku default di 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

Metode Proxy mencegat perilaku penetapan atribut objek target. Ia menggunakan metode Reflect.set untuk menetapkan nilai pada properti objek, memastikan bahwa perilaku asli selesai, dan kemudian menerapkan fungsionalitas tambahan.

Metode yang umum digunakan:

Reflect.get(target, propertyKey[, receiver]): Dapatkan properti objek.
Reflect.set(target, propertyKey, value[, receiver]): Mengatur properti objek.
Reflect.has(target, propertyKey): Tentukan apakah properti ada pada objek.
Reflect.deleteProperty(target, propertyKey): Menghapus properti objek.
Reflect.ownKeys(target): Mengembalikan array dari semua properti objek itu sendiri.
Reflect.getOwnPropertyDescriptor(target, propertyKey): Dapatkan deskriptor properti objek.
Reflect.defineProperty(target, propertyKey, atribut): Mendefinisikan atau mengubah properti objek.
Reflect.preventExtensions(target): Mencegah objek diperluas.
Reflect.isExtensible(target): Tentukan apakah objek dapat diperluas.
Reflect.getExtension(target): Dapatkan prototipe objek.
Reflect.setPrototypeOf(target, prototype): Mengatur prototipe objek.

Contoh 1: Menggunakan 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

Contoh 2: Menggunakan 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

Contoh 3: Menggunakan Reflect.has

let obj = { name: "Alice" };

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

Contoh 4: Menggunakan 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

Contoh 5: Menggunakan Reflect.ownKeys

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

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

Contoh 6: Menggunakan 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

Contoh 7: Menggunakan Reflect.isExtensible

let obj = { name: "Alice" };

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

Contoh 8: Menggunakan Reflect.getPrototypeOf dan 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

Objek Reflect menyediakan serangkaian metode yang sesuai dengan perangkap Proxy, membuat operasi penyadapan JavaScript menjadi lebih intuitif dan nyaman. Penggunaan Reflect memastikan konsistensi dan perilaku operasi yang diharapkan, terutama ketika kondisi kegagalan atau kesalahan perlu ditangkap secara eksplisit.