Javascript:在对象数组中找到匹配项并移动到第一个位置
Javascript: find match in array of objects and move to first position
我试图实现的与Stackoverflow上另一篇文章中的PHP解决方案类似,但使用了JavaScript:
多维数组,找到项目并移动到顶部?
我正在返回一个包含以下内容的对象:
$.get(uri, function (data) {
self.options = [];
$.each(data, function (index, item) {
self.options.push(item);
});
});
self.options[]看起来像:
Object 1:
Id: "1"
Name: "Bill"
Object 2:
Id: "2"
Name: "Sarah"
Object 3:
Id: "3"
Name: "Mike"
我需要在数组对象中找到"Sarah",并将其上移为数组的第一项。我如何才能做到这一点?*
您可以用JavaScript写出问题的英文描述。
array.unshift( // add to the front of the array
array.splice( // the result of deleting items
array.findIndex( // starting with the index where
elt => elt.Name === 'Sarah'), // the name is Sarah
1)[0] // and continuing for one item
)
或者,更紧凑地说:
array.unshift(array.splice(array.findIndex(elt => elt.Name === 'Sarah'), 1)[0])
findIndex在Internet Explorer中根本不受支持因此要支持IE 11,您可以使用map
(自IE 9起)和indexOf
(自IE 8起)的组合-这为您提供了完全的、非绿色的跨浏览器兼容性。
array.unshift(
array.splice(
array.map(function(e){ return e.Name}).indexOf('Sarah'),
1)[0]
)
但这并不能处理莎拉失踪或不止一个莎拉的情况。一个更通用的解决方案是根据某些条件将传入的数组一分为二,然后重新组合。这就是这个tee
函数的作用:
function tee(a, fn) {
var non_matches = [];
var matches = a.filter(function(e, i, a) {
var match = fn(e, i, a);
if (!match) non_matches.push(e);
return match;
});
return matches.concat(non_matches);
}
现在,在ES6中,您可以使用获得结果
tee(a, e => e.Name === 'Sarah')
或者对于较旧的浏览器,使用ES5:
tee(a, function(e) { return e.Name === 'Sarah'; })
您可以使用Array.prototype.sort来实现这一点。
例如
var arr = [];
arr.push({Id:"1", Name:"Bill"});
arr.push({Id:"2", Name:"Sarah"});
arr.push({Id:"3", Name:"Mike"});
arr.sort(function(first, second) {
if (second.Name == "Sarah") return 1;
});
console.log(arr);
// [Object { Id="2", Name="Sarah"}, Object { Id="1", Name="Bill"}, Object { Id="3", Name="Mike"}]
或者另一种替代方案,
var arr = [];
arr.push({Id:"1", Name:"Bill"});
arr.push({Id:"3", Name:"Mike"});
arr.push({Id:"2", Name:"Sarah"});
function getIndexByName(name) {
for(var i = 0; i < arr.length; i++) {
if (arr[i].Name == name) {
return i;
}
}
}
var pos = getIndexByName("Sarah");
arr.splice(0, 0, arr[pos++]) // Insert Sarah at `arr` first position
arr.splice(pos, 1); // Remove old Sarah
您可以使用array
的sort
方法
var array = ['apple','zebra','cherry','grap'];
// 'zebra' at first index of array
array.sort( (first, second) => {
if(first === 'zebra') return -1;
});
console.log('first', array);
// 'zebra' at last index of array
array.sort( (first, second) => {
if(second === 'zebra') return -1;
});
console.log('last', array);
这里有一种方法可以满足您的要求。
$.get(uri, function (data) {
self.options = [];
var chosenName = 'Sarah'
var tmp = [];
$.each(data, function (index, item) {
// if we find it while iterating through do not add it, store it it tmp
if (item.Name === chosenName) {
tmp.push(item);
} else {
self.options.push(item);
}
});
// if we found it push it to the front of the array
if (tmp.length > 0) self.options = tmp.concat(self.options)
});
相关文章:
- 在不移动元件的情况下从相对位置更改为固定位置
- 如何在鼠标悬停时将对象从起始位置移动到结束位置,然后在鼠标悬停后再次移动
- 将插入符号位置移动到ContentEditable<DIV>
- 我发现了一些只在移动设备上可见的垃圾邮件链接,我可以'找不到包含此垃圾邮件链接的脚本的位置
- float's未返回到移动视图结束后的位置
- 将javascript数组中的项移动到特定位置的有效方法
- 如何将节点移动到所需位置
- Photoshop脚本:将图像移动到位置x,y
- 在鼠标上触发鼠标移动'的当前位置
- 固定图像滚动移动位置
- Javascript滚动和移动位置
- 如何确保按钮点击均匀移动位置
- 当地图移动时,必应地图InfoBox会在FireFox和Chrome中移动位置
- 当尝试按下鼠标选择所有对象时,对象会自动移动位置(Fabric.JS)
- 在必应地图上获取移动位置
- 精灵图像的随机移动位置
- 如何将多个标记添加到移动位置谷歌地图,Javascript
- 创建用于移动位置的常量而不是变量
- 如何根据鼠标移动/位置应用效果
- MediaWiki我如何得到[折叠]链接不移动位置与文本