Javascript 将参数传递给函数，并指定给变量

我正在尝试对我的一些代码进行去噪，为此，我使用以下函数：

private debounce(func, wait, immediate) {
    var timeout;
    return function () {
        var context = this, args = arguments;
        var later = function () {
            timeout = null;
            if (!immediate) func.apply(context, args);
        };
        var callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) func.apply(context, args);
    };
};

然后，为了使用它，我这样做：

var showDataOnMove = this.debounce(function (evt) {
     console.log('moving');
 }, 500, false);

当我在这段代码中调用它时，它的工作原理与预期一样：

this._map.on('pointermove', (evt) => {
    showDataOnMove();
});

然而，我意识到，我不知道如何将任何参数传递给我的去Bounce函数，当它附加到变量时（例如，我想将此evt传递给showDataOnMove（）），我尝试了不同的方法，例如：

var showDataOnMove = (evt) => this.debounce(function (evt) {
    console.log('moving');
    console.log(evt);
}, 500, false);

---

但效果不太好。如何将参数传递给此函数？

最简单的方法可能是创建闭包。您已经这样做了，但是随后重新声明捕获的变量，并因此中断它。这应该是什么样子的：

// Function in debounce has no argument
var showDataOnMove = evt => {
    this.debounce(() => {
        console.log('moving');
        console.log(evt);
    }, 500, false)(); // Call the function returned by debounce
};

---

赋值

showDataOnMove

的初始版本应该可以正常工作，下面是一个更好的类型示例，其中

debouce

返回与作为参数传入的函数类型相同的函数：

class DebounceExample
{
    private debounce<T extends (...args: any[]) => void>(func: T, wait: number, immediate: boolean): T
    {
        // Depending on environment (e.g. Node or browser) this should be typed differently
        var timeout: any;

        return function (this: any, ...args)
        {
            var context = this;
            var later = function ()
            {
                timeout = undefined;
                if (!immediate) func.apply(context, args);
            };
            var callNow = immediate && !timeout;
            clearTimeout(timeout);
            timeout = setTimeout(later, wait);

            if (callNow)
                func.apply(context, args);
        } as T;
    };

    constructor()
    {
        // Example usage
        var showDataOnMove = this.debounce(function (evt: number) {
            console.log(evt);
        }, 500, false);

        setTimeout(() => showDataOnMove(1));
        setTimeout(() => showDataOnMove(2));
        setTimeout(() => showDataOnMove(3));
    }
}

类去噪示例
{
private debounce void>（函数：T，等待：number，立即数：boolean）：T
{
//根据环境（例如节点或浏览器）的不同，应键入不同的内容
var超时：任意；
返回函数（此：任意，…参数）
{
var context=this；
var later=函数（）
{
超时=未定义；
如果（！immediate）函数应用（上下文，参数）；
};
var callNow=立即&&！超时；
clearTimeout（超时）；
超时=设置超时（稍后，等待）；
如果（立即呼叫）
函数应用（上下文，参数）；
}as-T；
};
构造函数（）
{
//示例用法
var showDataOnMove=this.debounce（函数（evt:number）{
控制台日志（evt）；
}，500，假）；
setTimeout（（）=>showDataOnMove（1））；
setTimeout（（）=>showDataOnMove（2））；
setTimeout（（）=>showDataOnMove（3））；
}
}

最简单的方法可能是创建一个闭包。您已经这样做了，但是随后重新声明捕获的变量，并因此中断它。这应该是什么样子的：

// Function in debounce has no argument
var showDataOnMove = evt => {
    this.debounce(() => {
        console.log('moving');
        console.log(evt);
    }, 500, false)(); // Call the function returned by debounce
};

---

赋值

showDataOnMove

的初始版本应该可以正常工作，下面是一个更好的类型示例，其中

debouce

返回与作为参数传入的函数类型相同的函数：

class DebounceExample
{
    private debounce<T extends (...args: any[]) => void>(func: T, wait: number, immediate: boolean): T
    {
        // Depending on environment (e.g. Node or browser) this should be typed differently
        var timeout: any;

        return function (this: any, ...args)
        {
            var context = this;
            var later = function ()
            {
                timeout = undefined;
                if (!immediate) func.apply(context, args);
            };
            var callNow = immediate && !timeout;
            clearTimeout(timeout);
            timeout = setTimeout(later, wait);

            if (callNow)
                func.apply(context, args);
        } as T;
    };

    constructor()
    {
        // Example usage
        var showDataOnMove = this.debounce(function (evt: number) {
            console.log(evt);
        }, 500, false);

        setTimeout(() => showDataOnMove(1));
        setTimeout(() => showDataOnMove(2));
        setTimeout(() => showDataOnMove(3));
    }
}

类去噪示例
{
private debounce void>（函数：T，等待：number，立即数：boolean）：T
{
//根据环境（例如节点或浏览器）的不同，应键入不同的内容
var超时：任意；
返回函数（此：任意，…参数）
{
var context=this；
var later=函数（）
{
超时=未定义；
如果（！immediate）函数应用（上下文，参数）；
};
var callNow=立即&&！超时；
clearTimeout（超时）；
超时=设置超时（稍后，等待）；
如果（立即呼叫）
函数应用（上下文，参数）；
}as-T；
};
构造函数（）
{
//示例用法
var showDataOnMove=this.debounce（函数（evt:number）{
控制台日志（evt）；
}，500，假）；
setTimeout（（）=>showDataOnMove（1））；
setTimeout（（）=>showDataOnMove（2））；
setTimeout（（）=>showDataOnMove（3））；
}
}

由于某些原因，它仍然不起作用。当我把我的‘showDataOnMove（某物）’称为这样做的时候，它根本不起作用。虽然我也认为闭包是一个soltuionRight，因为您的解Bounce返回一个函数。我更新了答案。啊，它很有魅力，谢谢！我犯了这样一个愚蠢的错误，我没有真正注意到debounce返回一个函数。@Aldres:这是意料之中的，因为你正在尝试做一件丢失所有类型信息的泛型操作（使用

参数等）。@Aldres：（添加了一个如何更好地键入
debounce
函数的示例）由于某些原因，它仍然不起作用。当我把我的‘showDataOnMove（某物）’称为这样做的时候，它根本不起作用。虽然我也认为闭包是一个soltuionRight，因为您的解Bounce返回一个函数。我更新了答案。啊，它很有魅力，谢谢！我犯了这样一个愚蠢的错误，我没有真正注意到debounce返回一个函数。@Aldres:这是意料之中的，因为你正在尝试做一件丢失所有类型信息的泛型操作（使用
参数等）。@Aldres：（添加了一个如何更好地键入
debounce
函数的示例）