干净的方式从javascript数组中删除元素(使用jQuery,coffeescript)
有很多关于这个的问题,特别是: jQuery版本的数组包含 了splice方法的解决scheme等等。 但是,他们都显得复杂而烦人。
有了javascript,jQuery和coffeescript的组合function,从javascript数组中删除元素的最简洁的方法是什么? 我们并不知道这个指标。 在代码中:
a = [4,8,2,3] a.remove(8) # a is now [4,2,3]
如果没有一个好的内置方法,扩展javascript数组以支持这种方法的干净方法是什么? 如果有帮助,我真的使用数组作为集。 解决scheme将理想地与jQuery支持咖啡脚本很好地工作。 另外,我不在乎速度,而是优先考虑清晰,简单的代码。
CoffeeScript的:
Array::remove = (e) -> @[t..t] = [] if (t = @indexOf(e)) > -1
它简单地拼接出位置t
处的元素,即finde
的索引(如果它实际上发现t > -1
)。 Coffeescript将其转换为:
Array.prototype.remove = function(e) { var t, _ref; if ((t = this.indexOf(e)) > -1) { return ([].splice.apply(this, [t, t - t + 1].concat(_ref = [])), _ref); } };
如果你想删除所有匹配的元素,并返回一个新的数组,使用CoffeeScript和jQuery:
Array::remove = (v) -> $.grep @,(e)->e!=v
这转换成:
Array.prototype.remove = function(v) { return $.grep(this, function(e) { return e !== v; }); };
或者不用jQuery的grep:
Array::filterOutValue = (v) -> x for x in @ when x!=v
这意味着:
Array.prototype.filterOutValue = function(v) { var x, _i, _len, _results; _results = []; for (_i = 0, _len = this.length; _i < _len; _i++) { x = this[_i]; if (x !== v) { _results.push(x); } } return _results; };
使用vanilla Javascript:
Array.prototype.remove = function(elem) { var match = -1; while( (match = this.indexOf(elem)) > -1 ) { this.splice(match, 1); } }; var a = [4, 8, 2, 3]; a.remove(8);
只有jQuery:
jQuery.removeFromArray = function(value, arr) { return jQuery.grep(arr, function(elem, index) { return elem !== value; }); }; var a = [4, 8, 2, 3]; a = jQuery.removeFromArray(8, a);
使用jQuery这非常简单:
var index = $.inArray("value", myArray); if(index != -1) { myArray.splice(index, 1); }
笔记:
splice
返回被删除的元素,所以不要做myArray = myArray.splice()
。 myArray.splice(index,1)
意思是“从索引'index'
从数组中删除数组元素”。
$.inArray
返回所要查找的值的数组中的索引,如果该值不在数组中,则返回-1。
这看起来很干净和可以理解。 不像其他的答案,它考虑到一个元素出现不止一次的可能性。
Array.prototype.remove = function (value) { for (var i = 0; i < this.length; ) { if (this[i] === value) { this.splice(i, 1); } else { ++i; } } }
在CoffeeScript中:
Array::remove = (value) -> i = 0 while i < @length if @[i] == value @splice i, 1 else ++i return @
如果您还在使用CoffeeScript创build者的underscore.js库,以下是一个很好的工具:
a = _(a).reject (v)-> v is e
或者在js中:
a = _(a).reject(function(v) { return v == e; });
虽然您要求使用Coffeescript或jQuery的干净方法,但我发现最简洁的方法是使用vanilla JavaScript方法filter :
array.filter(function (item) { return item !== match });
它看起来更干净的咖啡脚本,但这转换为完全相同的JavaScript,所以我只认为它是一个视觉差异,而不是咖啡的高级function:
array.filter (item) -> item isnt match
filter在旧版浏览器中不受支持,但Mozilla提供了符合ECMA标准的polyfill。 我认为这是一个非常安全的方法,因为您只是将旧浏览器引入现代标准,而不是在您的polyfill中发明任何新function。
对不起,如果你是专门寻找一个jQuery或Coffeescript唯一的方法,但我认为你主要是要求一个图书馆的方法,因为你不知道一个干净的JavaScript只是方法。
你有它,没有图书馆需要!
这只是Amir真棒解决scheme的轻微改变:
Array::remove = (e) -> @splice(t,1)[0] if (t = @indexOf(e)) > -1
如果列表中有元素,则返回元素,所以你可以这样做:
do_something 100 if a.remove(100)
删除咖啡脚本转换为此javascript:
Array.prototype.remove = function(e) { var t, _ref; if ((t = this.indexOf(e)) > -1) { return ([].splice.apply(this, [t, t - t + 1].concat(_ref = [])), _ref); }};
你可以试试jQuery的grep工具:
a = [4,8,2,3] $.grep(a,function(v){return v!=8;})
这里可能会有一个性能问题,因为你在技术上导致variables引用一个新的数组; 你并没有真的修改原来的。 假设原始文件没有在其他地方被引用,垃圾收集器应该很快就完成。 这对我来说从来不是一个问题,但其他人可能会更清楚。 干杯!