Javascript OOP，从其他嵌套方法访问方法 [英] Javascript OOP, Accessing methods from other nested methods

问题描述

好吧，伙计们，通过学习我的JS到达那里. 我碰到过一个单数. 这是代码:

Ok, folks, getting there with learning my JS. I have come across a singular one. Here's the code:

hangar = function(game){
}

hangar.prototype = {
  
  loadImages: function(graphicAssets){
    ...
  },
  
  writeTerminal: function(timer, str, destination){
  },
  
  writeStats: function(){
    var writeTerminal = this.writeTerminal;
    console.log('wt', this.writeTerminal);
    console.log('wt2', writeTerminal);
    //ZOMG This does not work!
  },
    
  handleHangarInput: function(layerShips, layerBg){
    
    ... does some variable declarations of which one is:
    
    var writeStats = this.writeStats;
    
    function viewHangarPosition() {
      
      writeStats(); // This works
      
    }
    
    keyleft.onDown.add(function(){
        
        if (currentship > 0) {
            currentship--;
            viewHangarPosition();
        }
    });

    keyright.onDown.add(function(){
        
        if (currentship < shipNumber-1) {
            currentship++;
            viewHangarPosition();
        }
    });

  }
  create: function(){
      this.handleHangarInput(layerShips, layerBg);
  }
    
}

这就是所有的名称(index.html):

here is where it's all called (index.html):

        window.onload = function() {

            var game = new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.AUTO, '', { preload: preload, create: create, update:update });

            function preload() {
            }

            function create() {
                game.state.add('menu', menu);
                game.state.add('hangar', hangar);
                game.state.start('hangar');
            }

            function update() {
            }
            
        }

我正在尝试从 writeStats 中获取 writeTerminal ，这对我不起作用.

I am trying to get hold of writeTerminal from within writeStats, which is not working for me.

• 这是怎么做到的 ?
• 是否有一种更智能的方式来使用writeStats而不是在 handleHangarInput 中声明它?

• How is this done?
• Is there a smarter way to use writeStats instead of declaring it inside handleHangarInput?

仍然不是封闭和作用域的专家. 一如既往地感谢您的帮助！

Still not a pro in closures and Scoping. As always appreciate your help!

使用其他代码进行编辑

这是修改后的代码:

hangar = function(game){
}

hangar.prototype = {
  
  loadImages: function(graphicAssets){
    ...
  },
  
  writeTerminal: function(timer, str, destination){
  },
  
  writeStats: function(){
      console.log(this); // returns undefined
      console.log(this.writeTerminal); // errors out!
  },
    
  handleHangarInput: function(layerShips, layerBg){
    
    ... does some variable declarations of which one is:
    
    var writeStats = this.writeStats;
    
    function viewHangarPosition() {
      
      writeStats.call(this);
      
    }
    
    keyleft.onDown.add(function(){
        
        if (currentship > 0) {
            currentship--;
            viewHangarPosition();
        }
    });

    keyright.onDown.add(function(){
        
        if (currentship < shipNumber-1) {
            currentship++;
            viewHangarPosition();
        }
    });

  }
  create: function(){
      this.handleHangarInput(layerShips, layerBg);
  }
    
}

推荐答案

JavaScript的this关键字具有 calltime 绑定.即，this在函数中所指的内容取决于调用的确切程度(而不是其定义方式).简而言之:this是指调用该方法的对象.

Javascript has calltime binding of the this keyword. I.e., what this refers to in a function depends on how exactly that function was called (not how it was defined). In a nutshell: this refers to the object the method was called on.

foo.bar();

在bar内部，关键字this将引用foo.

Here inside bar the keyword this will refer to foo.

bar();

在bar内部，关键字this不会特别引用任何内容，因此默认为全局对象window.

Here inside bar the keyword this will not refer to anything in particular, so defaults to the global object window.

var bar = foo.bar;
bar();

与上述(window)相同，因为该函数的调用方式.

Same as above (window), because of how the function was called.

如果要重新分配对象方法，但仍在调用时保留其上下文，则需要显式处理此问题:

If you want to reassign object methods yet still keep their context at call time, you need to handle this explicitly:

var bar = foo.bar.bind(foo);
bar();

// or:
var bar = foo.bar();
bar.call(foo);

这篇关于Javascript OOP，从其他嵌套方法访问方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！