Artikel ini membawa anda pengetahuan yang berkaitan tentang javascript, yang terutamanya memperkenalkan isu yang berkaitan dengan fungsi kari dalam JavaScript ialah transformasi fungsi yang menerima berbilang parameter dan mengembalikan fungsi baharu yang menerima parameter yang tinggal dan mengembalikan hasilnya. Saya harap ia akan membantu semua orang.
Cadangan berkaitan: tutorial javascript
apply(context,[arguments]),call(context,param1,param2,...). Kari adalah untuk mengubah fungsi yang menerima berbilang parameter kepada fungsi yang menerima satu parameter (parameter pertama fungsi asal), dan mengembalikan fungsi baharu yang menerima parameter yang tinggal dan mengembalikan teknologi .
Sebagai contoh di sini, terdapat fungsi add(), iaitu fungsi yang digunakan untuk memproses penambahan dan jumlah parameter (param1, params2,...) yang kami hantar kepadanya.
// 在这里第一个具有两个参数`x`、`y`的`add(x , y)`函数
function add(x , y){
return x + y;
}
// 调用`add()`函数，并给定两个参数`4`和`6`
add(4,6);
// 模拟计算机操作，第一步 传入第一个参数 4
function add(4 , y){
return 4 + y;
}
// 模拟计算机操作，第二步 传入第一个参数 6
function add(4 , 6){
return 4 + 6;
}Apakah yang akan kelihatan jika kita menggunakan fungsi add()? Berikut ialah pelaksanaan ringkas:
// 柯里化过的add()函数，可以接受部分参数
function add(x ,y){
if (typeof y === 'undefined') {
return function (newy){
return x + newy;
}
}
// 完整应用
return x + y;
}
// 测试调用
console.log(typeof add(4)); // [Function]
console.log(add(4)(6)); // 10
// 可以创建保存函数
let saveAdd = add(4);
console.log(saveAdd(6)); // 10Seperti yang dapat dilihat daripada fungsi kari ringkas add() di atas, fungsi tersebut boleh menerima sebahagian daripada fungsi dan kemudian mengembalikan fungsi baharu untuk meneruskan pemprosesan fungsi yang lain .
Di sini kami mencipta fungsi kari awam, supaya kami tidak perlu melaksanakan fungsi yang kompleks di dalamnya setiap kali Proses kari.
// 定义一个createCurry的函数function createCurry(fn){
var slice = Array.prototype.slice,
stored_args = slice.call(arguments,1);
return function () {
let new_args = slice.call(arguments),
args = stored_args.concat(new_args);
return fn.apply(null,args);
}}Dalam fungsi karipap awam di atas:
arguments, bukan tatasusunan sebenar, hanya objek dengan atribut length, jadi Kami meminjam Array.prototype kaedah daripada slice untuk membantu kami menukar arguments kepada tatasusunan sebenar untuk memudahkan operasi kami yang lebih baik. createCurry buat kali pertama, pembolehubah stored_args memegang parameter kecuali parameter pertama, kerana parameter pertama ialah fungsi yang perlu kita kari. createCurry, pembolehubah new_args mendapat parameter dan menukarnya kepada tatasusunan. Fungsi yang dikembalikan di dalam stored_args melalui penutupan dan menggabungkan nilai pembolehubah new_args ke dalam tatasusunan baharu dan memberikannya kepada pembolehubah args. fn.apply(null,args) untuk melaksanakan fungsi kari. Sekarang mari kita uji fungsi karipap awam
// 普通函数add()
function add(x , y){
return x + y;
}
// 柯里化得到一个新的函数
var newAdd = createCurry(add,4);
console.log(newAdd(6)); // 10
//另一种简便方式
console.log(createCurry(add,4)(6));// 10Sudah tentu, ini tidak terhad kepada kari dua parameter, ia juga boleh menjadi Berbilang parameter :
// 多个参数的普通函数
function add(a,b,c,d){
return a + b + c + d;
}
// 柯里化函数得到新函数，多个参数可以随意分割
console.log(createCurry(add,4,5)(5,6)); // 20
// 两步柯里化
let add_one = createCurry(add,5);
console.log(add_one(5,5,5));// 20
let add_two = createCurry(add_one,4,6);
console.log(add_two(6)); // 21Melalui contoh di atas, kita boleh mencari had, iaitu, sama ada dua parameter atau berbilang parameter, ia hanya boleh dilaksanakan dalam dua langkah, seperti yang ditunjukkan dalam formula berikut:
Jika kita mahu menjadi lebih fleksibel:
Bagaimana kita melaksanakannya?
Selepas latihan di atas, kami mendapati bahawa fungsi kari yang kami cipta mempunyai had tertentu Kami berharap fungsi itu boleh dilaksanakan dalam beberapa langkah:
// 创建一个可以多步执行的柯里化函数，当参数满足数量时就去执行它：
// 函数公式：fn(x,y,z,w) ==> fn(x)(y)(z)(w);
let createCurry = (fn,...params)=> {
let args = parsms || [];
let fnLen = fn.length; // 指定柯里化函数的参数长度
return (...res)=> {
// 通过作用域链获取上一次的所有参数
let allArgs = args.slice(0);
// 深度拷贝闭包共用的args参数，避免后续操作影响（引用类型）
allArgs.push(...res);
if(allArgs.length < fnLen){
// 当参数数量小于原函数的参数长度时，递归调用createCurry函数
return createCurry.call(this,fn,...allArgs);
}else{
// 当参数数量满足时，触发函数执行
return fn.apply(this,allArgs);
}
}
}
// 多个参数的普通函数
function add(a,b,c,d){
return a + b + c + d;
}
// 测试柯里化函数
let curryAdd = createCurry(add,1);
console.log(curryAdd(2)(3)(4)); // 10Kami telah melaksanakan fungsi kari yang fleksibel di atas, tetapi di sini kami dapati satu lagi masalah:
curryAdd(add,1,2,3,4)();add() asal . Ini juga merupakan satu cara; tetapi kerana kami berada di sini untuk memenuhi bilangan parameter, kami masih menangani situasi ini. Di sini kita hanya perlu membuat pertimbangan sebelum mengembalikan fungsi:
let createCurry = (fn,...params)=> {
let args = parsms || [];
let fnLen = fn.length; // 指定柯里化函数的参数长度
if(length === _args.length){
// 加入判断，如果第一次参数数量以经足够时就直接调用函数获取结果
return fn.apply(this,args);
}
return (...res)=> {
let allArgs = args.slice(0);
allArgs.push(...res);
if(allArgs.length < fnLen){
return createCurry.call(this,fn,...allArgs);
}else{
return fn.apply(this,allArgs);
}
}}Di atas boleh dianggap sebagai melengkapkan fungsi kari yang fleksibel, tetapi di sini Ia tidak begitu fleksibel, kerana kita tidak boleh mengawal apabila ia dilaksanakan, ia akan dilaksanakan secara automatik selagi bilangan parameter mencukupi. Apakah yang perlu kita lakukan jika kita ingin melaksanakan pemasaan yang boleh mengawal pelaksanaannya?
Mari jelaskan formula fungsi secara langsung di sini:
// 当参数满足，再次执行时调用函数
let createCurry = (fn,...params)=> {
let args = parsms || [];
let fnLen = fn.length; // 指定柯里化函数的参数长度
//当然这里的判断需要注释掉，不然当它第一次参数数量足够时就直接执行结果了
//if(length === _args.length){
// 加入判断，如果第一次参数数量以经足够时就直接调用函数获取结果
//return fn.apply(this,args);
//}
return (...res)=> {
let allArgs = args.slice(0);
allArgs.push(...res);
// 在这里判断输入的参数是否大于0，如果大于0在判断参数数量是否足够，
// 这里不能用 && ，如果用&& 也是参数数量足够时就执行结果了。
if(res.length > 0 || allArgs.length < fnLen){
return createCurry.call(this,fn,...allArgs);
}else{
return fn.apply(this,allArgs);
}
}
}
// 多个参数的普通函数
function add(a,b,c,d){
return a + b + c + d;
}
// 测试可控制的柯里化函数
let curryAdd = createCurry(add,1);
console.log(curryAdd(2)(3)(4)); // function
console.log(curryAdd(2)(3)(4)()); // 10
console.log(curryAdd(2)(3)()); // 当参数不足够时返回 NaN相关推荐：javascript学习教程
Atas ialah kandungan terperinci Mari kita bincangkan tentang fungsi JavaScript kari. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
![Analisis mendalam JavaScript [Web front-end mesti tahu kemahiran asas]](https://img.php.cn/upload/course/000/000/041/61d3ff1c83b43350.jpg)
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
