1

我是一个 javascript 新手,所以到目前为止我写的代码很丑,有时是因为我缺乏经验,而且它与我习惯的语言有多么不同,所以我将在下面发布的代码有效,但我想知道我是否以正确的方式做这件事,或者它是否有效,但这是一种可怕的做法,或者有更好的方法。

基本上,我有一个在网格内移动的小家伙,他从服务器接收到一个动作,他可以​​在 8 个方向上移动(int):0:向上,1:向上,2:向右...... 7:向上-剩下。

服务器将向他发送这个0 <= action <= 7值,他必须采取正确的行动......现在,而不是使用 switch-case 结构。我创建了一个函数 goUp()、goLeft() 等,并将它们加载到一个数组中,所以我有一个这样的方法:

var getActionFunction = actions[action];
actionFunction();

但是,要设置这一切的是:

1)创建构造函数:

function LittleDude(container) {
    this.element = container; //I will move a div around, i just save it in field here.
}

LittleDude.prototype.goUp() {
    //do go up
    this.element.animate(etc...);
}

LittleDude.prototype.actions = [LittleDude.prototype.goUp, LittleDude.prototype.goUpLeft, ...];
//In this array I can't use "this.goUp", because this points to the window object, as expected

LittleDude.prototype.doAction = function(action) {
    var actionFunction = this.actions[action];
    actionFunction(); //LOOK AT THIS LINE
}

现在,如果您注意,最后一行将不起作用..因为:当我使用索引访问数组时,它会返回一个 LittleDude.prototype.goUp 例如...所以“this”关键字未定义..

goUp 有一个语句“this.element”...但是“this”没有定义,所以我必须这样写:

actionFunction.call(this);

所以我的 doAction 看起来像这样:

LittleDude.prototype.doAction = function(action) {
    var actionFunction = this.actions[action];
    actionFunction.call(this); //NOW IT WORKS
}

我需要知道这是否是骇人听闻的,或者我是否违反了某种“不要这样做”规则。或者也许可以用更好的方式编写。因为在我看来将它添加到原型中似乎有点奇怪,然后将它视为一个独立的函数。

4

2 回答 2

3

您正在尝试做的是可能的方法之一,但可以使其更简单。由于对象属性名称不是必需的字符串,因此您可以直接在原型上使用操作索引。你甚至不需要doAction功能。

LittleDude = function LittleDude(container) {
  this.container = container;
}

LittleDude.prototype[0] = LittleDude.prototype.goUp = function goUp() {
  console.log('goUp', this.container);
}

LittleDude.prototype[1] = LittleDude.prototype.goUpRight = function goUpRight() {
  console.log('goUpRight', this.container);
}

var littleDude = new LittleDude(123),
    action = 1;
littleDude[action](); // --> goUpRight 123
littleDude.goUp(); // --> goUp 123
于 2013-04-04T13:25:29.450 回答
1
actionFunction.call(this); //NOW IT WORKS

我需要知道这是否是骇人听闻的,或者我是否违反了某种“不要这样做”规则。或者也许可以用更好的方式编写。

不, using.call()非常适合绑定this关键字- 这就是它的用途。

因为在我看来将它添加到原型中似乎有点奇怪,然后将它视为一个独立的函数。

如果您不直接使用它们,则不必在原型上定义它们:-) 但是,如果您这样做,您可能不会将函数本身存储在数组中,而是方法名称然后用括号表示法调用它们:

// or make that a local variable somewhere?
LittleDude.prototype.actions = ["goUp", "goUpLeft", …];

LittleDude.prototype.doAction = function(action) {
    var methodName = this.actions[action];
    this[methodName](); // calls the function in expected context as well
}
于 2013-04-04T13:20:25.467 回答