Mapping a Selection or an Array (^) ❘ 151
The grep() method also allows an optional third argument called invert to be specifi ed; if it is set to
true, the values of the fi ltered array are reversed.
NOTE The arguments provided to the $.grep() callback function are reversed;
value is the fi rst argument and key is the second. In addition, the value argument
is not also provided within this when using $.grep().
Mapping a Selection or an Array
As was the case with fi ltering, there are two different contexts in which you can map one collec-
tion of items to another, in a selection or with an arbitrary array of items. This time, however, both
contexts use a function that goes by the same name, map(). In the following sections, you learn more
about the map() method as applied within either context.Mapping a Selection
The concept of mapping is taking one set of values and modifying one or more of those values to
create a new set of values. No items are removed from the set during a mapping, so it’s expected
that you’ll have a set of values of the same length when you fi nish mapping as when you started—
the idea being more or less that you can arbitrarily replace values as needed with new ones that
have redundant modifi cations that must be made to some or all values. The following document,
Example 5-7, demonstrates how you map a selection with jQuery:<!DOCTYPE HTML>
<html lang='en'>
<head>
<meta http-equiv='X-UA-Compatible' content='IE=Edge' />
<meta charset='utf-8' />
<title>Rubber Soul</title>
<script src='../jQuery.js'></script>
<script src='../jQueryUI.js'></script>
<script src='Example 5-7.js'></script>
<link href='Example 5-7.css' rel='stylesheet' />
</head>
<body>
<h4>Rubber Soul</h4>
<ul id='rubberSoul'>
<li class='Paul'>Drive My Car</li>
<li class='John'>Norwegian Wood (This Bird Has Flown)</li>
<li class='Paul'>You Won't See Me</li>
<li class='John'>Nowhere Man</li>
<li class='George'>Think for Yourself</li>
<li class='John'>The Word</li>
<li class='Paul'>Michelle</li>
<li class='John'>What Goes On</li>
<li class='John'>Girl</li>
<li class='Paul'>I'm Looking Through You</li>
<li class='John'>In My Life</li>