Closures and Curry are common and relatively advanced techniques used in JavaScript. All functional programming languages support these two concepts. Therefore, if we want to fully utilize the functional programming characteristics in JavaScript, we need to have an in-depth understanding of these two concepts. Closures are actually an indispensable foundation for Currying.
1. The concept of currying
In computer science, Curry is a technique of transforming a function that accepts multiple parameters into a function that accepts a single parameter (the first parameter of the original function) and returning a new function that accepts the remaining parameters and returns the result. The technology was named after the logician Haskell Curry by Christopher Strachey, although it was invented by Moses Schnfinkel and Gottlob Frege. Intuitively, Curry claims that "if you fix certain parameters, you will get a function that accepts the remaining parameters". So for a function yx with two variables, if y = 2 is fixed, a function 2x with one variable is obtained.
Currying means passing certain parameters of the function in advance to obtain a simple function. But pre-passed parameters are saved in the closure, so there are some peculiar features. for example:
var adder = function(num){ return function(y){ return num + y; }}var inc = adder(1);var dec = adder(-1)The two variables inc/dec here are actually two new functions, which can be called in parentheses, such as the usage in the following example:
//inc, dec is now two new functions, which is used to transfer the incoming parameter value (+/-)1print(inc(99));//100print(dec(101));//100print(adder(100)(2));//102print(adder(2)(100));//102
2. Application of Curry
According to the Currying feature, we can write more interesting code. For example, in front-end development, we often encounter this situation. When the request returns from the server, we need to update some specific page elements, that is, the concept of partial refresh. Using local refresh is very simple, but the code is easy to write into a mess. And if currying is used, it can greatly beautify our code and make it easier to maintain. Let's take a look at an example:
//Update will return a function, which can set the id attribute to the content of the web element of the item function update(item){ return function(text){ $("div#"+item).html(text); }}//Ajax request, when successful, call parameter callbackfunction refresh(url, callback){ var params = { type : "echo", data : "" }; $.ajax({ type:"post", url:url, cache:false, async:true, dataType:"json", data:params, //Call success: function(data, status){ callback(data); }, //Call error when an error occurs in the request: function(err){ alert("error : "+err); } });}refresh("action.do?target=news", update("newsPanel"));refresh("action.do?target=articles", update("articlePanel"));refresh("action.do?target=pictures", update("picturePanel")); where the update function is an instance of Curry, which will return a function, that is: update("newsPanel") = function(text){ $("div#newsPanel").html(text);}Since the return value of update("newsPanel") is a function and the required parameter is a string, in the Ajax call of refresh, when success, the data returned by the callback will be passed to the callback, thereby realizing the refresh of the newsPanel panel. The refresh of other article panel articlePanel and picture panel picturePanel are all adopted in this way. In this way, the readability and maintainability of the code are improved.
The above is the entire content of this article. For more information about JavaScript, you can check out: "JavaScript Reference Tutorial" and "JavaScript Code Style Guide". I also hope that everyone will support Wulin.com more.