Heim  >  Artikel  >  Web-Frontend  >  Eine kurze Analyse der in JavaScript integrierten Objekte von Reflect (detaillierte Codeerklärung)

Eine kurze Analyse der in JavaScript integrierten Objekte von Reflect (detaillierte Codeerklärung)

奋力向前
奋力向前nach vorne
2021-08-25 13:16:502373Durchsuche

Im vorherigen Artikel „Ein Artikel zur Erläuterung des Routing-Switching zum Beenden asynchroner Anforderungen in Vue (mit Code) “ habe ich Ihnen das Routing-Switching zum Beenden asynchroner Anforderungen in Vue vorgestellt. Der folgende Artikel wird Ihnen helfen, die in js integrierten Reflect-Objekte zu verstehen. Er hat einen gewissen Referenzwert. Ich hoffe, er wird Ihnen hilfreich sein.

Eine kurze Analyse der in JavaScript integrierten Objekte von Reflect (detaillierte Codeerklärung)

Semantik

Reflect ist ein integriertes Objekt, das Methoden zum Abfangen von JavaScript-Operationen bereitstellt. Diese Methoden sind mit denen des Prozessorobjekts identisch. Reflect ist kein Funktionsobjekt und daher nicht konstruierbar. Reflect是一个内置的对象,它提供拦截JavaScript操作的方法。这些方法与处理器对象的方法相同。Reflect不是一个函数对象,因此它是不可构造的。

描述

与大多数全局对象不同,Reflect没有构造函数。你不能将其与一个new运算符一起使用,或者将Reflect对象作为一个函数来调用。Reflect的所有属性和方法都是静态的(就像 Math 对象)。

兼容性

Chrome:49+

Firefox (Gecko):42+

其他浏览器暂未实现

句法

Reflect.apply(target, thisArgument, argumentsList)

参数

target

目标函数。

thisArgument target

函数调用时绑定的this对象。

argumentsList

target函数调用时传入的实参列表,该参数应该是一个类数组的对象。

方法

Reflect.apply()

Reflect.construct(target, argumentsList[, newTarget])

静态方法Reflect.apply()通过指定的参数列表发起对目标(target)函数的调用。

Reflect.apply(Math.floor, undefined, [1.75]);
// 1;

Reflect.apply(String.fromCharCode, undefined, [104, 101, 108, 108, 111]);
// "hello"

Reflect.apply(RegExp.prototype.exec, /ab/, ["confabulation"]).index;
// 4

Reflect.apply("".charAt, "ponies", [3]);
// "i"

Reflect.construct()

Reflect.construct()方法的行为有点像new操作符 构造函数 , 相当于运行new target(...args)

var d = Reflect.construct(Date, [1776, 6, 4]);
d instanceof Date; // true
d.getFullYear(); // 1776

Reflect.defineProperty()

Reflect.defineProperty()是一个静态的方法,看起来像Object.defineProperty()但是它返回一个布尔值

const object1 = {};

if (Reflect.defineProperty(object1, "property1", { value: 42 })) {
  console.log("property1 created!");
  // expected output: "property1 created!"
} else {
  console.log("problem creating property1");
}

console.log(object1.property1);
// expected output: 42

Reflect.deleteProperty()

静态方法Reflect.deleteProperty()允许用于删除属性。它很像delete operator,但它是一个函数。Reflect.deleteProperty允许你删除一个对象上的属性。返回一个Boolean值表示该属性是否被成功删除。它几乎与非严格的delete operator相同。

Reflect.deleteProperty(target, propertyKey)

var obj = { x: 1, y: 2 };
Reflect.deleteProperty(obj, "x"); // true
obj; // { y: 2 }

var arr = [1, 2, 3, 4, 5];
Reflect.deleteProperty(arr, "3"); // true
arr; // [1, 2, 3, , 5]

// 如果属性不存在,返回 true
Reflect.deleteProperty({}, "foo"); // true

// 如果属性不可配置,返回 false
Reflect.deleteProperty(Object.freeze({ foo: 1 }), "foo"); // false

Reflect.get()

Reflect.get()方法的工作方式,就像从object (target[propertyKey])中获取属性,但它是作为一个函数执行的。

Reflect.get(target, propertyKey[, receiver])

// Object
var obj = { x: 1, y: 2 };
Reflect.get(obj, "x"); // 1

// Array
Reflect.get(["zero", "one"], 1); // "one"

// Proxy with a get handler
var x = { p: 1 };
var obj = new Proxy(x, {
  get(t, k, r) {
    return k + "bar";
  },
});
Reflect.get(obj, "foo"); // "foobar"

Reflect.getOwnPropertyDescriptor()

静态方法Reflect.getOwnPropertyDescriptor()与Object.getOwnPropertyDescriptor()方法相似。如果在对象中存在,则返回给定的属性的属性描述符。否则返回 undefined。

Reflect.getOwnPropertyDescriptor(target, propertyKey)

Reflect.getOwnPropertyDescriptor({ x: "hello" }, "x");
// {value: "hello", writable: true, enumerable: true, configurable: true}

Reflect.getOwnPropertyDescriptor({ x: "hello" }, "y");
// undefined

Reflect.getOwnPropertyDescriptor([], "length");
// {value: 0, writable: true, enumerable: false, configurable: false}

Reflect.getPrototypeOf()

静态方法Reflect.getPrototypeOf()与Object.getPrototypeOf()方法是一样的。都是返回指定对象的原型(即,内部的 [[Prototype]] 属性的值)。

Reflect.getPrototypeOf(target)

Reflect.getPrototypeOf({}); // Object.prototype
Reflect.getPrototypeOf(Object.prototype); // null
Reflect.getPrototypeOf(Object.create(null)); // null

Reflect.has()

静态方法Reflect.has()作用与in操作符相同。 

Reflect.has(target, propertyKey)

Reflect.has({ x: 0 }, "x"); // true
Reflect.has({ x: 0 }, "y"); // false

// 如果该属性存在于原型链中,返回true
Reflect.has({ x: 0 }, "toString");

// Proxy 对象的 .has() 句柄方法
obj = new Proxy(
  {},
  {
    has(t, k) {
      return k.startsWith("door");
    },
  }
);
Reflect.has(obj, "doorbell"); // true
Reflect.has(obj, "dormitory"); // false

Reflect.isExtensible()

静态方法Reflect.isExtensible()判断一个对象是否可扩展 (即是否能够添加新的属性)。与它Object.isExtensible()方法相似,但有一些不同,详情可见differences

Reflect.isExtensible(target)

// New objects are extensible.
var empty = {};
Reflect.isExtensible(empty); // === true

// ...but that can be changed.
Reflect.preventExtensions(empty);
Reflect.isExtensible(empty); // === false

// Sealed objects are by definition non-extensible.
var sealed = Object.seal({});
Reflect.isExtensible(sealed); // === false

// Frozen objects are also by definition non-extensible.
var frozen = Object.freeze({});
Reflect.isExtensible(frozen); // === false

//diff Object.isExtensible
Reflect.isExtensible(1);
// TypeError: 1 is not an object

Object.isExtensible(1);
// false

Reflect.ownKeys()

静态方法Reflect.ownKeys()返回一个由目标对象自身的属性键组成的数组。

Reflect.ownKeys(target)

const object1 = {
  property1: 42,
  property2: 13,
};

var array1 = [];

console.log(Reflect.ownKeys(object1));
// expected output: Array ["property1", "property2"]

console.log(Reflect.ownKeys(array1));
// expected output: Array ["length"]
Reflect.ownKeys({ z: 3, y: 2, x: 1 }); // [ "z", "y", "x" ]
Reflect.ownKeys([]); // ["length"]

var sym = Symbol.for("comet");
var sym2 = Symbol.for("meteor");
var obj = {
  [sym]: 0,
  str: 0,
  "773": 0,
  "0": 0,
  [sym2]: 0,
  "-1": 0,
  "8": 0,
  "second str": 0,
};
Reflect.ownKeys(obj);
// [ "0", "8", "773", "str", "-1", "second str", Symbol(comet), Symbol(meteor) ]
// Indexes in numeric order,
// strings in insertion order,
// symbols in insertion order

Reflect.preventExtensions()

