Javascript partially applied function

 

partially applying a function returns a new function which you can call. Which could be very useful in a lots of situations.

 

 

Below is an exapmle that uses the partially applied functions, the code is as below.

 

 

          String.prototype.csv = String.prototype.split.partial(/,\s*/);
          var results = ("John, Resig, Boston").csv();
          assert(results[1] == "Resig", "The text value were split properly");
 

 

 

Below is the content of a js file called partials.js file. 

 

 

/**
*@Summary: this function allow curry some functions further
*/
Function.prototype.curry = function () {

var fn = this, args = Array.prototype.slice.call(arguments);

return function () {
return fn.apply(this, args.concat(Array.prototype.slice.call(arguments)));
};
};

/**
* @Summary: 

e.g.

String.prototype.csv = String.prototype.split.partial(/,\s* /);
// or you can do with the following, by specifying the undefine explicitly
String.prototype.csv = String.prototype.split.partial(/,\s* /, undefined);

var results = ("John, Resig, Boston").csv();
assert(results[1] == "Resig", "The text values were split properly");


*/
Function.prototype.partial = function () {
  var fn = this, args = Array.prototype.slice.call(arguments);
  //  alert("length of arguments = " + args.length);



  return function () {
    var arg = 0;
    for (var i = 0; i < args.length && arg < arguments.length; i++) {
      if (args[i] == undefined)
        args[i] = arguments[arg++];
    }


    return fn.apply(this, args);
    //    return fn.apply(document.getElementById("bindbtn"), args);
  };
};
 

 

 

 

 

 

 

 

the code above has impl of partial function on the Function.prototype object.

 

And you have many application situation that you can apply the paritally applied functions. For one, you can have a partial time out function .

 

 

 

 

                var delay = setTimeout.partial(undefined, 1000);

                test("delayed partial function", function () {
                  delay(function () {
                    assert(true, "A call to this function will be temporarily delayed.");
                  });
                });
 

 

 

 

 

 

 

Below is the content of the test file that test the functions of the partials.

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type ="text/javascript" src="partials.js"></script>
    <script type="text/javascript" src="../unit.js"></script>
    <script type="text/javascript">
      window.onload = function () {
        test("partials", function () {
          String.prototype.csv = String.prototype.split.partial(/,\s*/);
          // you can do with the line below as well.
          //        String.prototype.csv = String.prototype.split.partial(/,\s*/);
          var results = ("John, Resig, Boston").csv();
          assert(results[1] == "Resig", "The text value were split properly");
        });

                var delay = setTimeout.partial(undefined, 1000);

                test("delayed partial function", function () {
                  delay(function () {
                    assert(true, "A call to this function will be temporarily delayed.");
                  });
                });

        // there is a bug in that addEventListener is not  an object or is null;
        //  the object that is bound to this is as follow.
        //    'this = [object DOMWindow]'
//        var bindclick = document.getElementById("bindbtn").addEventListener.partial("click", undefined, false);
//        test("curry bind function", function () {
//          bindclick(function() { 
//             assert(true, "Click event bound via curried function.");
//                 });
//        });
      };
    </script>

    <style type="text/css" >
      #results li.pass { color: Green }
      #results li.fail { color: Red }
    </style>

</head>
<body>
<ul id="results" />
<input type="button" id="bindbtn" value="click me" />
</body>
</html>
 

 

 

 

 

 

However, from the Javascript  ninja, there it allege that you can do the partial on the addEventListener, well, according to my test, it does not work . 

 

the reason is (as stated in the comment, addEventListener is not a function? if you add something like alert('this = ' + this) in the partial function, you will find that it print out something like 

 

 

 

 'this = [object DOMWindow]'
 

 

 

 

 

 

你可能感兴趣的:(JavaScript)