動的なjavascriptオブジェクトを作成する

Question

私はFabric.jsを使用しています。画像については、image filterオプションをユーザーに提供したいと考えています。また、コードは、最初の行以外の繰り返しであるとほぼ同じである

var filter = new fabric.Image.filters.Grayscale(); 
    canvas.getActiveObject().filters=[]; 
    canvas.getActiveObject().applyFilters(_canvasObject.renderAll.bind(_canvasObject)); 
    canvas.getActiveObject().filters.push(filter); 
    canvas.getActiveObject().applyFilters(_canvasObject.renderAll.bind(_canvasObject)); 

他のフィルタの場合：

は以下新しいGayscaleフィルタを作成するためのコードです。

フィルタを選択するためのチェックボックスをユーザーに提供します。私はすべてcheckBoxesをループしていて、新しいフィルタを適用するにはevent listenerを追加しています。したがって、以下のコードでは、フィルタオブジェクトを動的に作成したいと考えています。

var filterClickHandler = function(selectedFilter){ 
    return function(){ 
     applySelectedFilter(selectedFilter); 
    } 
} 

function applySelectedFilter(selectedFilter){ 
//selectedFilter may be Grayscale,Sepia,etc... 
// var filter = new fabric.Image.filters.Grayscale(); 
var filter = new fabric.Image.filters.selectedFilter(); 
} 

とにかく？

Answer 1

fabricJSクラスは、まだプレーンなオブジェクトです。 あなたは単に次のようにすることができます：

function applySelectedFilter(selectedFilter){ 
var filter = new fabric.Image.filters[selectedFilter](); 
}