Accessing Simple Array values in javascript

Question

I am literally exhausted right now and failing to access simplest array values in javascript, Okay, i have printed console.log(dataArray)

Console Output:

[]
    account_level : "-"
    address : "-"
    atm_issued : "-"
    avatar : "-"
    branch : "-"
    cnic : "-"

This is what i am trying to access by this:

console.log(dataArray['cnic'])

By this

console.log(dataArray.cnic)

And by this

console.log(dataArray[cnic])

And if i do

console.log(dataArray.cnic)

It prints undefined

console.log(dataArray.length, dataArray instanceof Array, dataArray instanceof Object);

Output of above:

0 true true

How do I access this property?

Noman please add to your question the output of console.log(dataArray.length, dataArray instanceof Array, dataArray instanceof Object); — M0nst3R
– M0nst3R, Commented Sep 26, 2017 at 14:47
While you can add arbitrary properties to an array, it’s rather unconventional, which is why you get so many confused comments and answers. How is the data actually added to the array and when/how aren’t you trying to access it? I think you’re accesing the array before the properties have been added. — Felix Kling
– Felix Kling, Commented Sep 26, 2017 at 14:52
This only means that the properties exist at the time you expanded the array in the console, not at the time you are logging the array. The order of operations could very well be: 1. Log array. 2. Log property. 3. Add property. 4. Inspect array in console. — Felix Kling
– Felix Kling, Commented Sep 26, 2017 at 14:54
Noman if you don't mind also printing the output of console.log(dataArray.__proto__);. — M0nst3R
– M0nst3R, Commented Sep 26, 2017 at 14:56
Because when inspecting an object in the console it is evaluated when you expand it. By that time it may have changed. That is what the little blue i is telling you. — Felix Kling
– Felix Kling, Commented Sep 26, 2017 at 14:57

Mehdi Bouzidi · Accepted Answer · 2017-09-26 14:56:39Z

4

In your case you can't define an array like this beacause the syntax is not compatible.

I suggest you instead of this to use OBJECT SYNTAX as the following code snippet shows:

var obj={
 account_level : "DATA",
    address : "-",
    atm_issued : "-",
    avatar : "-",
    branch : "-",
    cnic : "-"
};

console.log(obj.account_level);

You can Also fill the object dynamically like this:

var obj={};

obj["address"] = "DATA1";
obj["atm_issued"] = "DATA2";
obj["avatar"] = "DATA3";
obj["branch"] = "DATA4";
obj["cnic"] = "DATA5";

console.log(obj.cnic);
console.log(obj);

edited Sep 26, 2017 at 14:56

answered Sep 26, 2017 at 14:41

Mehdi Bouzidi

2,0153 gold badges17 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Lix Over a year ago

That is not an array. It is an object. The OP's confusion probably stemmed from this misunderstanding.

Mehdi Bouzidi Over a year ago

@Lix can you take a look to my edit please & give me your feedback ?

Alex Over a year ago

its not json syntax. its object syntax.

Lix Over a year ago

@MehdiBouzidi - good edits! Definitely an improvement from your first version :)

Felix Kling Over a year ago

"In your case you can't define an array like this" One can easily do var arr = []; arr.cnic = 'foo';. The OP should not use an array for their purposes, but it's possible.

Paul Fitzgerald · Accepted Answer · 2017-09-26 14:40:54Z

2

The syntax you are using is how you would access an object.

let object = {
  account_level: "-"
  address: "-"
  atm_issued: "-"
  avatar: "-"
  branch: "-"
  cnic: "-"
};

console.log(object.cnic);

To access an array you use its index.

let array = ['Chelsea', 'Liverpool', 'Arsenal'];

console.log(array[0]);

answered Sep 26, 2017 at 14:40

Paul Fitzgerald

12.1k4 gold badges45 silver badges57 bronze badges

5 Comments

Felix Kling Over a year ago

"The syntax you are using is how you would access an object." Well, arrays are objects. If an array has a property cnic, then using array.cnic will work perfectly fine. After all, accessing array.length works fine too.

Paul Fitzgerald Over a year ago

