JavaScript handler.ownKeys()方法



handler.ownKeys() 是 JavaScript 中的一种与 Proxy 对象结合使用的方法。代理是 JavaScript 中的一个对象,它封装另一个对象(目标),并允许您修改和拦截对该对象的操作。这包括获取和设置属性、调用函数等操作。

handler.ownKeys() 方法是 Proxy 处理程序对象可以定义的陷阱之一。当在已包装在代理中的目标对象上调用 Object.getOwnPropertyNames()、Object.getOwnPropertySymbols() 或 Object.keys() 方法时,它使您能够拦截获取该对象自己的属性键的过程。此方法使您可以对代理对象上的属性枚举方式进行强控制,从而使您能够根据需要自定义属性访问和行为。

语法

以下是 JavaScript handler.ownKeys() 方法的语法 -


new Proxy(target, {
	 	ownKeys(target) {}
});

参数

  • target − 它保存目标对象。

返回值

此方法返回 enumerable 对象。

示例 1

让我们看看下面的例子,我们将使用返回所有键的 handler.ownKeys()


<html>
<style>
body {
	 	font-family: verdana;
	 	color: #DE3163;
}
</style>
<body>
<script>
const a = {
	 	ownKeys(target) {
	 	 	 return Reflect.ownKeys(target);
	 	},
};
const b = new Proxy({
	 	x: 1,
	 	y: 2
}, a);
document.write(JSON.stringify(Object.keys(b)));
</script>
</body>
</html>

输出

如果我们执行上述程序,它将在网页上显示文本。

示例 2

考虑另一个场景,我们将要添加新属性。


<html>
<style>
body {
	 	font-family: verdana;
	 	color: #DE3163;
}
</style>
<body>
<script>
let a = {
	 	x: 1,
	 	y: 2,
};
let b = {
	 	ownKeys(a) {
	 	 	 return Reflect.ownKeys(a).concat(["z"]);
	 	}
};
let c = new Proxy(a, b);
document.write(JSON.stringify(Object.getOwnPropertyNames(c)));
</script>
</body>
</html>

输出

在执行上述脚本时,它将在网页上显示文本。

示例 3

在下面的示例中,我们将删除该属性并使用 handler.ownKeys() 返回所有键。


<html>
<style>
body {
	 	font-family: verdana;
	 	color: #DE3163;
}
</style>
<body>
<script>
const a = {
	 	ownKeys(b) {
	 	 	 return Reflect.ownKeys(b).filter(key => key !== 'y');
	 	},
};
const c = new Proxy({
	 	x: 1,
	 	y: 2
}, a);
document.write(JSON.stringify(Object.keys(c)));
</script>
</body>
</html>

当我们执行上述代码时,它将生成一个由网页上显示的文本组成的输出。

示例 4

下面是一个示例,我们将使用 handler.ownKeys() 来更改键的枚举顺序。


<html>
<style>
body {
	 	font-family: verdana;
	 	color: #DE3163;
}
</style>
<body>
<script>
let a = {
	 	x: 1,
	 	y: 2
};
let b = {
	 	ownKeys(a) {
	 	 	 return ['y', 'x'];
	 	}
};
let c = new Proxy(a, b);
document.write(JSON.stringify(Object.keys(c)));
</script>
</body>
</html>

在执行上述脚本时,将弹出输出窗口,在网页上显示文本。