Javascript 是否可以修改作为参数传递给类的方法

我想知道我是否可以修改作为参数传递给类的方法

例如，假设我已经创建了类

Column

，我将在其中创建Column，在该列上添加

EventListener

，并将callback recived作为参数。但我还想通过添加特殊行来修改此方法，该行将保存已单击或未单击的

列

class TableColumn {

    column = document.createElement('th');
    clickState = false;

    constructor(callback) {
        this.column.textContent = 'sort ascending / descending';
        this.column.addEventListener('click', callback);
    }

}

我知道我可以通过操纵元素属性来实现这一点，例如：

colum.setAttribute('was-sorted', 'false');

或者通过切换类：

column.classList.toggle('sorted');

如果我理解你的问题，你可以通过用你想要的行为预先结束对
回调的调用来实现你想要的：

constructor(callback) {
    this.column.textContent = 'sort ascending / descending';
    this.column.addEventListener('click', function(ev) {
        // Your desired code here

        // Call the callback
        callback(ev);
    });
}

如果我理解你的问题，你可以通过用你想要的行为预先结束对
回调的调用来实现你想要的：

constructor(callback) {
    this.column.textContent = 'sort ascending / descending';
    this.column.addEventListener('click', function(ev) {
        // Your desired code here

        // Call the callback
        callback(ev);
    });
}

典型的方法不是修改函数，而是创建该函数的唯一实例，例如：

class TableColumn {

    column = document.createElement('th');
    clickState = false;

    constructor(callback, params) {
        let innerCallback = (params) => callback(params);

        this.column.textContent = 'sort ascending / descending';
        this.column.addEventListener('click', innerCallback);
    }

}

编辑：发布的其他两个答案在功能上与此基本相同，这取决于您喜欢如何格式化代码。但最终，这三个答案都是一样的。就我个人而言，我更喜欢使用命名函数，这样，如果您添加了另一个EventHandler，就不需要复制任何代码，只需重复使用相同的innerCallback即可

编辑2：要显示如何展开
innerCallback
函数，请参见下文

典型的方法不是修改函数，而是创建该函数的唯一实例，例如：

class TableColumn {

    column = document.createElement('th');
    clickState = false;

    constructor(callback, params) {
        let innerCallback = (params) => callback(params);

        this.column.textContent = 'sort ascending / descending';
        this.column.addEventListener('click', innerCallback);
    }

}

编辑：发布的其他两个答案在功能上与此基本相同，这取决于您喜欢如何格式化代码。但最终，这三个答案都是一样的。就我个人而言，我更喜欢使用命名函数，这样，如果您添加了另一个EventHandler，就不需要复制任何代码，只需重复使用相同的innerCallback即可

编辑2：要显示如何展开
innerCallback
函数，请参见下文

您可以包装回调函数并将其传递到“addEventListener”函数中

class TableColumn {

    column = document.createElement('th');
    clickState = false;

    constructor(callback) {
        this.column.textContent = 'sort ascending / descending';
        this.column.addEventListener('click', (...args) => {
            // your code here
            callback(...args);
        });
    }

}

您可以包装回调函数并将其传递到“addEventListener”函数中

class TableColumn {

    column = document.createElement('th');
    clickState = false;

    constructor(callback) {
        this.column.textContent = 'sort ascending / descending';
        this.column.addEventListener('click', (...args) => {
            // your code here
            callback(...args);
        });
    }

}

是的，但它不会改变任何东西。我仍然无法更改该类的
clickState
prop。在这个回调函数中，您可以像使用其他两个答案一样展开innerCallback。例如，have
letinnerCallback=（params）=>{/*dostuff here*/callback（params）；}
在功能上是相同的。刚刚命名。编辑了演示眼的答案，但在编辑你的答案之前，就像你创建了带有参数的arrow函数，这些参数被发送到这个类，然后你使用callback prop received也作为参数，并将这个参数发送到这个回调，这个回调没有修改这个回调，所以如果你检查我最近的问题，它不是我问题的答案编辑，我已经详细阐述了。在功能上，这与公认的答案完全相同。唯一的区别是我的答案使用一个命名函数，而接受的答案使用一个匿名函数。ye但它不会改变任何东西。我仍然无法更改该回调函数中该类的
clickState
prop。您可以使用与其他两个答案相同的方式展开innerCallback。例如，have
letinnerCallback=（params）=>{/*dostuff here*/callback（params）；}
在功能上是相同的。刚刚命名。编辑了演示眼的答案，但在编辑你的答案之前，就像你创建了带有参数的arrow函数，这些参数被发送到这个类，然后你使用callback prop received也作为参数，并将这个参数发送到这个回调，这个回调没有修改这个回调，所以如果你检查我最近的问题，它不是我问题的答案编辑，我已经详细阐述了。在功能上，这与公认的答案完全相同。唯一的区别是我的答案使用命名函数，而接受的答案使用匿名函数。