Question

在Javascript中，数组应该有方法 pop 和 shift 。

但是，JQuery对象似乎缺少这些方法：

$('div').shift(); // Error, shift is undefined
$('div').pop(); // Error, pop is undefined
$('div').splice(); // Splice is OK actually

我想知道为什么缺少这些函数 - 毕竟，jquery对象只是一个数组。

在jquery对象上执行pop和shift函数的最简单方法是什么？

Answer 1

它们丢失了，因为jQuery对象不是数组。

(function( $ ) {
    $.fn.pop = function() {
        var top = this.get(-1);
        this.splice(this.length-1,1);
        return top;
    };

    $.fn.shift = function() {
        var bottom = this.get(0);
        this.splice(0,1);
        return bottom;
    };
})( jQuery );

编辑： .slice()不会修改原始对象。固定使用.splice()代替。

Answer 2

你最安全的选择就是使用：

[].pop.call($('div'))
[].shift.call($('div'))

如果您想在示例中使用确切的语法，可以增加jQuery.fn：

jQuery.fn.pop = [].pop;
jQuery.fn.shift = [].shift;

后者适用于mutator methods。它也适用于accessor和iteration方法，但请注意，其中许多方法都返回一个必须重新包装的纯数组。请注意，jQuery是其中一些版本的自有版本（例如.map，.slice，.filter等），您可能不想覆盖这些版本。

Answer 3

这似乎对我有用：

var divArray = $('div').toArray();
var elem = $( divArray.shift() );

.toArray()将DOM元素作为JavaScript数组返回，可以按预期使用。然后你需要做的就是将它转换回jQuery对象。

Answer 4

我意识到这个答案已经被选中，但是这是另一个不太难记住的选择，以防你不想担心必须一直安装插件。

$('div > :first').detach(); // shift
$('div > :last').detach();  // pop

顺便说一下，我意识到有performance issues with using :last selector as part of your primary selector所以你可能想考虑为pop做这样的事情：

$('div').children(':last').detach();

Answer 5

var $firstDiv = $( $('div').splice(0, 1) );

Answer 6

使用jQuery 1.9.1+的另一种方式：

$('div').first().remove();  
$('div').last().remove();

如何从jQuery集“弹出”或“转移”

6 个答案: