javascript - scriptProcessorNode.onaudioprocess 无法访问全局变量

Question

我正在围绕 scriptProcessorNode 振荡器构建类。我已将 onaudioprocess 事件处理程序包装在函数 Gendy.prototype.process 中。我可以从此包装函数中访问全局变量和函数，但无法从 onaudioprocess 函数中访问它们。

我为这些属性设计了一种解决方法，在包装函数中重新定义它们，但是当尝试使用 this.walk() 调用另一个方法(随机游走方法)时，这不起作用。

这是我的代码:

Gendy.prototype.process = function(){
    var point = 0;
    var index = 0;
    var y = 0;
    var breakpoint = this.breakpoint;
    var freq = this.freq;

    var walk = this.walk();

    this.scriptNode.onaudioprocess = function(audioProcessingEvent){

        var outputBuffer = audioProcessingEvent.outputBuffer;
        var outputData = outputBuffer.getChannelData(0);

        for(var j = 0; j < outputData.length;j++){
            // linearly interpolate between the new breakpoint positions
            // get the interp point by comparing index to the x distance
            var lerp = (index - breakpoint[point].x) / (breakpoint[point+1].x - breakpoint[point].x);

            y = lerp * (breakpoint[point+1].y - breakpoint[point].y) + breakpoint[point].y;
            if(point < breakpoint.length && index >= breakpoint[point+1].x) {
                point++;
            }

            outputData[j] = y;
            index+=freq; 
            if(index >= breakpoint[breakpoint.length-1].x){
                index = 0;
                point = 0;
                walk(); 
            }  
        }
    }

}

这会发出声音，但返回错误:

Uncaught TypeError: walk is not a function

几行然后

Uncaught TypeError: undefined is not a function

永远。

这是 scriptProcessorNode 的错误吗？任何见解将不胜感激!

Answer 1

scriptProcessorNode 中没有错误，问题在于以下行:

this.scriptNode.onaudioprocess = function(audioProcessingEvent){

this onaudioprocess 内的变量将指this.scriptNode默认情况下为对象，您可以通过以下两种方式之一处理它:

• 使用bind (正如您在回答中所做的那样):

  this.scriptNode.onaudioprocess = function(audioProcessingEvent){
      ...
  }.bind(this)
  

• 使用局部变量来保存 this 的值，并使用该局部变量代替 this :

  var self = this;
  this.scriptNode.onaudioprocess = function(audioProcessingEvent){
      ...