Analysis of Javascript closures and functions, and javascript curialization

Analysis of Javascript closures and functions, and javascript curialization

Closures and curialization are common and advanced techniques used by JavaScript. All functional programming languages support these two concepts. Therefore, we want to give full play to the functional programming features in JavaScript, we need to have a deep understanding of these two concepts. Closure is actually an indispensable foundation for colitization.

I. Ke Lihua's concept

In computer science, colialization converts a function that accepts multiple parameters into a function that accepts a single parameter (the first parameter of the original function, and return the technology of the new function that accepts the remaining parameters and returns the result. This technique was named by Christopher Strachey as the logologist Haskell Curry, though it was invented by Moses Schnfinkel and Gottlob Frege. Intuitively, curialization claims that "if you fix some parameters, you will get a function that accepts the remaining Parameters ". Therefore, if y = 2 is fixed for the yx function with two variables, a variable's function 2x is obtained.

Curialization is to pass in some parameters of a function in advance to obtain a simple function. But the pre-passed parameters are stored in the closure, so there are some special features. For example:

var adder = function(num){  return function(y){     return num + y;  }}var inc = adder(1);var dec = adder(-1)

The inc/dec variables here are actually two new functions that can be called through brackets. For example, the usage in the following example:

// Inc, dec is now two new functions, the function is to pass in the parameter value (+/-) 1 print (inc (99 )); // 100 print (dec (101); // 100 print (adder (100) (2); // 102 print (adder (2) (100 )); // 102

Ii. Applications of Keri

Based on the features of Keri, we can write more interesting Code. For example, we often encounter this situation in front-end development. After a request is returned from the server, we need to update some specific page elements, that is, the concept of partial refresh. Partial refresh is very simple, but the code is easy to write. If you use Keri, You can beautify your code to make it easier to maintain. Let's look at an example:

// Update returns a function. This function can be used to set the content of the web element whose id attribute is item. function update (item) {return function (text) {$ ("div #" incluitem}.html (text) ;}// Ajax request. when the request is successful, call the callbackfunction refresh (url, callback) {var params = {type: "echo", data: ""}; $. ajax ({type: "post", url: url, cache: false, async: true, dataType: "json", data: params, // when the asynchronous request is successful, call success: function (data, status) {callback (data) ;}, // call error: function (err) When an error occurs in the request ) {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 colialization. It returns a function called 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, callback is passed into the data information returned by the server to refresh the newsPanel panel. Refresh other article panel articlePanel and image panel picturePanel adopts this method. In this way, the code is readable, maintainability has been improved.

The above is all about the content of this article. For more information about the JavaScript syntax, see: JavaScript reference tutorial and JavaScript code style guide. I also hope you can provide more support.