@FelixKling you are correct that arrays are objects. What I don't understand is the second point If an array has a property cnic, then using array.cnic... in the example I provide if I do array.Chelsea ir returns undefined. How can an array have a property? Im confused :-S

Felix Kling Over a year ago

var arr = []; arr.Chelsea = 'foo';. In your example, array does not have a Chelsea property, it has the string value 'Chelsea' as one of it's elements. That's different.

Paul Fitzgerald Over a year ago

@FelixKling weird, i have never seen that before. Is that a new thing with JS, or has it been around for a long time? Do you have any link where I could read more about this

Felix Kling Over a year ago

It's been around for as long as arrays have been around. It's just not a common thing to do. I don't know of any specific resource that covers this in depth. Usually it is just explained with the fact that arrays are objects. And objects can have arbitrary properties.

Himan · Accepted Answer · 2017-09-26 15:38:43Z

1

JS arrays always have integers as index. If your key is a text, that means it is an object.

you can access an object these ways

var a = {key1 : "value1", key2 : "value2"};

//METHOD 1
console.log(a.key1);

//METHOD 2
console.log(a['key1']);

This is array

var a = ["value1","value2"];
console.log(a[0]);

edited Sep 26, 2017 at 15:38

answered Sep 26, 2017 at 14:43

Himan

3791 silver badge7 bronze badges

2 Comments

Felix Kling Over a year ago

Don’t use the term JSON when talking about JavaScript objects. It’s wrong and confusing.

Himan Over a year ago

agree. Removed.

Mayank Pandeyz · Accepted Answer · 2017-09-26 14:42:37Z

0

What you have specify is something like object not an array. In case of object the key:value pair are separated by , which is missing in your format. So the final format is like:

var obj = { "account_level" : "-",
    "address" : "-",
    "atm_issued" : "-",
    "avatar" : "-",
    "branch" : "-",
    "cnic" : "-" };
    
console.log(obj.cnic);

answered Sep 26, 2017 at 14:42

Mayank Pandeyz

26.3k4 gold badges43 silver badges61 bronze badges

1 Comment

Alex Over a year ago

he is printing the log, not defining so the format does not apply. and arrays are objects, also.

M0nst3R · Accepted Answer · 2017-09-26 15:03:49Z

0

It looks like something weird is going on with the way your array/object is being filled, please try creating a new one from it as follows :

dataArray = Object.assign({}, dataArray);
console.log(console.log(dataArray.cnic));

answered Sep 26, 2017 at 15:03

M0nst3R

5,3131 gold badge28 silver badges39 bronze badges

8 Comments

Felix Kling Over a year ago

How would that help? If dataArray doesn't have such a property, how does copying a non-existing property make it appear?

M0nst3R Over a year ago

But it exists from what the console log is showing.

Felix Kling Over a year ago

See my comment here. If it's not possible to access the property with dataArray.cnic, then won't be possible to access it after copying it.

M0nst3R Over a year ago

I do not know the internal workings of Object.assign but my reasoning was that maybe it would resolve this kind of weird glitch he is facing. Ok sure he cannot access the property directly but the console still sees it.

Felix Kling Over a year ago

As I said in the comment, that's most likely because at the time they expand the value in the console, it will have those properties. At that time they could access them via dataArray.cnic as well. Try this in the console: var obj1 = {}; console.log(obj1); var obj2 = Object.assign({}, obj1); obj1.foo = 42; console.log(obj2);. Notice how expanding obj1 shows the property (even though it could not have possibly existed at the time we logged the object) and obj2 does not.

|

Noman Ali · Accepted Answer · 2017-09-27 08:25:21Z

0

It was a pain, but i was using firebase, and accessing properties before they were being populated. So first i have let them be populated then access them.

answered Sep 27, 2017 at 8:25

Noman Ali

3,36014 gold badges48 silver badges79 bronze badges

Collectives™ on Stack Overflow

Accessing Simple Array values in javascript

6 Answers 6

5 Comments

5 Comments

2 Comments

1 Comment

8 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

5 Comments

5 Comments

2 Comments

1 Comment

8 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related