Q:
How to access elements inside function in JavaScript?
Here I am trying to access elements inside function and trying to use if/else condition for that. Below are my two snippets:
var data = [{name: 'A', color:'red'}, {name:'B', color: 'yellow'}];
var randomObject = function(data) {
if (data.length > 0) {
var key = data.randomIndex(); // generate random index for an array
var item = data[key]; // get random item
alert(item.name);
alert(item.color);
} else {
return false;
}}
console.log(randomObject(data));
The problem is, I can't access item.name inside else condition. I tried with alert(item.name); without else block and it worked.
Thanks in advance!
A:
The problem is, you're returning the randomValue function at the end of the if condition:
return false;
Change it to
} else {
return item;
}
A:
Here item is the value which you have passed in condition else it will return false which is falsy value.
Try this:
var data = [{name: 'A', color:'red'}, {name:'B', color: 'yellow'}];
var randomObject = function(data) {
if (data.length > 0) {
var key = data.randomIndex(); // generate random index for an array
var item = data[key]; // get random item
alert(item.name);
alert(item.color);
} else {
return item;
}}
console.log(randomObject(data));
https://jsfiddle.net/j6z4m4Lg/
A:
The problem is you're passing in an anonymous function which runs immediately, then return a boolean (it's still executing at this point) which then sets the return value of randomObject which you're alerting.
You should pass in the item, not the function.
Change it to this:
var data = [{name: 'A', color:'red'}, {name:'B', color: 'yellow'}];
var randomObject = function(data) {
if (data.length > 0) {
var key = data.randomIndex(); // generate random index for an array
var item = data[key]; // get random item
alert(item.name);
alert(item.color);
} else {
return item;
}
};
console.log(randomObject(data));
Now you can alert the name property.
Here's an example using anonymous functions to achieve the same thing as your original:
var data = [{name: 'A', color:'red'}, {name:'B', color: 'yellow'}];
var randomObject = function(data) {
for (var i=0; i < data.length; i++) {
var key = data[i].randomIndex(); // generate random index for an array
var item = data[key]; // get random item
if(item) {
alert(item.name);
alert(item.color);
} else {
return false;
}
}
};
console.log(randomObject(data));
And here's an example that returns a new object:
var data = [{name: 'A', color:'red'}, {name:'B', color: 'yellow'}];
var randomObject = function(data) {
var newObject = {};
for (var i=0; i < data.length; i++) {
var key = data[i].randomIndex(); // generate random index for an array
var item = data[key]; // get random item
newObject[item.name] = item;
}
return newObject;
};
console.log(randomObject(data));
And here's the object:
var data = [{name: 'A', color:'red'}, {name:'B', color: 'yellow'}];
var randomObject = function(data) {
var newObject = {};
for (var i=0; i < data.length; i++) {
var key = data[i].randomIndex(); // generate random index for an array
var item = data[key]; // get random item
newObject[item.name] = item;
}
return newObject;
};
console.log(randomObject(data));
newObject is defined as {}.
If you alert it, it will give you [object Object]. This object will have properties assigned by the item variables you passed into it.
