JavaScript - 等效于 PHP 类 self::答案

【问题标题】：JavaScript - Equivalent of PHP Class self::JavaScript - 等效于 PHP 类 self::
【发布时间】：2015-02-08 04:59:16
【问题描述】：

所以我一直在寻找这个，因为无法实现这一点让我很头疼......而且似乎没有我期望的解决方案。

假设我们有一个示例 PHP 类：

<?php 

class SampleClass {

    function doA() {
        echo 'Hello world';
    }

    function doB() {

        $sampleArray = ['Hey', 'You'];

        foreach( $sampleArray as $key => $value ) {

            self::doA();

        }

    }

}

?>

由于 foreach 循环，此代码将回显 Hello World 两次。这很好。

现在我有这个script：

function SectionHandler($appWrap) {

 this.appWrap = $appWrap;

 this.loading = function() {
    this.appWrap.addClass('section-loading').html("<i class='fa fa-refresh fa-2x fa-spin'></i>");
 }

 this.setError = function($info) {
    this.appWrap.addClass('section-error').html($info);
 }

 this.load = function($section) {

  var $fileCheck = $.get($section).success(function(){
    self.loading();
    self.load($section);
  }).fail(function(){
    self.setError('No se pudo cargar los datos especificados desde ' + $section + ' ;');
  });

 }

}

我相信 this.loading() 不再指向 main 函数，因为 $.get().success() 函数。我不知道真正的原因。

问题是this.loading(), this.load(), this.setError() 都没有工作。

那么，我如何像使用 PHP self:: 函数一样指向主函数？

-- 编辑--

正如@Eclecticist 指出的this.load($section); 行将一直执行直到它失败或出错，我将整个检查更改为：

var $fileCheck = $.get($section).done(function(response){
 self.appWrap.html(response);
}).fail(function(){
 self.setError('No se pudo cargar los datos especificados desde ' + $section);
});

【问题讨论】：

也许这会有所帮助：javascriptkata.com/2007/05/14/…
@Mark 我一直在思考这个问题，以至于我无法猜到那个......现在我觉得自己很愚蠢呵呵......非常感谢。

标签： javascript php

【解决方案1】：

试试这个：

function SectionHandler($appWrap) {
    var that = this;

    this.appWrap = $appWrap;
    this.loading = function() {
        that.appWrap.addClass('section-loading').html("<i class='fa fa-refresh fa-2x fa-spin'></i>");
    }

    this.setError = function($info) {
        that.appWrap.addClass('section-error').html($info);
    }

    this.load = function($section) {
        var $fileCheck = $.get($section).success(function(){
            that.loading();
            that.load($section);
        }).fail(function(){
            that.setError('No se pudo cargar los datos especificados desde /[ ' + $section + ' ]\ ;');
        });
    }    
}

问题在于，一旦您进入函数内部，this 的值就会发生变化。您可以通过在主函数中声明一个变量that 来解决它，并在以后引用它。

--编辑--

我想注意，that.load($section); 行将递归调用 SectionHandler.load()，直到 AJAX 请求失败，或者直到您收到 stackoverflow 错误。

是的，我一直希望出现一些可以引用该错误的东西:)

【讨论】：

您可以删除该行。正如它现在所写的那样，我认为在同一个 URL 上一遍又一遍地调用 $.get() 是没有意义的。

【解决方案2】：

你的想法是对的，但是this 的上下文可以在另一个函数的范围内改变（它在 jQuery 回调的上下文中），所以如果你想确保this.loading() 始终是您所指向的，在 JavaScript 中，您希望将 this 分配给变量，以便您可以从 this 的特定版本调用函数。通常称为self 或that。像这样：

function SectionHandler($appWrap) {
    var self = this;
    self.appWrap = $appWrap;

    self.loading = function() {
       self.appWrap.addClass('section-loading')
           .html("<i class='fa fa-refresh fa-2x fa-spin'></i>");
    }

    self.setError = function($info) {
        self.appWrap.addClass('section-error').html($info);
    }

    self.load = function($section) {
        var $fileCheck = $.get($section).success(function(){
            self.loading();
            self.load($section);
        }).fail(function(){
            self.setError('No se pudo cargar los datos especificados' + 
                        ' desde /[ ' + $section + ' ]\ ;');
        });
    }
}

【讨论】：

【解决方案3】：

你的想法是对的，因为这里代码中的this 不再表示SectionHandler，而是裁判$.get($section).success(function()。处理此问题的一种方法是在进入函数之前将 this 存储在变量中：

function SectionHandler($appWrap) {
    var self = this;
    ...
    this.load = function($section) {
        var $fileCheck = $.get($section).success(function(){
            self.loading();
            ...

【讨论】：