0

我有一批类似于下面代码的 Web 音频 API 节点。我想将其抽象为一个简单的构造函数，但我遇到了麻烦。我不确定我做错了什么。最终结果应该类似于

function filterTemplate(name,freqVal){
     this.name = context.createBiquadFilter();
     this.name.type = 5;    
     this.name.gain.value = null;    
     this.name.Q.value = 1;                  
     this.name.frequency.value = this.freqVal;      // freqVal is here

}

当我调用函数时：

var filter = new filterTemplate("theName",200);  //Uncaught TypeError: Cannot call method 'createBiquadFilter' of undefined

我将方法更改为如下所示，错误已删除

this.name = function(){return context.createBiquadFilter()};

但后来我得到了各种属性值的另一个错误

//Uncaught TypeError: Cannot set property 'value' of undefined

对于使用内置浏览器方法和属性创建普通构造函数的正确方法，我真的很困惑。

我想将下面的代码抽象为类似于上面的代码

filter1 = context.createBiquadFilter();
filter1.type = 5;    
filter1.gain.value = null;    
filter1.Q.value = 1;                  
filter1.frequency.value = 80;              // Changes

filter2 = context.createBiquadFilter();
filter2.type = 5;    
filter2.gain.value = 0;    
filter2.Q.value = 1;                  
filter2.frequency.value = 240;            // Changes

filter3 = context.createBiquadFilter();
filter3.type = 5;    
filter3.gain.value = 0;    
filter3.Q.value = 1;                  
filter3.frequency.value = 750;            // Changes

filter4 = context.createBiquadFilter();
filter4.type = 5;    
filter4.gain.value = 0;    
filter4.Q.value = 1;                  
filter4.frequency.value = 2200;            // Changes

filter5 = context.createBiquadFilter();
filter5.type = 5;    
filter5.gain.value = 0;    
filter5.Q.value = 1;                  
filter5.frequency.value = 6000;           // Changes
4

2 回答 2

1

构建器模式非常适合这种情况。特别是当您可以设置很多属性时。

http://jsfiddle.net/yw8Fm/

您可以像这样创建一个简单的FilterTemplate类。

function FilterTemplate(builder) {
    this.context = builder._context;
    this.context.type = builder._type;    
    this.context.gain.value = builder._gainValue;    
    this.context.Q.value = builder._qValue;                  
    this.context.frequency.value = builder._frequencyValue;
}

它将构建器对象作为构造函数参数。这里是Builder.

FilterTemplate.Builder = function () {
    this._context = context.createBiquadFilter();
    this._type = 5;    
    this._gainValue = null;    
    this._qValue = 1;                  
    this._frequencyValue = 80;

    this.context = function (val) { 
        this._context = val; return this; 
    };

    this.type = function (val) { 
        this._type = val; return this; 
    };

    this.gainValue = function (val) { 
        this._gainValue = val; return this; 
    };

    this.qValue = function (val) { 
        this._qValue = val; return this; 
    };

    this.frequencyValue = function (val) { 
        this._frequencyValue = val; return this; 
    };
};

您可以根据需要进一步扩展此示例。现在您可以FilterTemplates轻松创建。

var filter1 = new FilterTemplate(
    (new FilterTemplate.Builder()).frequencyValue(80)
);

var filter2 = new FilterTemplate(
    (new FilterTemplate.Builder()).frequencyValue(80).qValue(2)
);
于 2013-03-09T09:38:05.877 回答
0

您的问题在于上下文变量的范围。

var filter = new filterTemplate("theName",200);  //Uncaught TypeError: Cannot call method 'createBiquadFilter' of undefined

...意味着上下文变量在您尝试访问它的位置（在 filterTemplate 构造函数中）不可用。当你这样做...

this.name = function(){return context.createBiquadFilter()};

...您将函数分配给 this.name ，并且在函数运行之前它不会尝试访问上下文，因此错误被删除。相反，您在 this.name 中没有过滤器，而是一个函数，而一个函数没有 gain 属性，因此当您尝试设置 this.name.gain.value 时会出现错误.

您应该寻找的是定义上下文的位置，并确保可以从 filterTemplate 中访问该变量。

于 2013-03-09T09:19:40.650 回答