【发布时间】：2022-01-03 14:31:25
【问题描述】：
var b = {
state: 'initial',
initial: {
onClick: function() {
console.log(this);
},
x: 0,
},
}
您好，我想知道是否可以在上面的代码中访问 onClick 函数中的 b 对象？
输出是{x: 0, onClick: ƒ} 而不是{state: 'initial', ... }
将其更改为箭头函数将改为输出窗口对象。
我正在制作一个密室逃脱游戏，有点鸡和蛋的情况。
var spriteObject =
{
img: null,
INITIAL: {
sourceX: 0,
sourceY: 0,
sourceWidth: 64,
sourceHeight: 64,
x: 0,
y: 0,
width: 64,
height: 64,
isWithinBounds: function(x, y) {
return x > this.x && x < this.x + this.width && y > this.y && y < this.y + this.height;
},
},
state: 'INITIAL',
};
const inventoryItems = [];
let currentRoom = "kitchen";
const knife = {
...spriteObject,
INITIAL: {
...spriteObject.INITIAL,
x: 200,
y: 162,
sourceX: 1330,
sourceY: 8,
sourceWidth: 803,
sourceHeight: 514,
width: 803,
height: 514,
onClick: () => {
inventoryItems.push(knife);
layers.kitchen.sprites = layers.kitchen.sprites.filter(sprite => sprite !== knife);
},
},
img: kitchenLayout,
};
const layers = {
kitchen: {
sprites: [knife],
},
};
window.addEventListener("click", function(e) {
const x = e.pageX - canvas.offsetLeft;
const y = e.pageY - canvas.offsetTop;
layers[currentRoom].sprites.forEach(sprite => {
const currSprite = sprite[sprite.state];
if (currSprite.onClick && currSprite.isWithinBounds(x, y)) {
currSprite.onClick();
render();
}
})
})
假设我有一个厨房房间，柜台上有一把刀。我可以挑选刀并将其放入我的库存中。这把刀将有 3 种不同的状态：柜台上（初始）、库存中和钝（使用后）。我不确定我是否想将库存建模为一个状态，但我无法弄清楚如何从厨房精灵列表中删除刀。它在上面的代码中是可行的，但它似乎依赖于我将刀声明为变量的事实。我不想这样做，以防我想直接在 sprites 数组上声明我的项目。我感谢任何提示，谢谢
【问题讨论】：
-
为什么不像
b.x那样直接使用b.whatyouneed？ -
稍后会调用一个函数，所以理论上是的，你可以按照当时的定义。
-
b.initial.onClick 不能等于 b.state 作为示例，最初因为它在初始化对象期间不存在，但如果你避免这样做，你会没事的；函数应该是 AOK。
-
this在onClick调用期间的上下文将始终是对象b的initial对象。只要不提供父引用/链接作为b.initial本身的直接属性，initial就不会“知道” 其父结构。 arrow function 不能绑定任何this上下文。它具有词法范围。
标签： javascript object this