Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

Find object in array

25 views
Skip to first unread message

Andrew Poulos

unread,
Jul 16, 2017, 5:00:52 AM7/16/17
to
The server returns a string which I parse. It becomes an array of
"simple" objects eg.
{
"id":1,
"colour": "#fff",
"width": 320,
"height":240
}

To find an object with a specific "id" I use a for loop on the array.
This is ok but now the arrays I'm getting contain 10s of objects. What
better way can I use to find a specific object?

Andrew Poulos

Martin Honnen

unread,
Jul 16, 2017, 5:11:20 AM7/16/17
to
If you have an array "a" and want to find items meeting a specific
condition then you can use
a.filter(o => o.id == 1)
to get an array of those objects meeting the filter condition.

var a = [{id: 1, data: 'foo'}, {id: 2, data: 'bar'}, {id:1, data: 'baz'}];
a.filter(o => o.id == 1)



Andrew Poulos

unread,
Jul 16, 2017, 5:14:43 AM7/16/17
to
Doh, I just realised that I can use filter.

On a related question would it be "faster" to use a for loop, instead of
multiple filters, if I needed to find a number of objects?

Andrew Poulos

Dr J R Stockton

unread,
Jul 16, 2017, 6:13:45 PM7/16/17
to
It is not an array of simple objects; it is an object with
properties. If it was an array, it would have the special
'length' property.

Demo :

var Q = {
"id":1,
"colour": "#fff",
"width": 320,
"height":240
}

Q["width"] // = 320

--
(c) John Stockton, near London, UK. Using Google, no spell-check. |
Mail: J.R.""""""""@physics.org |

Thomas 'PointedEars' Lahn

unread,
Jul 16, 2017, 7:30:49 PM7/16/17
to
You would not need multiple .filter() calls to find a number of objects.

As to whether .filter() would be faster than a “for” loop, you should test
it. A “for” loop should be faster, because it does not incur performance
costs for calling the function and resolving identifiers along a longer
scope chain.

BTW, this wheel has been invented before, and it has been called “Language-
Integrated Query (LINQ)”. Also, my JSX:array.js:jsx.array.createFilter()
helps you generate a filter callback for filtering objects.

--
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

Andrew Poulos

unread,
Jul 17, 2017, 12:49:24 AM7/17/17
to
On 17/07/2017 8:13 AM, Dr J R Stockton wrote:
> On Sunday, July 16, 2017 at 10:00:52 AM UTC+1, Andrew Poulos wrote:
>> The server returns a string which I parse. It becomes an array of
>> "simple" objects eg.
>> {
>> "id":1,
>> "colour": "#fff",
>> "width": 320,
>> "height":240
>> }
>>
>> To find an object with a specific "id" I use a for loop on the array.
>> This is ok but now the arrays I'm getting contain 10s of objects. What
>> better way can I use to find a specific object?
>
> It is not an array of simple objects; it is an object with
> properties. If it was an array, it would have the special
> 'length' property.
>
> Demo :
>
> var Q = {
> "id":1,
> "colour": "#fff",
> "width": 320,
> "height":240
> }
>
> Q["width"] // = 320

My bad for being ambiguous. The example was of a simple object (that is
an element of the array) and not of the array itself.

Andrew Poulos

Evertjan.

unread,
Jul 17, 2017, 7:53:38 AM7/17/17
to
Andrew Poulos <ap_...@hotmail.com> wrote on 17 Jul 2017 in
comp.lang.javascript:
No, that is not an array.

An array has non-negative integer numbered members and a 'length'-property,
and can be given other properties that do not affect [and be affected by]
the length-value.

'use strict';

let a = ['q','w','e',,,'five'];
a[17] = 'top';
a.once = '1x';
a['twice'] = '2x';

alert(a[1]); // w
alert(a[5]); // five
alert(a[17]); // top
alert(a['length']); // 17
alert(a['once']); // 1x
alert(a.twice); // 2x

a.length = 999;
alert(a['length']); // 999

alert(a[2]); // e
a.length = 2;
alert(a[2]); // undefined



--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Ben Bacarisse

unread,
Jul 17, 2017, 9:29:31 AM7/17/17
to
"Evertjan." <exxjxw.h...@inter.nl.net> writes:

> Andrew Poulos <ap_...@hotmail.com> wrote on 17 Jul 2017 in
> comp.lang.javascript:
<snip>
>> My bad for being ambiguous. The example was of a simple object (that is
>> an element of the array) and not of the array itself.

Your post was clear so I don't think you need to apologise, but I
suppose it might smooth things over.

> No, that is not an array.

Indeed, but the OP never said it was! The original post was quite clear
(at least to me) but now replies to the unnecessary corrections are
being corrected! It's got so meta it has nothing to do with the
original question.

<snip>
--
Ben.

JR

unread,
Jul 17, 2017, 11:47:53 AM7/17/17
to
Great!

Another possibility is the find() method [1]:

a.find(el => el.id === 1);

[1]
<https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find>


--
Joao Rodrigues

Thomas 'PointedEars' Lahn

unread,
Jul 17, 2017, 2:06:39 PM7/17/17
to
JR wrote:

> Martin Honnen wrote:
>> If you have an array "a" and want to find items meeting a specific
>> condition then you can use
>> a.filter(o => o.id == 1)
>> to get an array of those objects meeting the filter condition.
>>
>> var a = [{id: 1, data: 'foo'}, {id: 2, data: 'bar'}, {id:1, data:
>> 'baz'}]; a.filter(o => o.id == 1)
>
> Great!
>
> Another possibility is the find() method [1]:
>
> a.find(el => el.id === 1);
>
> [1]
> <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find>

In contrast to .filter(), .find() does not return a reference to a new Array
instance of matching elements (here: object references), but only the first
matching element.

JR

unread,
Jul 18, 2017, 12:02:57 PM7/18/17
to
On 16-07-2017 06:00, Andrew Poulos wrote:
> The server returns a string which I parse. It becomes an array of
> "simple" objects eg.
> {
> "id":1,
> "colour": "#fff",
> "width": 320,
> "height":240
> }

It seems this app is using some form of "Virtual DOM", or just assigning
styles (Properties / Values) to a given HTML element. In any case, it
would be better using standard CSS property names, e.g "color" instead
of "colour", and strings for width / height values such as "320px" or
"240px". That's because it would be easier to assign styles to an element:

E.g.
var el = document.getElementById("1");
el.style.cssText = "color:#fff;width:320px;height:240px;";

Or:

Object.assign(el.style,
{
"color": "#fff",
"width": "320px",
"height": "240px"
}
);


> To find an object with a specific "id" I use a for loop on the array.
> This is ok but now the arrays I'm getting contain 10s of objects. What
> better way can I use to find a specific object?

As Martin Honnen suggested, you might use the Array's filter() method to
get an array of those objects meeting the filter condition.

However if "id" references a unique element, you'd be ok with the find()
method too. Look up these two Array methods in the MDN:
<https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array>

--
Joao Rodrigues
0 new messages