Javascript partially applied function-优快云博客

本文介绍了如何使用部分应用函数创建新的函数，通过示例展示了如何将该技术应用于字符串分割及定时器延迟调用中，并探讨了部分应用在事件监听器上的尝试及其遇到的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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