Javascript覆盖方法并保持不变？答案

【问题标题】：Javascript overwrite method and keep same this?Javascript覆盖方法并保持不变？
【发布时间】：2017-08-13 03:14:16
【问题描述】：

我想重写一个函数，它是一个对象原型的方法。此方法在内部使用this。如何覆盖该函数但仍将 this 定义为与原始函数中相同的对象/值？

我想保留它的原因如下：

原代码支持扩展。我宁愿编写一个扩展并将其添加到原始代码作者所期望的代码中，而不是更改原始代码并构建或安装修改后的版本。
在调用原始函数之前，我总是需要执行一些操作。所以我实际上想保留原始功能，但想在它之前添加一些东西。我认为这将是“装饰”函数，就像 Python 中的装饰器一样。
我覆盖函数的代码范围与最初定义的范围不同。

下面是一些示例代码：

//original functions
var original_execute_cells = Jupyter.Notebook.prototype.execute_cells;

// decorating functions
function decorated_execute_cells(cell_indices) {
    console.log('EXTENSION: running decorated execute_cells function');
    return original_execute_cells(cell_indices);
}

// overwrite original functions
Jupyter.Notebook.prototype.execute_cells = decorated_execute_cells;

但是，当我这样做时，我得到一个TypeError，告诉我在使用this 的原始函数的第一行中没有定义this。

我试图覆盖的函数的原始源代码可以在github找到：

Notebook.prototype.execute_cells = function (indices) {
    if (indices.length === 0) {
        return;
    }

    var cell;
    for (var i = 0; i < indices.length; i++) {
        cell = this.get_cell(indices[i]);
        cell.execute();
    }

    this.select(indices[indices.length - 1]);
    this.command_mode();
    this.set_dirty(true);
};

【问题讨论】：

做original_execute_cells.call(this,cell_indices)
见：stackoverflow.com/questions/13441307/…

标签： javascript function decorator jupyter-notebook overwrite

【解决方案1】：

我现在用bind 做到了。 return 语句变为：

return original_execute_cells.bind(Jupyter.notebook)(cell_indices);

在我的具体情况下，Jupyter.notebook 是与this 相关的对象，当Notebook 对象被构建时。

但是，@siebetman 在评论中提到的内容也可以工作，在某些情况下甚至可能更灵活。此外，为了更好地理解 Javascript 的 this，siebetman 提供的链接似乎非常有用。

【讨论】：

【解决方案2】：

为什么不直接绑定this？

var original_execute_cells = Jupyter.Notebook.prototype.execute_cells;
Jupyter.Notebook.prototype.execute_cells = function(cell_indices) {
    console.log('EXTENSION: running decorated execute_cells function');
    return original_execute_cells.bind(this)(cell_indices);
};

【讨论】：