[英]Find object in array and then edit it
假设我有以下数组:
var things = [
{
id: "12345",
name: "Bryan"
},
{
id: "55555",
name: "Justin"
}
]
我想搜索ID为55555
的对象。 但是我想将特定对象的名称从贾斯汀(Justin)更新为“ 迈克(Mike) ”,但仍保持整个部队的完整。
目前,我有点想出一种搜索对象的方法,但是我找不到真正编辑该特定发现的解决方案。
有人可以帮我吗? 这是我到目前为止的内容:
var thing = things.filter(function (item) {
return "55555" === item.id;
})[0]
如何找到正确的ID并更改名称的函数
var things = [ { id: "12345", name: "Bryan" }, { id: "55555", name: "Justin" } ] function updateThings(id, value, arr) { arr.forEach(function(item) { if (item.id == id) { item.name = value; return false; } }); } updateThings("55555", "Mike", things); document.body.innerHTML = '<pre>' + JSON.stringify(things, null, 4) + '</pre>';
我只是遍历数组,检查ID是否匹配并编辑名称。
for (var i = 0; i < things.length; i++) {
if (things[i].id == "55555") {
things[i].name = "new name";
}
}
使用.filter()
效率低下,因为它在找到所需的项目后会不断进行迭代。
您可以定义一个通用函数,如下所示:
function findElementByPropertyValue(arr, propertyName, propertyValue) {
for (var i = 0, count = arr.length; i < count; i++) {
var element = arr[i];
if (element[propertyName] === propertyValue) {
return element;
}
}
return null;
}
然后像这样使用它:
var mike = findElementByPropertyValue(things, 'id', '55555');
if (mike) {
mike.name = 'Mike';
}
如果需要更改数组中的许多元素,则可能需要创建一个哈希对象。
function createHashByProperty(arr, propertyName) {
var hash = {};
for (var i = 0, count = arr.length; i < count; i++) {
var element = arr[i];
hash[element[propertyName]] = element;
}
return hash;
}
您可以像这样使用它:
var hash = createHashByProperty(things, 'id');
hash['55555'].name = 'Mike'; // Was 'Justin'
hash['12345'].name = 'Brian'; // Was 'Bryan'
上面的两个函数不会更改数组,它们只是允许您获取对数组中元素的引用,因此您可以更改这些元素。
如果要从数组中删除元素,则需要获取其索引。 然后,您可以使用Array.prototype.splice
函数删除该元素。
这是执行此操作的函数:
function removeElementByPropertyValue(arr, propertyName, propertyValue) {
for (var i = 0, count = arr.length; i < count; i++) {
if (arr[i][propertyName] === propertyValue) {
arr.splice(i, 1);
return;
}
}
}
您可以像这样使用它:
removeElementByPropertyValue(things, 'id', '55555');
注意:此答案中的代码使用纯JavaScript; 它不依赖于jQuery库。
为了提高效率,您可以存储每个项目的位置,然后使用它来引用名称:
var things = [
{
id: "12345",
name: "Bryan"
},
{
id: "55555",
name: "Justin"
}
], reference = things.map(function(a){ return a.id });;
function replace (id, name, ar, ref) { ref.indexOf(id)>-1&&(ar[ref.indexOf(id)]['name']=name); }
replace("55555", "Phil", things, reference);
在这种情况下,您只需要循环一次。 然后,所有信息都存储在reference
变量中。 reference
存储id
所在的位置,我们使用它来避免循环。 我不确定编译器在做什么,是否会循环,但这会更有效率。
将此代码添加到JavaScript文件的顶部:
[].indexOf||(Array.prototype.indexOf=function(a,b,c){for(c=this.length,b=(c+~~b)%c;b<c&&(!(b in this)||this[b]!==a);b++);return b^c?b:-1;})
和
Array.prototype.map||(Array.prototype.map=function(r,t){var n,o,e;if(null==this)throw new TypeError(" this is null or not defined");var i=Object(this),a=i.length>>>0;if("function"!=typeof r)throw new TypeError(r+" is not a function");for(arguments.length>1&&(n=t),o=new Array(a),e=0;a>e;){var p,f;e in i&&(p=i[e],f=r.call(n,p,e,i),o[e]=f),e++}return o});
随着:
Array.prototype.forEach||(Array.prototype.forEach=function(r,t){var o,n;if(null==this)throw new TypeError(" this is null or not defined");var e=Object(this),i=e.length>>>0;if("function"!=typeof r)throw new TypeError(r+" is not a function");for(arguments.length>1&&(o=t),n=0;i>n;){var a;n in e&&(a=e[n],r.call(o,a,n,e)),n++}});
注意:虽然IE 8和更低版本不支持indexOf
实际上几乎所有其他浏览器都支持indexOf
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.