如何在函数链中有条件地调用函数

How can I call functions conditionally in function chaining?

本文关键字：函数 有条件 调用      更新时间：2023-09-26

我不知道它叫什么，但是在我使用的画布库中，您可以通过调用将过滤器应用于纹理

canvas.draw(texture).filter1().filter2().filter3().filter4();

而且如果值不是默认值，我尝试只绘制某些过滤器，但我无法使用常规 if 语句来执行此操作，因为纹理只能设置一次，如果我尝试再次设置它，以前的过滤器将被重置。

我

想知道的是我是否可以以某种方式将"if"语句添加到过滤器的"火车"中，如下所示：

canvas.draw(texture).if(something){filter1()}.if(somethingelse){filter2()}.if(something){filter3()};

等等。

对不起，如果我不是很清楚，我不知道过滤器"火车"叫什么，你在一行上相互应用过滤器。

您在

问题中显示的结构称为函数链。函数filter1 ， filter2 ， ... filterN只会修改相同的画布对象，并在函数末尾返回相同的对象。

你可以很好地包括if条件，比如这样

var canvasObject = canvas.draw(texture);
if (condition1) {
    canvasObject = canvasObject.filter1();
}
if (condition2) {
    canvasObject = canvasObject.filter2();
}
...

一个简单的例子，看起来像这样

function Canvas() {
    actualCanvas = "";
    return {
        filter1: function() {
            actualCanvas += "filter1 ";
            return this;               // return the same object
        },
        filter2: function() {
            actualCanvas += "filter2 ";
            return this;               // return the same object
        },
        filter3: function() {
            actualCanvas += "filter3 ";
            return this;               // return the same object
        },
        getActualCanvas: function() {
            return actualCanvas;
        }
    }
}

并调用函数，如下所示

var canvasObject = new Canvas();
if (1 === 1) {
    canvasObject = canvasObject.filter1();
}
if (1 !== 1) {
    canvasObject = canvasObject.filter2();
}
if (2 === 2) {
    canvasObject = canvasObject.filter3();
}
console.log(canvasObject.getActualCanvas());
// filter1 filter3 
console.log(new Canvas().filter1().filter2().filter3().getActualCanvas());
// filter1 filter2 filter3
相关文章：