静态方法Reflect.preventExtensions()方法阻止新属性添加到对象例如:防止将来对对象的扩展被添加到对象中)。该方法与Object.preventExtensions()相似,但有一些不同点。

Reflect.preventExtensions(target)

// Objects are extensible by default.
var empty = {};
Reflect.isExtensible(empty); // === true

// ...but that can be changed.
Reflect.preventExtensions(empty);
Reflect.isExtensible(empty); // === false

//diff Object.preventExtensions()
Reflect.preventExtensions(1);
// TypeError: 1 is not an object

Object.preventExtensions(1);
// 1

Reflect.set()

静态方法Reflect.set()

Beschreibung

Anders als die meisten globalen Objekte hat Reflect keinen Konstruktor. Sie können es nicht mit einem new-Operator verwenden oder ein Reflect-Objekt als Funktion aufrufen. Alle Eigenschaften und Methoden von Reflect sind statisch (genau wie das Math-Objekt).

🎜Kompatibilität🎜🎜Chrome: 49+🎜🎜Firefox (Gecko): 42+🎜🎜Andere Browser noch nicht implementiert🎜🎜Syntax🎜🎜🎜Reflect.apply(target, thisArgument, argumentsList)🎜🎜🎜Parameter 🎜🎜target🎜🎜Target-Funktion. 🎜🎜thisArgument target🎜🎜Das this-Objekt, das beim Aufruf der Funktion gebunden wird. 🎜🎜argumentsList🎜🎜Die Liste der tatsächlichen Parameter, die beim Aufruf der Zielfunktion übergeben werden. Dieser Parameter sollte ein Array-ähnliches Objekt sein. 🎜🎜Methoden🎜🎜Reflect.apply()🎜🎜🎜Reflect.construct(target, argumentsList[, newTarget])🎜🎜🎜Statische Methode Reflect.apply()Passed Die angegebene Argumentliste initiiert einen Aufruf der Zielfunktion (target). 🎜
// Object
var obj = {};
Reflect.set(obj, "prop", "value"); // true
obj.prop; // "value"

// Array
var arr = ["duck", "duck", "duck"];
Reflect.set(arr, 2, "goose"); // true
arr[2]; // "goose"

// It can truncate an array.
Reflect.set(arr, "length", 1); // true
arr; // ["duck"];

// With just one argument, propertyKey and value are "undefined".
var obj = {};
Reflect.set(obj); // true
Reflect.getOwnPropertyDescriptor(obj, "undefined");
// { value: undefined, writable: true, enumerable: true, configurable: true }
🎜Reflect.construct()🎜🎜Reflect.construct()Die Methode verhält sich ein wenig wie der neue Operatorkonstruktor, was dem Ausführen vonneuem Ziel entspricht (. ..args). 🎜
Reflect.setPrototypeOf({}, Object.prototype); // true

// It can change an object's [[Prototype]] to null.
Reflect.setPrototypeOf({}, null); // true

// Returns false if target is not extensible.
Reflect.setPrototypeOf(Object.freeze({}), null); // false

