Javascript - Using condition with object and array

Question

I receive a data value from a API, and I want to make a condition to deal with it. Sometimes it can comes as an array or object. I will use a simple example.

data = [1,2,3] // These values come from API
data.map(i => i++)

The problem is: Sometimes data can also comes as this

    data = {
       arr: [1,2,3]
    }
    // It evals an error in .map, because now "data" is an object

I know that I can solve it making something like this:

if(Array.isArray(data))
 data.map(i => i++);
else
 data.arr.map(i => i++);

But my code is not just a one line .map. Is there a way to make this simple condition without copying and paste code?

Thanks!

Easiest and maintainable way would be to have a helper function function getData( data ) { return Array.isArray( data ) ? data : data.arr } and then use that everywhere getData( data ).map( i => i++ ) — Ivan Drinchev
– Ivan Drinchev, Commented Dec 11, 2018 at 11:41
@drinchev you should put your solution as an answer, I think your solution is better for me :) — Johnson
– Johnson, Commented Dec 11, 2018 at 12:02

Szab · Accepted Answer · 2018-12-11 11:41:52Z

3

You can for example assign the array reference to another variable and use it in the rest of your code, like this:

let arr = Array.isArray(data) ? data : data.arr;
arr.map(i => i++)

answered Dec 11, 2018 at 11:41

Szab

1,2638 silver badges18 bronze badges

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

Comments

Robby Cornelissen · Accepted Answer · 2018-12-11 14:27:31Z

2

A simple OR (||) operator is pretty idiomatic JavaScript:

(data.arr || data).map(i => ++i);

If the data.arr property is defined, that will be mapped, otherwise data itself will be mapped.

Complete snippet:
_{Note: the post-increment operator would have no effect, so I replaced it with a pre-increment.}

let data, result;

data = [1, 2, 3];

result = (data.arr || data).map(i => ++i);
console.log(result);

data = {
  arr: [1, 2, 3]
}

result = (data.arr || data).map(i => ++i);
console.log(result);

answered Dec 11, 2018 at 14:27

Robby Cornelissen

98.6k23 gold badges154 silver badges180 bronze badges

1 Comment

Johnson Over a year ago

The most clean solution to my problem. Thank you :) !!

ztadic91 · Accepted Answer · 2018-12-11 11:41:32Z

2

You can use the ternary operator.

Array.isArray(data)
? data.map(i => i++);
:  data.arr.map(i => i++);

answered Dec 11, 2018 at 11:41

ztadic91

2,8041 gold badge17 silver badges21 bronze badges

Comments

Qubaish Bhatti · Accepted Answer · 2018-12-11 11:57:32Z

2

You can use destruction es6 , not sure its a good idea but you can achieve your functionality in single line. ;)

let { arr=data } = data;
arr.map(i => i++)

if arr key is not found in data then it will assign default data array. Cheers

answered Dec 11, 2018 at 11:57

Qubaish Bhatti

7486 silver badges23 bronze badges

1 Comment

Nick Parsons Over a year ago

Nice, this is a great use of destructing assignment!

Code Maniac · Accepted Answer · 2018-12-11 11:44:12Z

1

You can do it like this

You can use the ternary operator and assign the value as array directly to temp if it is an Array and if not than you assign using the property like input.arr which is an Array.

So once the value is in form of array than you can use the single map statement so you need not to repeat your map statement.

let data = [1,2,3];
let data1 = {
       arr: [1,2,3]
    }
    
    
function handle(input){
  let temp = Array.isArray(input) ? input : input.arr
  return temp.map(i => i++);
}

console.log(handle(data))
console.log(handle(data1))

answered Dec 11, 2018 at 11:44

Code Maniac

37.9k5 gold badges44 silver badges65 bronze badges

Comments

Nick Parsons · Accepted Answer · 2018-12-11 12:15:54Z

1

If you don't wish to use an if or a ternary operator you can use Object.values(data).flat() to convert your data into:

[1, 2, 3]

This will essentially not modify your array and leave it be, however, it will compress your data object into an array form.

See working examples below:

Data form 1 (obj):

const data = {arr: [1, 2, 3]};
const res = Object.values(data).flat().map(i => ++i);
console.log(res);

Data form 2 (array):

const data = [1, 2, 3];
const res = Object.values(data).flat().map(i => ++i);
console.log(res);

Do note, however, Object.values does not guarantee order, and thus your array may lose its order. Moreover, if you plan to use this in production .flat() isn't yet supported across all browsers and instead, you may consider looking at a polyfill option

edited Dec 11, 2018 at 12:15

answered Dec 11, 2018 at 11:50

Nick Parsons

51.7k6 gold badges61 silver badges80 bronze badges

Collectives™ on Stack Overflow

Javascript - Using condition with object and array

6 Answers 6

Comments

1 Comment

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

1 Comment

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related