directory
- Implementation of currization of functions
First, the realization of function Currization
Currization functions are a type of higher-order function that benefits mainly from reuse and delayed execution of arguments, but not as well in terms of performance. You create arrays of arguments, you create closures, and argements are slower to access than named arguments
Add (1)(2)(3) requires variable parameters, similar to add(1)(2, 3, 4)(5)(), which is ok, I implemented this is the middle can not pass the argument, the last one does not pass the argument, to distinguish between the last call and the cumulative result
1) a
// The parameters passed in each call are accumulated
function reduce (. args) {
return args.reduce((a, b) = > a + b)
}
function currying (fn) {
// Store the parameters of each call
let args = []
return function temp (. newArgs) {
if (newArgs.length) {
// If there are arguments, merge them and return itself
args = [ ...args, ...newArgs ]
return temp
} else {
// There are no arguments, that is, the last one, to perform the cumulative result operation and return the result
let val = fn.apply(this, args)
args = [] // Ensure that it is cleared when called again
return val
}
}
}
let add = currying(reduce)
console.log(add(1) (2.3.4) (5) ())/ / 15
console.log(add(1) (2.3) (4.5) ())/ / 15
Copy the code
1) implementation
function curry(fn){
if(fn.length <=1) {return fn}
var returnFn = (. args) = > {
//console.log(... args,typeof ... args);
if(fn.length === args.length){
// When all parameters are passed
returnfn(... args) }else{
// Return a function if the parameters are not complete
return (. args2) = > {
console.log(args2,"",args);
returnreturnFn(... args,... args2) } } }return returnFn
}
var add = (a,b,c,d) = > a+b+c+d;
/ / add packing
var returnFn = curry(add);
// Recursively pass arguments to the returnFn
var returnFnArrowFn = returnFn(1) (2) (3);
ReturnFn passes the arguments to the input function fn and calls fn
returnFnArrowFn(4);/ / 10
Copy the code
Second, the ajax
// This is the structure for calling the following function. This result should be familiar to you
myAjax({
type: "get".url: "https://xxx".data: { name: "MuHua".age:18 },
dataType: "json".async: true.success:function(data){
console.log(data);
},
error:function(){
alert('error'); }})// define a method that converts {name: "mu ", age:18} to name= mu &age=18
function fn(data){
let arr = []
for(let i in data){
arr.push( i+'='+data[i])
}
return arr.join('&')}// Here is the function that implements the above call and parameter passing
function myAjax(options){
let xhr = null
let str = fn(options.data)
/ / create the XHR
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest()
}else{
xhr = new ActiveXObject('Microsoft,XMLHTTP')}// Only get and POST are configured
if(options.type === 'get'&& options.data ! = =undefined) {// Create an HTTP request
xhr.open(options.type, options.url+'? '+str, options.async || true)
// Send the request
xhr.send(null)}else if(options.type === 'post'&& options.data ! = =undefined){
xhr.open(options.type, options.url, options.async || true)
// Set the request header
xhr.setRequestHeaders('Content-type'.'application/x-www-form-urlencoede')
xhr.send(str)
}else{
xhr.open(options.type, options.url, options.async || true)
xhr.send(null)}// Monitor status
xhr.onreadystatechange = function(){
if(xhr.readyState === 4 && xhr.status === 200) {let res = xhr.responseText
try{
if(options.success === undefined) {return xhr.responseText
}else if(typeof res === 'object'){
options.success(res)
}else if(options.dataType === 'json'){
options.success(JSON.parse(res))
}else{
throw new Error()}}catch(e){
if(options.error ! = =undefined){
options.error()
throw new Error()}else{
throw new Error()}}}}}Copy the code
reference
- 22 high frequency JavaScript handwritten code
- The realization of currization