Check if object value exists within a Javascript array of objects and if not add a new object to array

JavascriptArraysObjectFor LoopForeach

Javascript Problem Overview


If I have the following array of objects:

[ { id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 2, username: 'ted' } ]

Is there a way to loop through the array to check whether a particular username value already exists and if it does do nothing, but if it doesn't to add a new object to the array with said username (and new ID)?

Thanks!

Javascript Solutions


Solution 1 - Javascript

I've assumed that ids are meant to be unique here. some is a great function for checking the existence of things in arrays:

const arr = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }];

function add(arr, name) {
  const { length } = arr;
  const id = length + 1;
  const found = arr.some(el => el.username === name);
  if (!found) arr.push({ id, username: name });
  return arr;
}

console.log(add(arr, 'ted'));

Solution 2 - Javascript

This small snippets works for me..

const arrayOfObject = [{ id: 1, name: 'john' }, {id: 2, name: 'max'}];

const checkUsername = obj => obj.name === 'max';

console.log(arrayOfObject.some(checkUsername))

if you have array of elements like ['john','marsh'] then we can do some thing like this

const checkUsername = element => element == 'john';
    
console.log(arrayOfObject.some(checkUsername))

Solution 3 - Javascript

It's rather trivial to check for existing username:

var arr = [{ id: 1, username: 'fred' }, 
  { id: 2, username: 'bill'}, 
  { id: 3, username: 'ted' }];

function userExists(username) {
  return arr.some(function(el) {
    return el.username === username;
  }); 
}

console.log(userExists('fred')); // true
console.log(userExists('bred')); // false

But it's not so obvious what to do when you have to add a new user to this array. The easiest way out - just pushing a new element with id equal to array.length + 1:

function addUser(username) {
  if (userExists(username)) {
    return false; 
  }
  arr.push({ id: arr.length + 1, username: username });
  return true;
}

addUser('fred'); // false
addUser('bred'); // true, user `bred` added

It will guarantee the IDs uniqueness, but will make this array look a bit strange if some elements will be taken off its end.

Solution 4 - Javascript

This is what I did in addition to https://stackoverflow.com/users/4591241/sagar-gavhane">@sagar-gavhane</a>'s answer

const newUser = {_id: 4, name: 'Adam'}
const users = [{_id: 1, name: 'Fred'}, {_id: 2, name: 'Ted'}, {_id: 3, name:'Bill'}]

const userExists = users.some(user => user.name === newUser.name);
if(userExists) {
    return new Error({error:'User exists'})
}
users.push(newUser)

Solution 5 - Javascript

> There could be MULTIPLE POSSIBLE WAYS to check if an element(in > your case its Object) is present in an array or not.

const arr = [
  { id: 1, username: 'fred' },
  { id: 2, username: 'bill' },
  { id: 3, username: 'ted' },
];

let say you want to find an object with id = 3.

1. find: It searches for an element in an array and if it finds out then it returns that element else return undefined. It returns the value of the first element in the provided array that satisfies the provided testing function. reference

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. filter: It searches for elements in an array and filters out all element that matches the condition. It returns a new array with all elements and if none matches the condition then an empty array. reference

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: The some() method tests whether at least one element is present in an array that passes the test implemented by the provided function. It returns a Boolean value. reference

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' });
}

Solution 6 - Javascript

I think that, this is the shortest way of addressing this problem. Here I have used ES6 arrow function with .filter to check the existence of newly adding username.

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);

Link to Fiddle

Solution 7 - Javascript

Let's assume we have an array of objects and you want to check if value of name is defined like this,

let persons = [ {"name" : "test1"},{"name": "test2"}];

if(persons.some(person => person.name == 'test1')) {
    ... here your code in case person.name is defined and available
}

Solution 8 - Javascript

try this

first method using some

  let arr = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }];
    let found = arr.some(ele => ele.username === 'bill');
    console.log(found)

second method using includes, map

   let arr = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }];
    let mapped = arr.map(ele => ele.username);
    let found = mapped.includes('bill');
    console.log(found)

Solution 9 - Javascript

I like Andy's answer, but the id isn't going to necessarily be unique, so here's what I came up with to create a unique ID also. Can be checked at jsfiddle too. Please note that arr.length + 1 may very well not guarantee a unique ID if anything had been removed previously.

