JS函数克里化

简介: JS函数克里化

函数克里化,是指 多个参数 的函数转换成只接受 单一参数 的函数,且返回计算完成后的结果。

下面我们举个例子,

// 普通函数
function add(x, y) {
    return x + y
}

// 递归函数
function curryingAdd(x) {
    return function (y) {
        return x + y
    }
}

add(1, 2)           // 3
curryingAdd(1)(2)   // 3,

无论是add()函数还是curryingAdd()函数,这都是特定的传参格式。

// 普通函数
function add(x, y, z) {
    return x + y + z
}

// 递归函数(注意)
function curryingAdd(x) {
    return function (y) {
        return function (z) {
            return x + y + z
        }
    }
}

add(1, 2, 3)           // 3
curryingAdd(1)(2)(3)   // 3,

如果不单单只是1和2,而是更多,总不能一个个加下去或者一次次递归下去。

而克里化就是将这种类似多个参数的函数转换成只接受一个单一参数的函数。

实现思想

1、实现add(1)(2)(3)

function add(x) {
    var currying = function (y) {
        x = x + y;
        console.log('x', x)
        return currying;
    };
    currying.toString = function () {
        return x;
    };
    return currying;
}
add(1)(2)(3)                // 6

采用递归进行计算,利用toString隐式转换的特性,当最后执行时进行隐式转换。

2、实现add(1, 2, 3)与add(1, 2)(3)

function add() {
    var args = Array.prototype.slice.call(arguments);
    var currying = function() {
        args.push(...arguments);
        return currying;
    };
    currying.toString = function () {
        return args.reduce(function (a, b) {
            return a + b;
        });
    }
    return currying;
}
add(1)(2)(3)                // 6
add(1, 2)(3)(4)             // 10
const ret = add(1)(2)(3)(4)(5)          // 15
console.log(ret.toString());

声明函数,使用闭包特性定义一个数组,来缓存所有的参数;

多次()只是在重复调用闭包函数,当所有的()执行完后;

此时开始进行隐式转换(利用toString隐式转换的特性);

最后将计算值返回出来。

目录
相关文章
|
2天前
|
前端开发 JavaScript 数据处理
在JavaScript中,异步函数是指什么
【5月更文挑战第9天】JavaScript中的异步函数用于处理非立即完成的操作,如定时器、网络请求等。它们可通过回调函数、Promise或async/await来实现。示例展示了如何使用async/await模拟网络请求:定义异步函数fetchData返回Promise,在另一异步函数processData中使用await等待结果并处理。当fetchData的Promise解析时,data变量接收结果并继续执行后续代码。注意,调用异步函数不会阻塞执行,而是会在适当时间点继续。
8 0
|
2天前
|
自然语言处理 JavaScript 前端开发
在JavaScript中,this关键字的行为可能会因函数的调用方式而异
【5月更文挑战第9天】JavaScript中的`this`关键字行为取决于函数调用方式。在非严格模式下,直接调用函数时`this`指全局对象,严格模式下为`undefined`。作为对象方法调用时,`this`指向该对象。用`new`调用构造函数时,`this`指向新实例。通过`call`、`apply`、`bind`可手动设置`this`值。在回调和事件处理中,`this`可能不直观,箭头函数和绑定方法可帮助管理`this`的行为。
8 1
|
2天前
|
JavaScript 前端开发 网络架构
JavaScript中的箭头函数是一种新的函数表达形式
【5月更文挑战第9天】JavaScript的箭头函数以简洁语法简化函数定义,其特性包括:1) 不绑定自身this,继承上下文的this,适合回调和事件处理;2) 没有arguments对象,需用剩余参数语法访问参数;3) 不能用作构造函数,无new调用;4) 没有prototype属性,不支持基于原型的继承。箭头函数在特定场景下优化了this处理,但使用时要注意与普通函数的差异。
6 2
|
5天前
|
JavaScript 前端开发
js的一些内置函数
js的一些内置函数
7 1
|
5天前
|
JavaScript 前端开发 索引
js的includes函数
js的includes函数
10 1
|
5天前
|
JavaScript 安全 前端开发
js的map函数
js的map函数
7 0
|
5天前
|
JavaScript 前端开发
js的filter函数
js的filter函数
8 1
|
5天前
|
JavaScript 前端开发
js的函数
js的函数
6 0
|
5天前
|
JavaScript 前端开发
js的join函数
js的join函数
7 1
|
5天前
|
JavaScript 前端开发
js的check函数
js的check函数
9 1