Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <blockquote> <p>1) How does parameter 1 (index) know to be an integer?</p> </blockquote> <p>jQuery passes an integer.</p> <blockquote> <p>2) How does the function know to increment index?</p> </blockquote> <p>The callback doesn't increment <code>index</code>, the jQuery method does.</p> <blockquote> <p>3) How does the second parameter (oldValue) know to hold the old value of the property (before modification)?</p> </blockquote> <p>jQuery passes it.</p> <p>The answers to questions 1-3 are perhaps best understood by a function that performs something similar to <code>$.attr</code>:</p> <pre><code>Array.prototype.each = function (f) { var i; for (i=0; i &lt; this.length; ++i) { f(i, this[i]); } }; ['zero', 'one', 'two'].each(function (i,item) {console.log({i: item})}); </code></pre> <p><code>f</code> is a callback. <code>each</code> is responsible for iterating over a collection and calling <code>f</code> for each index &amp; item. The same code structure can be used for functions:</p> <pre><code>/* Map each item in a sequence to something else, * returning a new sequence of the new values. */ Array.prototype.map = function (f) { var i, result = []; for (i=0; i &lt; this.length; ++i) { result[i] = f(i, this[i]); } return result; }; ['zero', 'one', 'two'].map(function(i,item) {return item.length}); // result: [4, 3, 3] /* Return a sequence of the items from this sequence * for which 'keep' returns true. */ Array.prototype.filter = function (keep) { var i, result = []; for (i=0; i &lt; this.length; ++i) { if (keep(i, this[i])) { result.push(this[i]); } } return result; }; ['zero', 'one', 'two'].filter(function(i,item) {return item.length &lt;= 3}); // result: ['one', 'two'] </code></pre> <p>Implementation of <code>mapconcat</code>, <a href="http://en.wikipedia.org/wiki/Fold_%28higher-order_function%29" rel="nofollow noreferrer"><code>foldl</code> and <code>foldr</code></a> left as an exercise. As another exercise, rewrite <code>map</code> and <code>filter</code> in terms of <code>each</code>.</p> <p>Note these functions are merely intended to illustrate how callbacks work. They may cause problems in production code.</p> <blockquote> <p>4) Is this a jQuery construct? A JSON thing? It's cool. it works, but ...what the heck is this "value callback" thing made of?</p> </blockquote> <p><a href="https://stackoverflow.com/q/5485495/">Callbacks</a> are a generic technique that jQuery makes extensive use of. They're the key feature of <a href="http://en.wikipedia.org/wiki/Functional_programming" rel="nofollow noreferrer">functional programming</a>, where functions are data that can be operated on just like other data types. Thus, you have functions that take functions as arguments and can return functions. In certain contexts, <a href="https://stackoverflow.com/q/7070495/">callbacks</a> are also known as "continuations" and form the basis of <a href="http://marijn.haverbeke.nl/cps/" rel="nofollow noreferrer">continuation passing style</a> (<a href="http://blogs.msdn.com/b/wesdyer/archive/2007/12/22/continuation-passing-style.aspx" rel="nofollow noreferrer">CPS</a>). This is particularly important for <a href="https://stackoverflow.com/q/748175/">asynchronous function calls</a> [<a href="https://softwareengineering.stackexchange.com/q/104816/">2</a>] (where the function returns before the computation completes, as opposed to <a href="http://www.bisque.com/help/CCDSoft/asynchronous_vs._synchronous_execution.htm" rel="nofollow noreferrer">synchronous calls</a>), such as is used for Ajax requests. To see some of the power of CPS, read <a href="http://www.ibm.com/developerworks/java/library/j-contin/index.html" rel="nofollow noreferrer">"Use continuations to develop complex Web applications"</a>.</p> <p>The other aspect of this, the "value" in "value callback", is that, as JS is a dynamically typed language (types are associated with data, rather than variables), formal parameters can be bound to objects of any type. A function can then behave differently depending on what is passed. Sometimes this is implemented by examining the type of the argument, which is in effect <a href="http://en.wikipedia.org/wiki/Ad-hoc_polymorphism" rel="nofollow noreferrer">ad-hoc polymorphism</a> (the function, rather than the language, must handle dispatch). However, <a href="http://en.wikipedia.org/wiki/Parametric_polymorphism" rel="nofollow noreferrer">parametric polymorphism</a> or (failing that) <a href="http://en.wikipedia.org/wiki/Duck_typing" rel="nofollow noreferrer">duck typing</a> should always be preferred over examining argument types. Parametric polymorphism is achieved by ensuring that all types that can be passed to a given function support the same interface (method names, arguments, preconditions, postconditions &amp; so on). For example, all sequence types should have a <code>length</code> property and be indexed by integers; as long as that holds, you can use your own sequence type with many functions that take arrays.</p> <p>I'm not sure what you mean by JSON, but it's probably not what is generally meant. JSON is a data interchange format based on a limited version of the JS object literal syntax. JSON is not involved anywhere in the sample code or quoted text.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload