How do I Remove duplicates from an array in Javascript?

javascript array loop

[Tizzydev]

I call a RESTAPI which returns a json encoded array.
When I open the API URl directly in browser it returns
the correct number of elements - no repetition, but
on calling the API in a script and using Javascript to loop
through the returned array, the elements are printed out twice,
it's like the loop the loop runs twice, I've checked and checked
but don't know why.

Now,I'm trying to loop through the array and not print out an element
if it is already printed with a script like this, but it doesn't seem to
work, how do I re-write the script.

<script>
var holdit = [];
$.each(myArray, function(key, value) {

if($.inArray(key, holdit)) == -1;
{
alert( "The key is '" + key + "' and the value is '" + value + "'" );
holdit.push(key);
}
});
</script>

[robzilla]

the elements are printed out twice,
it's like the loop the loop runs twice, I've checked and checked
but don't know why.

Wouldn't it be better to try to solve that bit directly rather than putting a band-aid on it with another script?

[NickMNS]

Robzilla is right, deal will the cause of the problem not the symptom. My guess is that you are likely making the RESTapi call twice, either twice at the same time, or making the request at two separate instances and adding the result of each request to the end of the previous one. Use your "developer tools" in your browser. Check to see how many times the request to the REST endpoint then check what was returned. Then check the object itself.

First you say:

...but on calling the API in a script and using Javascript to loop through the returned array,

Your are not dealing with an array but an object (key:value pairs, at least that is what your code suggests). Is it possible that the loop you are using is calling keys twice. To loop through an object you can use the Object.keys method. [developer.mozilla.org...]

for (const key of Object.keys(myObject)) {
  console.log( "The key is " + key + " and the value is " + myObject[key] );
  // do something else with the object....
}

Try this and check the result.

[Fotiman]

Hard to tell exactly without seeing all of the code, but as mentioned above, it sounds like you may want to visit where the code is requesting the API data, and where you're "printing it out" (does that mean adding it to the DOM, or does that mean outputting to the browser console?). In your page, open the browser developer tools (press F12 in Chrome) and open the Network tab. Determine if the request is being sent to your REST endpoint more than once. If not, then where you're "printing" the values should be inspected to see if that's being called in multiple places.

Additionally, I would suggest not using `$.each` for iterating over your array. Native array methods can do this without requiring a 3rd party dependency.
[developer.mozilla.org...]

[Tizzydev]

Thanks. Fixed.