What will be the functional approach to add an Array(destructured) into Set

Question

I want to add some array (their contents only) in Set. Like:

My array :

var arr1 = [55, 44, 65];
var arr2 = [22, 11, 33];

I want my Set to be : [55, 44, 65, 22, 11, 33]

What I've tried:

var arr1 = [55, 44, 65];
var arr2 = [22, 11, 33]
var set = new Set();
set.add(arr1)
set.add(arr2)
set.add([8, 5])
console.log(set);

It adds three array in sets Instead of individual numbers.

So, I also tried doing this: JSFiddle

var arr1 = [55, 44, 65];
var arr2 = [22, 11, 33]
var set = new Set();
set.add(...arr1)
set.add(...arr2)
set.add(...[8, 5])
console.log(set);

However, It only adds the first elements of the array into Set.

My question is in my second approach why only first element of array gets added in the Set?
How can I add all the elements of the array into the set without iterating through every one of array elements and adding them to Set (like using for , map or forEach)? (If it is possible)

NOTE: In my actual problem I do not get all the arrays at once.

How about var set = new Set(arr1.concat(arr2, [8, 5]))? Updated fiddle — Rajesh Dixit
– Rajesh Dixit, Commented Feb 21, 2018 at 5:01
var set = new Set([...arr1, ...arr2, 8, 5]); or var set = new Set([...arr1, ...arr2, ...[8, 5]]); if you want to clearly define the 3 arrays — Jaromanda X
– Jaromanda X, Commented Feb 21, 2018 at 5:03
@JaromandaX In my actual problem I do not get all the arrays at once. — Niladri Basu
– Niladri Basu, Commented Feb 21, 2018 at 5:06
or ... some monkey patching badness ... Set.prototype.addMulti = function(...args) { [...args].forEach(x => this.add(x));}; ... then use set.addMulti(...arr1) — Jaromanda X
– Jaromanda X, Commented Feb 21, 2018 at 5:11

Rajesh Dixit · Accepted Answer · 2018-02-21 05:45:42Z

5

As commented, you can try

var set = new Set(arr1.concat(arr2, [8, 5]))

You can test it here.

However, It only adds the first elements of the array into Set.

If you refer docs, it says, .add takes only 1 argument. So when you do ...[8, 5], it spreads and adds first value and ignores remaining.

In my actual problem I do not get all the arrays at once.

Here, you can convert the set back to array and create new Set:

var set2 = new Set(Array.from(set).concat([8, 5]))

You can check it here

You can also use spread operator like:

var set2 = new Set([...set].concat([8, 5]))

Updated Fiddle to test it, but as a personal preference, I prefer Array.from as its more readable. You can choose any way you like.

edited Feb 21, 2018 at 5:45

answered Feb 21, 2018 at 5:10

Rajesh Dixit

25k5 gold badges52 silver badges86 bronze badges

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

2 Comments

Bergi Over a year ago

Spread syntax (not "destructuring"!) only makes sense when having other elements in the array literal, Array.from(set) should be preferred over [...set] indeed. But we do have concatenated values here, so new Set([...set, 8, 5]) it is.

T.J. Crowder Over a year ago

Note: ... isn't, and can't be, an operator, neither when used for spread nor rest. It does things operators cannot do. Details.

Amadan · Accepted Answer · 2018-02-21 05:29:49Z

2

If you do not wish to create a new set, there is nothing wrong about a loop:

var arr1 = [55, 44, 65];
var arr2 = [22, 11, 33]
var set = new Set();
var setAdd = set.add.bind(set);
arr1.forEach(setAdd);
arr2.forEach(setAdd);
[8, 5].forEach(setAdd);
console.log(Array.from(set)); // StackOverflow snippet console can't print sets yet
// [55, 44, 65, 22, 11, 33, 8, 5]

answered Feb 21, 2018 at 5:29

Amadan

200k23 gold badges252 silver badges321 bronze badges

Comments

beewall · Accepted Answer · 2018-02-21 05:37:38Z

2

As @Rajesh said, I believe you could concatenate the arrays into one, and create a set from that.

var set = new Set(arr1.concat(arr2.concat([8, 5])));

EDIT: To add another array afterwards, you could probably then make a new set when you add each one, and concatenate them as seen here.

set = new Set([...set, ...newSet])

Or

set = new Set(Array.from(set).concat(Array.from(newSet)))

So full example:

var arr1 = [55, 44, 65];
var arr2 = [22, 11, 33];
var set = new Set(arr1.concat(arr2.concat([8, 5])));
var arr3 = [10, 20];
var newSet = new Set(arr3);
set = new Set(Array.from(set).concat(Array.from(newSet)));
set.forEach(function(element) {
  console.log(element);
});

Outputs:

> 55
> 44
> 65
> 22
> 11
> 33
> 8
> 5
> 10
> 20

edited Feb 21, 2018 at 5:37

answered Feb 21, 2018 at 5:05

beewall

1412 silver badges11 bronze badges

6 Comments

Niladri Basu Over a year ago

In my actual problem I do not get all the arrays at once.

beewall Over a year ago

@BlackBeard you could probably then make a new set when you add each one, and concatenate them as seen here.

Bergi Over a year ago

@BlackBeard If you don't get all the arrays at first, you cannot immediately create your set from them. If you need to do that, there's now way around imperatively adding the items later.

Rajesh Dixit Over a year ago

@PorygonZRocks Thank you for crediting but as you may have read, this is a partial answer. OP has clarified all arrays are not there at the start. This makes suggested approach appropriate for comments and not answer

beewall Over a year ago

@Rajesh OP had not yet clarified that when I posted, or at least not when I started writing.

|

Collectives™ on Stack Overflow

What will be the functional approach to add an Array(destructured) into Set

3 Answers 3

2 Comments

Comments

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related