Geek Answers Handbook

When is jQuery.map useful without .get?

Function . map () in jQuery returns a jQuery object:

var $collection = $(selector).map(extractSomeValue)

Most often, a simple array of displayed values ​​is desirable:

var extractedArray = $collection.get()

In fact, ALL used examples and examples I found always have a pair of .map () with .get (), including jQuery's own documentation .

What is the precedent for working with $collectionas is? Why is .map () just returning an array if that is what everyone uses it for?

EDIT . To be clear, I mean only jQuery.fn.map, not jQuery.map (aka $. Map ), since the latter is well defined to work only with objects other than jQuery, and intelligently returns a simple array.

+4
source share
5 answers

Imagine that you already have a jQuery object containing elements awith identifiers like href. Now you need all the target elements. It .map()may become convenient here:

var $list = $('a[href^=\\#]');
...
//somewhere else
var $targetElements = $list.map(function() {
       return $(this.href)[0];
});
$targetElements.addClass('newClass');

Or do you want to create new elements based on old ones:

var $links = $('a');
...
var $list = $links.map(function() {
       return $('<li>URL: ' + this.href + '</li>')[0];
});
$list.appendTo($myUl);

They may not be the most useful examples, I know, but they illustrate my point. You have a list of elements and you need a different list of elements that somehow relate to the original elements. Or you create new elements based on old ones. Using .map(), you get a ready-to-use jQuery object.

+4
source

, , jQuery.fn.map - , jQuery.map, , jQuery.

jQuery jQuery.fn.map jQuery.fn.filter. , map jQuery jQuery, jQuery.filter , map.

, , , , jQuery.fn.map jQuery.map .

, . , , 0 map, node :

$elements.map(function() {
    return [document.createElement('div'),
            document.createElement('span')];
});
+2

( ), , .map() jQuery Object, "" jQuery. , , DOM. $.fn.get() . , get(), DOM, .

An ( , , ):

var $example = $('#foo').map(function() {
    if ($(this).innerHTML == "bar") {
        return this;
    }
});

: http://ajpiano.com/when-to-use-jquerys-map-methods/

jQuery.fn.map, jQuery - , jQuery. DOM , $.fn.map . .get(index) DOM node , .get() , . , jQuery-, Array.join Array, , , , . .get() !

0

Map , [].

, , href a:

<a href="something1">Something</a>
<a href="something2">Something</a>
<a href="something3">Something</a>
<a href="something4">Something</a>

:

var arr = $("a").map(function(i,e){
    return e.href;
});
0

, .map() jQuery, , , jQuery . ( ):

var $collection = $('#qinfo p:even').map(function () {
    return $(this).text();
});

var ucfirst = $collection.map(function () {
    return this.replace(/^./, function (fst) {
        return fst.toUpperCase();
    });
}).get();

var prefixed = $collection.map(function () {
    return 'prefix-' + this;
}).get();

console.log($collection.get());
console.log(ucfirst);
console.log(prefixed);

, , , . , .map() . , .map() . :

$.fn.ucfirst = function () {
    return this.map(function () {
        return this.replace(/^./, function (fst) {
            return fst.toUpperCase();
        });
    });
};

$collection.ucfirst().each(function () {
    console.log(this.toString());
});

It should be noted that it is .ucfirst()designed to work with collections of strings, which is beyond the scope of the original jQuery target.

0
source

More articles:


All Articles