var array = [ { id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' } ];
var usedname = 'bill';
var newname = 'sam';

// don't add used name
console.log('before usedname: ' + JSON.stringify(array));
tryAdd(usedname, array);
console.log('before newname: ' + JSON.stringify(array));
tryAdd(newname, array);
console.log('after newname: ' + JSON.stringify(array));

function tryAdd(name, array) {
    var found = false;
    var i = 0;
    var maxId = 1;
    for (i in array) {
        // Check max id
        if (maxId <= array[i].id)
            maxId = array[i].id + 1;
        
        // Don't need to add if we find it
        if (array[i].username === name)
            found = true;
    }
    
    if (!found)
        array[++i] = { id: maxId, username: name };
}

Solution 10 - Javascript

You could prototype your array to make it more modular, try something like this

	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
	};

And you can use it as:

 yourArray.hasElement(yourArrayElement)

Solution 11 - Javascript

Accepted answer can also be written in following way using arrow function on .some

 function checkAndAdd(name) {
     var id = arr.length + 1;
     var found = arr.some((el) => {
           return el.username === name;
     });
     if (!found) { arr.push({ id: id, username: name }); }
 }

Solution 12 - Javascript

Here is an ES6 method chain using .map() and .includes():

const arr = [ { id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 2, username: 'ted' } ]
    
const checkForUser = (newUsername) => {
      arr.map(user => {
        return user.username
      }).includes(newUsername)
    }

if (!checkForUser('fred')){
  // add fred
}
  1. Map over existing users to create array of username strings.
  2. Check if that array of usernames includes the new username
  3. If it's not present, add the new user

Solution 13 - Javascript

i did try the above steps for some reason it seams not to be working for me but this was my final solution to my own problem just maybe helpful to any one reading this :

let pst = post.likes.some( (like) => {  //console.log(like.user, req.user.id);
                                     if(like.user.toString() === req.user.id.toString()){
                                         return true
                                     } } )

here post.likes is an array of users who liked a post.

Solution 14 - Javascript

This can be done fairly simply with a couple of array methods and in several different ways.

1. Simply pushing the new object to the source array and ignoring the value returned by the function (true, or the array's length when using .push())

Below, I first map the array to a new shallow array of only the usernames and then check to see if that array .includes() the specified username. If it does, I return true by nature of the || operator. Otherwise, I push a new object for the specified username back to the source array of objects.

const arr = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }];
const usernameCheck = (arr, usr) => arr.map(u => u.username).includes(usr) || arr.push({ id: arr.length+1, username: usr });
usernameCheck(arr, 'jeremy');
console.log(arr);

2. Returning the array rather than simply returning true, or the array's length when using .push():

This can also be improved in several ways if you would like more flexibility. If you don't care to return true and would rather return the new array for immediate use, we can make use of the , operator by simply returning the array at the end of the function, whether or not a push was made. With this solution, the original array is still pushed to, and because we return the array, we can perform our console.log() directly on the function execution, rather than needing to run the function first, and then log the array's content.

const arr = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }];
const usernameCheck = (arr, usr) => (arr.map(u => u.username).includes(usr) || arr.push({ id: arr.length+1, username: usr }), arr);
console.log(usernameCheck(arr, 'jeremy'));

3. Using a shallow copy, not altering the source array:

If on the other hand, you only wanted to return a shallow copy of the new array without directly pushing to the source array, you could do so using the spread operator ..., or the .concat() method if you prefer:

const arr = [{ id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 3, username: 'ted' }];
const usernameCheck = (arr, usr) => arr.map(u => u.username).includes(usr) ? [...arr] : [...arr, { id: arr.length+1, username: usr }];
console.log('This will return the array with the added username:\n\nusernameCheck(arr, \'jeremy\')', usernameCheck(arr, 'jeremy'));
console.log('But the original array remains untouched:\n\narr', arr);

Solution 15 - Javascript

Native functions of array are sometimes 3X - 5X times slower than normal loops. Plus native functions wont work in all the browsers so there is a compatibility issues.

My Code:

<script>
  var obj = [];

  function checkName(name) {
    // declarations
    var flag = 0;
    var len = obj.length;	
    var i = 0;
    var id = 1;

    // looping array
    for (i; i < len; i++) {
        // if name matches
        if (name == obj[i]['username']) {
            flag = 1;
            break;
        } else {
            // increment the id by 1
            id = id + 1;
        }
    }

    // if flag = 1 then name exits else push in array
    if (flag == 0) {
      // new entry push in array		
      obj.push({'id':id, 'username': name});
    }
  }
  // function end

  checkName('abc');
</script>

This way you can achieve result faster.

Note: I have not checked if parameter passed is empty or not, if you want you can put a check on it or write a regular expression for particular validation.

Solution 16 - Javascript

xorWith in Lodash can be used to achieve this

let objects = [ { id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 2, username: 'ted' } ]
let existingObject = { id: 1, username: 'fred' };
let newObject = { id: 1729, username: 'Ramanujan' }

_.xorWith(objects, [existingObject], _.isEqual)
// returns [ { id: 2, username: 'bill' }, { id: 2, username: 'ted' } ]

_.xorWith(objects, [newObject], _.isEqual)
// returns [ { id: 1, username: 'fred' }, { id: 2, username: 'bill' }, { id: 2, username: 'ted' } ,{ id: 1729, username: 'Ramanujan' } ]

Solution 17 - Javascript

Check it here :

https://stackoverflow.com/a/53644664/1084987

You can create something like if condition afterwards, like

if(!contains(array, obj)) add();

Solution 18 - Javascript

function number_present_or_not() {
  var arr = [2, 5, 9, 67, 78, 8, 454, 4, 6, 79, 64, 688];
  var found = 6;
  var found_two;
  for (i = 0; i < arr.length; i++) {
    if (found == arr[i]) {
      found_two = arr[i];
      break;
    }
  }
  if (found_two == found) {
    console.log('number present in the array');
  } else {
    console.log('number not present in the array');
  }
}

Solution 19 - Javascript

You can try this also

 const addUser = (name) => {
    if (arr.filter(a => a.name == name).length <= 0)
        arr.push({
            id: arr.length + 1,
            name: name
        })
}
addUser('Fred')

Solution 20 - Javascript

I was given a condition to check the data in the table of the mysql database the object array of my table consist of the id, latitude and longitude as column names, I have to check whether the location is in the database else insert this into the table so: I created a function of handle submit called by a button,

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);
    }
  };

Here you can see the conditional statement for inserting if not exist in the database.

Solution 21 - Javascript

const __checkIfElementExists__ = __itemFromArray__ => __itemFromArray__.*sameKey* === __outsideObject__.*samekey*;

    if (cartArray.some(checkIfElementExists)) {
        console.log('already exists');
    } else {
        alert('does not exists here')

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser2576960View Question on Stackoverflow
Solution 1 - JavascriptAndyView Answer on Stackoverflow
Solution 2 - JavascriptSagarView Answer on Stackoverflow
Solution 3 - Javascriptraina77owView Answer on Stackoverflow
Solution 4 - JavascriptMichael EnitanView Answer on Stackoverflow
Solution 5 - JavascriptdecpkView Answer on Stackoverflow
Solution 6 - JavascriptKushan RandimaView Answer on Stackoverflow
Solution 7 - JavascriptHasan ZahranView Answer on Stackoverflow
Solution 8 - JavascriptTrilok SinghView Answer on Stackoverflow
Solution 9 - JavascriptUxonithView Answer on Stackoverflow
Solution 10 - JavascriptLuis SarazaView Answer on Stackoverflow
Solution 11 - JavascriptHemadri DasariView Answer on Stackoverflow
Solution 12 - JavascriptLen JosephView Answer on Stackoverflow
Solution 13 - JavascriptNETFLEXX josephView Answer on Stackoverflow
Solution 14 - JavascriptBrandon McConnellView Answer on Stackoverflow
Solution 15 - JavascriptZaheenView Answer on Stackoverflow
Solution 16 - Javascriptsudo bangbangView Answer on Stackoverflow
Solution 17 - JavascriptClydeView Answer on Stackoverflow
Solution 18 - JavascriptNakkeeranView Answer on Stackoverflow
Solution 19 - JavascriptShibin Mariyan StanlyView Answer on Stackoverflow
Solution 20 - JavascriptAneeq Fayyaz Karim MalikView Answer on Stackoverflow
Solution 21 - JavascriptLeon DecameView Answer on Stackoverflow