如果我有以下对象数组:
[ { id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 2, username: 'ted' } ]
是否有一种方法通过数组循环检查特定的用户名值是否已经存在,如果它不做任何事情,但如果它没有添加一个新对象到数组的用户名(和新ID)?
谢谢!
如果我有以下对象数组:
[ { id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 2, username: 'ted' } ]
是否有一种方法通过数组循环检查特定的用户名值是否已经存在,如果它不做任何事情,但如果它没有添加一个新对象到数组的用户名(和新ID)?
谢谢!
当前回答
你也可以试试这个
const addUser = (name) => {
if (arr.filter(a => a.name == name).length <= 0)
arr.push({
id: arr.length + 1,
name: name
})
}
addUser('Fred')
其他回答
可以有多种可能的方法来检查一个元素是否在 你的案例它的对象)是否存在于数组中。
const arr = [
{ id: 1, username: 'fred' },
{ id: 2, username: 'bill' },
{ id: 3, username: 'ted' },
];
假设你想找一个id = 3的对象。
1. 发现: 它在数组中搜索一个元素,如果找到了,就返回该元素,否则返回undefined。它返回所提供数组中满足所提供测试函数的第一个元素的值。参考
const ObjIdToFind = 5;
const isObjectPresent = arr.find((o) => o.id === ObjIdToFind);
if (!isObjectPresent) { // As find return object else undefined
arr.push({ id: arr.length + 1, username: 'Lorem ipsum' });
}
2. 过滤器: 它搜索数组中的元素,并过滤掉所有符合条件的元素。它返回一个包含所有元素的新数组,如果没有符合条件,则返回空数组。参考
const ObjIdToFind = 5;
const arrayWithFilterObjects= arr.filter((o) => o.id === ObjIdToFind);
if (!arrayWithFilterObjects.length) { // As filter return new array
arr.push({ id: arr.length + 1, username: 'Lorem ipsum' });
}
3.一些: some()方法测试数组中是否至少有一个元素通过了所提供函数实现的测试。它返回一个布尔值。参考
const ObjIdToFind = 5;
const isElementPresent = arr.some((o) => o.id === ObjIdToFind);
if (!isElementPresent) { // As some return Boolean value
arr.push({ id: arr.length + 1, username: 'Lorem ipsum' });
}
我被赋予了一个条件来检查mysql数据库表中的数据,我的表的对象数组由id,纬度和经度作为列名,我必须检查位置是否在数据库中,否则将此插入到表中,这样: 我创建了一个由按钮调用的handle submit函数,
handle Submit = (event) => {
const latitude = document.getElementById("latitude").innerHTML;
const longitude = document.getElementById("longitude").innerHTML;
const found = this.state.data.some((el) => el.latitude === latitude);
if (!found) {
Axios.post("http://localhost:3001/api/insert", {
latitude: latitude,
longitude: longitude,
}).then(() => {
alert("successful insert");
});
console.log(latitude, longitude);
}
};
在这里您可以看到用于插入的条件语句,如果数据库中不存在。
我认为,这是解决这个问题的最短方法。这里我使用ES6的箭头函数和.filter来检查新添加的用户名是否存在。
var arr = [{
id: 1,
username: 'fred'
}, {
id: 2,
username: 'bill'
}, {
id: 3,
username: 'ted'
}];
function add(name) {
var id = arr.length + 1;
if (arr.filter(item=> item.username == name).length == 0){
arr.push({ id: id, username: name });
}
}
add('ted');
console.log(arr);
链接到小提琴
极大地简化了我之前的解决方案,并通过在检查指定ID是否存在之前无需遍历整个数组来提供更好的性能。
这应该是最简单的解决方案(我认为):
const users = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }];
const addUser = (username) => {
const user = users.find((user) => user.username === username);
if (user) return { ...user, new: false };
const newUser = {
id: users.length + 1,
username,
};
users.push(newUser);
return { ...newUser, new: true };
};
下面是一个活生生的例子:
const users = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }]; const addUser = (username) => { const user = users.find((user) => user.username === username); if (user) return { ...user, new: false }; const newUser = { id: users.length + 1, username, }; users.push(newUser); return { ...newUser, new: true }; }; // a little extra scripting here to support the input and button in the example const form = document.querySelector('form'); const input = document.querySelector('input'); const span = document.querySelector('span'); const pre = document.querySelector('pre'); const syncDataWithPre = () => { pre.innerHTML = JSON.stringify(users, null, 2); }; form.onsubmit = (e) => { e.preventDefault(); span.textContent = ''; if (input.value) { const user = addUser(input.value); const { new: isNew, ...userDetails } = user; span.classList[isNew ? 'add' : 'remove']('new'); span.textContent = `User ${isNew ? 'added' : 'already exists'}`; } input.value = ''; syncDataWithPre(); }; syncDataWithPre(); body { font-family: arial, sans-serif; } span { display: block; padding-top: 8px; font-weight: 700; color: #777; } span:empty { display: none; } .new { color: #0a0; } .existing: { color: #777; } <form> <input placeholder="New username" /> <button>Add user</button> </form> <span></span> <pre></pre>
你可以建立你的数组原型,使它更模块化,尝试这样的东西
Array.prototype.hasElement = function(element) {
var i;
for (i = 0; i < this.length; i++) {
if (this[i] === element) {
return i; //Returns element position, so it exists
}
}
return -1; //The element isn't in your array
};
你可以这样使用它:
yourArray.hasElement(yourArrayElement)