// Returns false if it cause a prototype chain cycle.
var target = {};
var proto = Object.create(target);
Reflect.setPrototypeOf(target, proto); // false
🎜Reflect.defineProperty()🎜🎜Reflect.defineProperty() ist eine statische Methode, die wie Object.defineProperty() aussieht gibt einen booleschen Wert zurück🎜rrreee🎜Reflect.deleteProperty()🎜🎜Die statische Methode Reflect.deleteProperty() ermöglicht das Löschen von Eigenschaften. Es ähnelt stark dem delete-Operator, ist aber eine Funktion. Mit Reflect.deleteProperty können Sie Eigenschaften eines Objekts löschen. Gibt einen booleschen Wert zurück, der angibt, ob das Attribut erfolgreich gelöscht wurde. Es ist fast dasselbe wie der nicht strikte Löschoperator. 🎜🎜🎜Reflect.deleteProperty(target, propertyKey)🎜🎜rrreee🎜Reflect.get()🎜🎜Reflect.get() Methode funktioniert wie von object ( target[propertyKey]) verwenden, um die Eigenschaft abzurufen, sie wird jedoch als Funktion ausgeführt. 🎜🎜🎜Reflect.get(target, propertyKey[, Receiver])🎜🎜rrreee🎜Reflect.getOwnPropertyDescriptor()🎜🎜Statische Methoden Reflect.getOwnPropertyDescriptor() und Object.getOwnPropertyDescriptor()Die Methode ist ähnlich. Gibt den Eigenschaftsdeskriptor der angegebenen Eigenschaft zurück, sofern im Objekt vorhanden. Andernfalls wird undefiniert zurückgegeben. 🎜🎜🎜Reflect.getOwnPropertyDescriptor(target, propertyKey)🎜🎜rrreee🎜<strong>Reflect.getPrototypeOf()</strong>🎜🎜Statische Methode <code>Reflect.getPrototypeOf() und Object.getPrototypeOf()-Methode Es ist das Gleiche. Beide geben den Prototyp des angegebenen Objekts zurück (d. h. den Wert des internen Attributs [[Prototype]] ). 🎜🎜🎜Reflect.getPrototypeOf(target)🎜🎜rrreee🎜Reflect.has()🎜🎜Die statische Methode Reflect.has() funktioniert genauso wie inOperatoren sind die gleichen. 🎜🎜🎜Reflect.has(target, propertyKey)🎜🎜rrreee🎜<strong>Reflect.isExtensible()</strong>🎜🎜Statische Methode <code>Reflect.isExtensible() bestimmt, ob ein Objekt erweiterbar ist ( Das heißt, ob neue Attribute hinzugefügt werden können). Sie ähnelt der Methode Object.isExtensible(), weist jedoch einige Unterschiede auf. Einzelheiten finden Sie unter Unterschiede. 🎜🎜Reflect.isExtensible(target)🎜rrreee🎜Reflect.ownKeys()🎜🎜Statische Methode Reflect.ownKeys() gibt ein Ziel An zurück Array von Eigenschaftsschlüsseln des Objekts selbst. 🎜🎜🎜Reflect.ownKeys(target)🎜🎜rrreee🎜Reflect.preventExtensions()🎜🎜Statische Methode Die Methode Reflect.preventExtensions() verhindert, dass neue Eigenschaften hinzugefügt werden Beispiel: Verhindern Sie, dass dem Objekt zukünftige Erweiterungen hinzugefügt werden. Diese Methode ähnelt Object.preventExtensions(), weist jedoch einige Unterschiede auf. 🎜🎜🎜Reflect.preventExtensions(target)🎜🎜rrreee🎜Reflect.set()🎜🎜Die statische Methode Reflect.set() funktioniert wie das Festlegen einer Eigenschaft für ein Objekt . 🎜🎜🎜Reflect.set(target, propertyKey, value[, Receiver])🎜
// Object
var obj = {};
Reflect.set(obj, "prop", "value"); // true
obj.prop; // "value"

// Array
var arr = ["duck", "duck", "duck"];
Reflect.set(arr, 2, "goose"); // true
arr[2]; // "goose"

// It can truncate an array.
Reflect.set(arr, "length", 1); // true
arr; // ["duck"];

// With just one argument, propertyKey and value are "undefined".
var obj = {};
Reflect.set(obj); // true
Reflect.getOwnPropertyDescriptor(obj, "undefined");
// { value: undefined, writable: true, enumerable: true, configurable: true }

Reflect.setPrototypeOf()

静态方法Reflect.setPrototypeOf()与Object.setPrototypeOf()方法是一致的。它将指定对象的原型 (即,内部的[[Prototype]] 属性)设置为另一个对象或为null

Reflect.setPrototypeOf(target, prototype)

Reflect.setPrototypeOf({}, Object.prototype); // true

// It can change an object&#39;s [[Prototype]] to null.
Reflect.setPrototypeOf({}, null); // true

// Returns false if target is not extensible.
Reflect.setPrototypeOf(Object.freeze({}), null); // false

// Returns false if it cause a prototype chain cycle.
var target = {};
var proto = Object.create(target);
Reflect.setPrototypeOf(target, proto); // false

推荐学习:JavaScript视频教程

Das obige ist der detaillierte Inhalt vonEine kurze Analyse der in JavaScript integrierten Objekte von Reflect (detaillierte Codeerklärung). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:chuchur.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen