Best IT Recipes

How to get array keys in javascript?

I have an array created using this code:

var widthRange = new Array(); widthRange[46] = { min:0, max:52 }; widthRange[66] = { min:52, max:70 }; widthRange[90] = { min:70, max:94 };

I want to get each of the values ​​46, 66, 90 in a loop. I tried for (var key in widthRange) , but that gives me a whole bunch of extra properties (I assume they are functions of the object). I cannot use a regular loop because the values ​​are not sequential.

+64
javascript arrays key
Mar 24 '10 at 16:26
source share
11 answers

You need to call the hasOwnProperty function to check if the property is really defined on the object itself (as opposed to its prototype), like this:

 for (var key in widthRange) { if (key === 'length' || !widthRange.hasOwnProperty(key)) continue; var value = widthRange[key]; }

Note that you need a separate check for length .
However, you should not use an array here at all; you should use a regular object. All Javascript objects function as associative arrays.

For example:

 var widthRange = { }; //Or new Object() widthRange[46] = { sel:46, min:0, max:52 }; widthRange[66] = { sel:66, min:52, max:70 }; widthRange[90] = { sel:90, min:70, max:94 };
+84
Mar 24 '10 at 16:29
source share

String keys can be requested using Object.keys(array) .

+53
Jan 15 '14 at 1:24
source share

If you are doing any kind of manipulation or validation of an array / collection, I highly recommend using Underscore.js . It is small, proven and will save you days / weeks / years of JavaScript headache. Here is its function:

Keys

Get all object property names.

 _.keys({one : 1, two : 2, three : 3}); => ["one", "two", "three"]
+18
Nov 08 '11 at 18:17
source share
 for (var i = 0; i < widthRange.length; ++i) { if (widthRange[i] != null) { // do something } }

You cannot get only the keys that you set, because that is not how the array works. After you set element 46, you will also set 0-45 (although they are zero).

You can always have two arrays:

 var widthRange = [], widths = [], newVal = function(n) { widths.push(n); return n; }; widthRange[newVal(26)] = { whatever: "hello there" }; for (var i = 0; i < widths.length; ++i) { doSomething(widthRange[widths[i]]); }

change , maybe I'm all wet here ...

+3
Mar 24 '10 at 16:29
source share

Tell me what your array looks like arr = [ { a: 1, b: 2, c: 3 }, { a: 4, b: 5, c: 6 }, { a: 7, b: 8, c: 9 } ] (or perhaps other keys), you can do

 arr.map((o) => { return Object.keys(o) }).reduce((prev, curr) => { return prev.concat(curr) }).filter((col, i, array) => { return array.indexOf(col) === i });

["a", "b", "c"]

+2
Dec 01 '15 at 11:59
source share
 widthRange.map(function(_, i) { return i });

or

 widthRange.map((_, i) => i);
+2
Jun 09 '16 at 14:33
source share

Your original example is great for me:

 <html> <head> </head> <body> <script> var widthRange = new Array(); widthRange[46] = { sel:46, min:0, max:52 }; widthRange[66] = { sel:66, min:52, max:70 }; widthRange[90] = { sel:90, min:70, max:94 }; var i = 1; for (var key in widthRange) { document.write("Key #" + i + " = " + key + "; &nbsp;&nbsp;&nbsp; min/max = " + widthRange[key].min + "/" + widthRange[key].max + "<br />"); i++; } </script> </html>

Results in a browser (Firefox 3.6.2 on Windows XP):

 Key #1 = 46; min/max = 0/52 Key #2 = 66; min/max = 52/70 Key #3 = 90; min/max = 70/94
+1
Mar 24 '10 at 16:31
source share

I think you should use Object ( {} ), not an array ( [] ) for this.

Each key has a data set associated with it. He screams about using the object. At:

 var obj = {}; obj[46] = { sel:46, min:0, max:52 }; obj[666] = { whatever:true }; // This is what for..in is for for (var prop in obj) { console.log(obj[prop]); }

Maybe some useful things like this can help:

 window.WidthRange = (function () { var obj = {}; return { getObj: function () {return obj;} , add: function (key, data) { obj[key] = data; return this; // enabling chaining } } })(); // Usage (using chaining calls): WidthRange.add(66, {foo: true}) .add(67, {bar: false}) .add(69, {baz: 'maybe', bork:'absolutely'}); var obj = WidthRange.getObj(); for (var prop in obj) { console.log(obj[prop]); }
+1
Mar 24 '10 at 16:53
source share

Seems to work.

 var widthRange = new Array(); widthRange[46] = { sel:46, min:0, max:52 }; widthRange[66] = { sel:66, min:52, max:70 }; widthRange[90] = { sel:90, min:70, max:94 }; for (var key in widthRange) { document.write(widthRange[key].sel + "<br />"); document.write(widthRange[key].min + "<br />"); document.write(widthRange[key].max + "<br />"); }
0
Mar 24 '10 at 16:35
source share

I wrote a function that works great with every instance of objects (arrays are those).

 Object.prototype.toArray = function() { if(!this) { return null; } var c = []; for (var key in this) { if ( ( this instanceof Array && this.constructor === Array && key === 'length' ) || !this.hasOwnProperty(key) ) { continue; } c.push(this[key]); } return c; };

Using:

 var a = [ 1, 2, 3 ]; a[11] = 4; a["js"] = 5; console.log(a.toArray()); var b = { one: 1, two: 2, three: 3, f: function() { return 4; }, five: 5 }; b[7] = 7; console.log(b.toArray());

Output:

 > [ 1, 2, 3, 4, 5 ] > [ 7, 1, 2, 3, function () { return 4; }, 5 ]

It can be useful for everyone.

0
Jun 02 2018-12-12T00:
source share

... ????

Alternatively, if you have a list of items that you want to use ...

 var range = [46, 66, 90] , widthRange=[] , write=[]; widthRange[46] = { min:0, max:52 }; widthRange[66] = { min:52, max:70 }; widthRange[90] = { min:70, max:94 }; for(var x=0; x<range.length; x++){var key, wr; key = range[x]; wr = widthRange[key] || false; if(wr===false){continue;} write.push(['key: #',key, ', min: ', wr.min, 'max:', wr.max].join('')); }
0
Feb 13 '14 at 15:02
source share


More articles:


All Articles