concat two arrays javascript using spread operator code example
Example 1: javascript array concat spread operator
const arr1 = [1,2,3]
const arr2 = [4,5,6]
const arr3 = [...arr1, ...arr2] //arr3 ==> [1,2,3,4,5,6]
Example 2: javascript merge two array with spread operator
const a = ['to', 'code'];
const b = ['learning', ...a, 'is', 'fun'];
console.log(b); //> ['learning', 'to', 'code', 'is', 'fun']
Example 3: combining two arrays using spread syntax
////////////////////////////////////////////////////////////////////
////// SPREAD SYNTAX ///// Dead Milkmen Lyrics "Punk Rock Girl" ////
// combining two arrays and multiple items using spread syntax
// Javascript [...spreadSyntax,] lets you pull out or ("spread")
// a copy of what's inside the array or object
// it can also be used to create a new array or object
// EXAMPLE: [...combining, ...twoArrays]
// hit alt / command j or option / command j
// array 1 type
const firstArray = ["just", "you", "and", "me"];
// array 2 type
const secondArray = ["punk", "rock", "girl"];
// (hit return) to store the arrays
// combine them into a new array using a syntax
// [...arrayName, ...arrayName];
const newArray = [...firstArray, ...secondArray];
// (hit return) The items get spread out
// then combined together
// call your third Array then (hit return)
newArray
// answer
(7) ["just", "you", "and", "me", "punk", "rock", "girl"]
// This could also be done with an array and an "added string"
const sillyString = ["We'll dress like Minnie Pearl ", ...newArray];
// (hit return) then call sillyString
sillyString
// (hit return) answer should be
(8) ["We'll dress like Minnie Pearl ", "just", "you", "and", "me", "punk", "rock", "girl"]
// You can spread and combine all
// sorts of silly data that you
// normally store in an array
// add another string for fun
const longString = ["And security guards trailed us to a record shop We asked for Mojo Nixon They said he don't work here We said if you don't got Mojo Nixon then your store could use some fixin"];
const moreStuff = [...sillyString, "We went", 2, "a shopping mall", "and", { someProperty: "laughed at all the shoppers" }, ...longString];
// RESULT
// call moreStuff
moreStuff
/* RESULT //////////////////////////
(14) ["We'll dress like Minnie Pearl ",
"just", "you", "and", "me", "punk", "rock", "girl",
"We went", 2, "a shopping mall", "and", {…},
"And security guards trailed us to a record shop
We…t Mojo Nixon then your store could use some fixin"]
0: "We'll dress like Minnie Pearl "
1: "just"
2: "you"
3: "and"
4: "me"
5: "punk"
6: "rock"
7: "girl"
8: "We went"
9: 2
10: "a shopping mall"
11: "and"
12: {someProperty: "laughed at all the shoppers"}
13: "And security guards trailed us to a record shop
We asked for Mojo Nixon They said he don't work here
We said if you don't got Mojo Nixon
then your store could use some fixin"
length: 14
__proto__: Array(0)
*/