Add _.debounce maxWait doc example. [closes #298]

Former-commit-id: c9193ce30fa7c572594b80eeb0a068b73da0affa
2026-01-29 06:27:49 +00:00 · 2013-06-25 09:07:59 -07:00
parent 449c946423
commit 5720a7a5e3
5 changed files with 84 additions and 34 deletions
--- a/dist/lodash.compat.js
+++ b/dist/lodash.compat.js
@@ -4805,13 +4805,21 @@
     * @returns {Function} Returns the new debounced function.
     * @example
     *
-     * var lazyLayout = _.debounce(calculateLayout, 300);
+     * // avoid costly calculations while the window size is in flux
+     * var lazyLayout = _.debounce(calculateLayout, 150);
     * jQuery(window).on('resize', lazyLayout);
     *
-     * jQuery('#postbox').on('click', _.debounce(sendMail, 200, {
+     * // execute `sendMail` when the click event is fired, debouncing subsequent calls
+     * jQuery('#postbox').on('click', _.debounce(sendMail, 300, {
     *   'leading': true,
     *   'trailing': false
     * });
+     *
+     * // ensure `batchLog` is executed once after 1 second of debounced calls
+     * var source = new EventSource('/stream');
+     * source.addEventListener('message', _.debounce(batchLog, 250, {
+     *   'maxWait': 1000
+     * }, false);
     */
    function debounce(func, wait, options) {
      var args,
@@ -5083,9 +5091,11 @@
     * @returns {Function} Returns the new throttled function.
     * @example
     *
+     * // avoid excessively updating the position while scrolling
     * var throttled = _.throttle(updatePosition, 100);
     * jQuery(window).on('scroll', throttled);
     *
+     * // execute `renewToken` when the click event is fired, but not more than once every 5 minutes
     * jQuery('.interactive').on('click', _.throttle(renewToken, 300000, {
     *   'trailing': false
     * }));
--- a/dist/lodash.js
+++ b/dist/lodash.js
@@ -4467,13 +4467,21 @@
     * @returns {Function} Returns the new debounced function.
     * @example
     *
-     * var lazyLayout = _.debounce(calculateLayout, 300);
+     * // avoid costly calculations while the window size is in flux
+     * var lazyLayout = _.debounce(calculateLayout, 150);
     * jQuery(window).on('resize', lazyLayout);
     *
-     * jQuery('#postbox').on('click', _.debounce(sendMail, 200, {
+     * // execute `sendMail` when the click event is fired, debouncing subsequent calls
+     * jQuery('#postbox').on('click', _.debounce(sendMail, 300, {
     *   'leading': true,
     *   'trailing': false
     * });
+     *
+     * // ensure `batchLog` is executed once after 1 second of debounced calls
+     * var source = new EventSource('/stream');
+     * source.addEventListener('message', _.debounce(batchLog, 250, {
+     *   'maxWait': 1000
+     * }, false);
     */
    function debounce(func, wait, options) {
      var args,
@@ -4745,9 +4753,11 @@
     * @returns {Function} Returns the new throttled function.
     * @example
     *
+     * // avoid excessively updating the position while scrolling
     * var throttled = _.throttle(updatePosition, 100);
     * jQuery(window).on('scroll', throttled);
     *
+     * // execute `renewToken` when the click event is fired, but not more than once every 5 minutes
     * jQuery('.interactive').on('click', _.throttle(renewToken, 300000, {
     *   'trailing': false
     * }));
--- a/dist/lodash.underscore.js
+++ b/dist/lodash.underscore.js
@@ -3528,13 +3528,21 @@
   * @returns {Function} Returns the new debounced function.
   * @example
   *
-   * var lazyLayout = _.debounce(calculateLayout, 300);
+   * // avoid costly calculations while the window size is in flux
+   * var lazyLayout = _.debounce(calculateLayout, 150);
   * jQuery(window).on('resize', lazyLayout);
   *
-   * jQuery('#postbox').on('click', _.debounce(sendMail, 200, {
+   * // execute `sendMail` when the click event is fired, debouncing subsequent calls
+   * jQuery('#postbox').on('click', _.debounce(sendMail, 300, {
   *   'leading': true,
   *   'trailing': false
   * });
+   *
+   * // ensure `batchLog` is executed once after 1 second of debounced calls
+   * var source = new EventSource('/stream');
+   * source.addEventListener('message', _.debounce(batchLog, 250, {
+   *   'maxWait': 1000
+   * }, false);
   */
  function debounce(func, wait, immediate) {
    var args,
@@ -3713,9 +3721,11 @@
   * @returns {Function} Returns the new throttled function.
   * @example
   *
+   * // avoid excessively updating the position while scrolling
   * var throttled = _.throttle(updatePosition, 100);
   * jQuery(window).on('scroll', throttled);
   *
+   * // execute `renewToken` when the click event is fired, but not more than once every 5 minutes
   * jQuery('.interactive').on('click', _.throttle(renewToken, 300000, {
   *   'trailing': false
   * }));
--- a/doc/README.md
+++ b/doc/README.md
@@ -979,7 +979,7 @@ _.isArray(squares.value());
 <!-- div -->

 ### <a id="_tapvalue-interceptor"></a>`_.tap(value, interceptor)`
-<a href="#_tapvalue-interceptor">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5625 "View in source") [&#x24C9;][1]
+<a href="#_tapvalue-interceptor">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5635 "View in source") [&#x24C9;][1]

 Invokes `interceptor` with the `value` as the first argument, and then returns `value`. The purpose of this method is to "tap into" a method chain, in order to perform operations on intermediate results within the chain.

@@ -1009,7 +1009,7 @@ _([1, 2, 3, 4])
 <!-- div -->

 ### <a id="_prototypetostring"></a>`_.prototype.toString()`
-<a href="#_prototypetostring">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5642 "View in source") [&#x24C9;][1]
+<a href="#_prototypetostring">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5652 "View in source") [&#x24C9;][1]

 Produces the `toString` result of the wrapped value.

@@ -1030,7 +1030,7 @@ _([1, 2, 3]).toString();
 <!-- div -->

 ### <a id="_prototypevalueof"></a>`_.prototype.valueOf()`
-<a href="#_prototypevalueof">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5659 "View in source") [&#x24C9;][1]
+<a href="#_prototypevalueof">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5669 "View in source") [&#x24C9;][1]

 Extracts the wrapped value.

@@ -2083,7 +2083,7 @@ _.toLookup(stooges, 'name');
 <!-- div -->

 ### <a id="_debouncefunc-wait-options"></a>`_.debounce(func, wait, options)`
-<a href="#_debouncefunc-wait-options">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4835 "View in source") [&#x24C9;][1]
+<a href="#_debouncefunc-wait-options">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4843 "View in source") [&#x24C9;][1]

 Creates a function that will delay the execution of `func` until after `wait` milliseconds have elapsed since the last time it was invoked. Pass an `options` object to indicate that `func` should be invoked on the leading and/or trailing edge of the `wait` timeout. Subsequent calls to the debounced function will return the result of the last `func` call.

@@ -2099,13 +2099,21 @@ Note: If `leading` and `trailing` options are `true`, `func` will be called on t

 #### Example
 ```js
-var lazyLayout = _.debounce(calculateLayout, 300);
+// avoid costly calculations while the window size is in flux
+var lazyLayout = _.debounce(calculateLayout, 150);
 jQuery(window).on('resize', lazyLayout);

-jQuery('#postbox').on('click', _.debounce(sendMail, 200, {
+// execute `sendMail` when the click event is fired, debouncing subsequent calls
+jQuery('#postbox').on('click', _.debounce(sendMail, 300, {
  'leading': true,
  'trailing': false
 });
+
+// ensure `batchLog` is executed once after 1 second of debounced calls
+var source = new EventSource('/stream');
+source.addEventListener('message', _.debounce(batchLog, 250, {
+  'maxWait': 1000
+}, false);
 ```

 * * *
@@ -2116,7 +2124,7 @@ jQuery('#postbox').on('click', _.debounce(sendMail, 200, {
 <!-- div -->

 ### <a id="_deferfunc--arg1-arg2-"></a>`_.defer(func [, arg1, arg2, ...])`
-<a href="#_deferfunc--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4932 "View in source") [&#x24C9;][1]
+<a href="#_deferfunc--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4940 "View in source") [&#x24C9;][1]

 Defers executing the `func` function until the current call stack has cleared. Additional arguments will be passed to `func` when it is invoked.

@@ -2141,7 +2149,7 @@ _.defer(function() { alert('deferred'); });
 <!-- div -->

 ### <a id="_delayfunc-wait--arg1-arg2-"></a>`_.delay(func, wait [, arg1, arg2, ...])`
-<a href="#_delayfunc-wait--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4958 "View in source") [&#x24C9;][1]
+<a href="#_delayfunc-wait--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4966 "View in source") [&#x24C9;][1]

 Executes the `func` function after `wait` milliseconds. Additional arguments will be passed to `func` when it is invoked.

@@ -2168,7 +2176,7 @@ _.delay(log, 1000, 'logged later');
 <!-- div -->

 ### <a id="_memoizefunc--resolver"></a>`_.memoize(func [, resolver])`
-<a href="#_memoizefunc--resolver">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4983 "View in source") [&#x24C9;][1]
+<a href="#_memoizefunc--resolver">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L4991 "View in source") [&#x24C9;][1]

 Creates a function that memoizes the result of `func`. If `resolver` is passed, it will be used to determine the cache key for storing the result based on the arguments passed to the memoized function. By default, the first argument passed to the memoized function is used as the cache key. The `func` is executed with the `this` binding of the memoized function. The result cache is exposed as the `cache` property on the memoized function.

@@ -2194,7 +2202,7 @@ var fibonacci = _.memoize(function(n) {
 <!-- div -->

 ### <a id="_oncefunc"></a>`_.once(func)`
-<a href="#_oncefunc">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5013 "View in source") [&#x24C9;][1]
+<a href="#_oncefunc">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5021 "View in source") [&#x24C9;][1]

 Creates a function that is restricted to execute `func` once. Repeat calls to the function will return the value of the first call. The `func` is executed with the `this` binding of the created function.

@@ -2220,7 +2228,7 @@ initialize();
 <!-- div -->

 ### <a id="_partialfunc--arg1-arg2-"></a>`_.partial(func [, arg1, arg2, ...])`
-<a href="#_partialfunc--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5048 "View in source") [&#x24C9;][1]
+<a href="#_partialfunc--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5056 "View in source") [&#x24C9;][1]

 Creates a function that, when called, invokes `func` with any additional `partial` arguments prepended to those passed to the new function. This method is similar to `_.bind`, except it does **not** alter the `this` binding.

@@ -2247,7 +2255,7 @@ hi('moe');
 <!-- div -->

 ### <a id="_partialrightfunc--arg1-arg2-"></a>`_.partialRight(func [, arg1, arg2, ...])`
-<a href="#_partialrightfunc--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5079 "View in source") [&#x24C9;][1]
+<a href="#_partialrightfunc--arg1-arg2-">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5087 "View in source") [&#x24C9;][1]

 This method is similar to `_.partial`, except that `partial` arguments are appended to those passed to the new function.

@@ -2284,7 +2292,7 @@ options.imports
 <!-- div -->

 ### <a id="_throttlefunc-wait-options"></a>`_.throttle(func, wait, options)`
-<a href="#_throttlefunc-wait-options">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5112 "View in source") [&#x24C9;][1]
+<a href="#_throttlefunc-wait-options">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5122 "View in source") [&#x24C9;][1]

 Creates a function that, when executed, will only call the `func` function at most once per every `wait` milliseconds. Pass an `options` object to indicate that `func` should be invoked on the leading and/or trailing edge of the `wait` timeout. Subsequent calls to the throttled function will return the result of the last `func` call.

@@ -2300,9 +2308,11 @@ Note: If `leading` and `trailing` options are `true`, `func` will be called on t

 #### Example
 ```js
+// avoid excessively updating the position while scrolling
 var throttled = _.throttle(updatePosition, 100);
 jQuery(window).on('scroll', throttled);

+// execute `renewToken` when the click event is fired, but not more than once every 5 minutes
 jQuery('.interactive').on('click', _.throttle(renewToken, 300000, {
  'trailing': false
 }));
@@ -2316,7 +2326,7 @@ jQuery('.interactive').on('click', _.throttle(renewToken, 300000, {
 <!-- div -->

 ### <a id="_wrapvalue-wrapper"></a>`_.wrap(value, wrapper)`
-<a href="#_wrapvalue-wrapper">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5153 "View in source") [&#x24C9;][1]
+<a href="#_wrapvalue-wrapper">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5163 "View in source") [&#x24C9;][1]

 Creates a function that passes `value` to the `wrapper` function as its first argument. Additional arguments passed to the function are appended to those passed to the `wrapper` function. The `wrapper` is executed with the `this` binding of the created function.

@@ -3397,7 +3407,7 @@ _.values({ 'one': 1, 'two': 2, 'three': 3 });
 <!-- div -->

 ### <a id="_escapestring"></a>`_.escape(string)`
-<a href="#_escapestring">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5177 "View in source") [&#x24C9;][1]
+<a href="#_escapestring">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5187 "View in source") [&#x24C9;][1]

 Converts the characters `&`, `<`, `>`, `"`, and `'` in `string` to their corresponding HTML entities.

@@ -3421,7 +3431,7 @@ _.escape('Moe, Larry & Curly');
 <!-- div -->

 ### <a id="_identityvalue"></a>`_.identity(value)`
-<a href="#_identityvalue">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5195 "View in source") [&#x24C9;][1]
+<a href="#_identityvalue">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5205 "View in source") [&#x24C9;][1]

 This method returns the first argument passed to it.

@@ -3446,7 +3456,7 @@ moe === _.identity(moe);
 <!-- div -->

 ### <a id="_mixinobject"></a>`_.mixin(object)`
-<a href="#_mixinobject">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5221 "View in source") [&#x24C9;][1]
+<a href="#_mixinobject">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5231 "View in source") [&#x24C9;][1]

 Adds functions properties of `object` to the `lodash` function and chainable wrapper.

@@ -3476,7 +3486,7 @@ _('moe').capitalize();
 <!-- div -->

 ### <a id="_noconflict"></a>`_.noConflict()`
-<a href="#_noconflict">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5250 "View in source") [&#x24C9;][1]
+<a href="#_noconflict">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5260 "View in source") [&#x24C9;][1]

 Reverts the '_' variable to its previous value and returns a reference to the `lodash` function.

@@ -3496,7 +3506,7 @@ var lodash = _.noConflict();
 <!-- div -->

 ### <a id="_parseintvalue--radix"></a>`_.parseInt(value [, radix])`
-<a href="#_parseintvalue--radix">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5274 "View in source") [&#x24C9;][1]
+<a href="#_parseintvalue--radix">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5284 "View in source") [&#x24C9;][1]

 Converts the given `value` into an integer of the specified `radix`. If `radix` is `undefined` or `0`, a `radix` of `10` is used unless the `value` is a hexadecimal, in which case a `radix` of `16` is used.

@@ -3523,7 +3533,7 @@ _.parseInt('08');
 <!-- div -->

 ### <a id="_randommin0-max1"></a>`_.random([min=0, max=1])`
-<a href="#_randommin0-max1">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5297 "View in source") [&#x24C9;][1]
+<a href="#_randommin0-max1">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5307 "View in source") [&#x24C9;][1]

 Produces a random number between `min` and `max` *(inclusive)*. If only one argument is passed, a number between `0` and the given number will be returned.

@@ -3551,7 +3561,7 @@ _.random(5);
 <!-- div -->

 ### <a id="_resultobject-property"></a>`_.result(object, property)`
-<a href="#_resultobject-property">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5341 "View in source") [&#x24C9;][1]
+<a href="#_resultobject-property">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5351 "View in source") [&#x24C9;][1]

 Resolves the value of `property` on `object`. If `property` is a function, it will be invoked with the `this` binding of `object` and its result returned, else the property value is returned. If `object` is falsey, then `undefined` is returned.

@@ -3604,7 +3614,7 @@ Create a new `lodash` function using the given `context` object.
 <!-- div -->

 ### <a id="_templatetext-data-options"></a>`_.template(text, data, options)`
-<a href="#_templatetext-data-options">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5425 "View in source") [&#x24C9;][1]
+<a href="#_templatetext-data-options">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5435 "View in source") [&#x24C9;][1]

 A micro-templating method that handles arbitrary delimiters, preserves whitespace, and correctly escapes quotes within interpolated code.

@@ -3686,7 +3696,7 @@ fs.writeFileSync(path.join(cwd, 'jst.js'), '\
 <!-- div -->

 ### <a id="_timesn-callback--thisarg"></a>`_.times(n, callback [, thisArg])`
-<a href="#_timesn-callback--thisarg">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5550 "View in source") [&#x24C9;][1]
+<a href="#_timesn-callback--thisarg">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5560 "View in source") [&#x24C9;][1]

 Executes the `callback` function `n` times, returning an array of the results of each `callback` execution. The `callback` is bound to `thisArg` and invoked with one argument; *(index)*.

@@ -3718,7 +3728,7 @@ _.times(3, function(n) { this.cast(n); }, mage);
 <!-- div -->

 ### <a id="_unescapestring"></a>`_.unescape(string)`
-<a href="#_unescapestring">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5577 "View in source") [&#x24C9;][1]
+<a href="#_unescapestring">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5587 "View in source") [&#x24C9;][1]

 The inverse of `_.escape`, this method converts the HTML entities `&amp;`, `&lt;`, `&gt;`, `&quot;`, and `&#39;` in `string` to their corresponding characters.

@@ -3742,7 +3752,7 @@ _.unescape('Moe, Larry &amp; Curly');
 <!-- div -->

 ### <a id="_uniqueidprefix"></a>`_.uniqueId([prefix])`
-<a href="#_uniqueidprefix">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5597 "View in source") [&#x24C9;][1]
+<a href="#_uniqueidprefix">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5607 "View in source") [&#x24C9;][1]

 Generates a unique ID. If `prefix` is passed, the ID will be appended to it.

@@ -3795,7 +3805,7 @@ A reference to the `lodash` function.
 <!-- div -->

 ### <a id="_version"></a>`_.VERSION`
-<a href="#_version">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5840 "View in source") [&#x24C9;][1]
+<a href="#_version">#</a> [&#x24C8;](https://github.com/bestiejs/lodash/blob/master/lodash.js#L5850 "View in source") [&#x24C9;][1]

 *(String)*: The semantic version number.

--- a/lodash.js
+++ b/lodash.js
@@ -4824,13 +4824,21 @@
     * @returns {Function} Returns the new debounced function.
     * @example
     *
-     * var lazyLayout = _.debounce(calculateLayout, 300);
+     * // avoid costly calculations while the window size is in flux
+     * var lazyLayout = _.debounce(calculateLayout, 150);
     * jQuery(window).on('resize', lazyLayout);
     *
-     * jQuery('#postbox').on('click', _.debounce(sendMail, 200, {
+     * // execute `sendMail` when the click event is fired, debouncing subsequent calls
+     * jQuery('#postbox').on('click', _.debounce(sendMail, 300, {
     *   'leading': true,
     *   'trailing': false
     * });
+     *
+     * // ensure `batchLog` is executed once after 1 second of debounced calls
+     * var source = new EventSource('/stream');
+     * source.addEventListener('message', _.debounce(batchLog, 250, {
+     *   'maxWait': 1000
+     * }, false);
     */
    function debounce(func, wait, options) {
      var args,
@@ -5102,9 +5110,11 @@
     * @returns {Function} Returns the new throttled function.
     * @example
     *
+     * // avoid excessively updating the position while scrolling
     * var throttled = _.throttle(updatePosition, 100);
     * jQuery(window).on('scroll', throttled);
     *
+     * // execute `renewToken` when the click event is fired, but not more than once every 5 minutes
     * jQuery('.interactive').on('click', _.throttle(renewToken, 300000, {
     *   'trailing': false
     * }));