Question

使用ES6 / ES2015和webpack，我试图将自己的头缠在关键字 this 的小怪物上。

我有一个包含静态方法Edit的类change(event)，在该方法中，我试图对方法本身进行递归调用（取决于给定的变量）。

在大多数情况下，我只能调用this.change(event)，但此处的关键字 this 已被调用该函数的jquery对象而不是包含类的占用。

最简单的解决方案是只调用Edit.change(event)，但必须有一个更干净的解决方案。到目前为止，我遇到的每种编程语言都对其内置的包含类有所参考。

我保证我已经检查了stackoverflow上的文档和其他线程，但我发现似乎没有人解决这一特定问题。

// main.js
'use strict';

const $ = require('jquery');
const Edit = require('./Edit');

$(document).ready(() => {
    let thingsToAddToData = {
        whatToDo: // defined here depending on context
        someVariable: //defined here depending on context
        };
    $('table :input').change(thingsToAddToData, Edit.change);
}

在这里定义了Edit类

// Edit.js
class Edit {

    static change(event) {
        if(event.data.whatToDo === 'do_nothing'){
            return false;
        }
        if(event.data.whatToDo === 'do_this_important_thing'){
            // here some important stuff is done
            return true;
        }

        if(event.data.someVariable === 'special_case'){
            event.data.whatToDo = 'do_this_important_thing'

            // THIS IS THE LINE THAT GIVES ME HEADACHES
            return this.change(event);
        }
        // here some default stuff is done
    }
}

module.exports = Edit;

Answer 1

最简单的解决方案是只调用Edit.change(event)，但必须有一个更干净的解决方案

否，这确实是始终引用Edit类所需要使用的。没什么麻烦，只需使用它即可。

如果未将方法用作事件处理程序，则也可以使用this.change(event)。确保将其作为方法调用：

$('table :input').change(thingsToAddToData, Edit.change.bind(Edit));
// or
$('table :input').change(thingsToAddToData, e => Edit.change(e));

Answer 2

@Bergi的任何一个答案都应该起作用（使用Function.prototype.bind或() => {}）。但是我认为您的问题更具结构性。由于Edit.change是事件处理程序，因此直接调用它是没有意义的，因为它应该通过事件触发。

我建议通过一些参数更改（http://api.jquery.com/trigger/）再次触发该事件：

将Edit.change(event);替换为this.trigger(event);

这样一来，就无需直接调用处理程序，也不需要更改this上下文，从而使代码更加透明。

Answer 3

静态方法在类上而不是类的实例上操作，它们在类上被调用。调用静态方法有两种方法：

<ClassName>.methodName()

或

<class-instance>.constructor.methodName()

在静态方法中，this关键字引用该类。您可以使用此方法从同一类中的另一个静态方法中调用一个静态方法。

当调用对象已使用“ this”时，如何从静态方法中引用包含类？

3 个答案: