let arr1 = ["😀", "👽", "🤖", "👻"];
// Copy from index 1 to the end
// This returns ["👽", "🤖", "👻"]
let arr2 = arr1.slice(1);
// Copy from index 1 to index 3 (not including 3)
// This returns ["👽", "🤖"]
let arr3 = arr1.slice(1, 3);
console.log("arr1: ", arr1);
console.log("arr2: ", arr2);
console.log("arr3: ", arr3);
The splice() method can both add and remove elements from anywhere inside the array. It takes a start index, a number of elements to delete, and then optionally extra parameters of elements to insert at the index.
let arr = ["😀", "👽", "🤖", "👻"];
console.log(`Starting array: ${arr.join(",")}`);
// splice(1, 2) means deletes 2 elements from index 1
arr.splice(1, 2);
// Array is now: ["😀", "👻"]
console.log(`After deleting 2 elements: ${arr.join(",")}`);
// splice(1, 0, "👽", "🤖") means from index 1, don't delete
// anything (as we provide 0 for the number of elements to
// delete), and insert elements "👽" and "🤖".
// So this adds back the elements that were deleted.
arr.splice(1, 0, "👽", "🤖");
// Array is now: ["😀", "👽", "🤖", "👻"]
console.log(`After adding 2 elements: ${arr.join(",")}`);
// We can also simultaneously delete and insert elements.
// This time we delete 2 elements and insert 2 elements,
// replacing the middle two elements with different emoji.
arr.splice(1, 2, "👾", "🎉");
// Array is now: ["😀", "👾", "🎉", "👻"]
console.log(`After replacing 2 elements: ${arr.join(",")}`);
The sort() method sorts the elements in the array in ascending order, using text-based alphabetical order by default.
let arr = ["beta", "alpha", "gamma"];
arr.sort();
// Array is now: ["alpha", "beta", "gamma"]
console.log(`Sorted array: ${arr.join(",")}`);
Note the default text-based alphabetical order is not suitable for numbers: with this ordering sorting "1", "2" and "10" will result in "1", "10", "2", which is correct alphabetically, but not numerically. To do a numeric sort, the method optionally accepts a function that compares two elements. The method must return a negative number if the first parameter is ordered first, a positive number if the second parameter is ordered first, or 0 if they have the same order. The easiest way to do this is with an arrow function that just subtracts the parameters.
let arr = [10, 2, 1, 7, 12, 8];
arr.sort((a, b) => a - b);
// Array is now: [1, 2, 7, 8, 10, 12]
console.log(`Sorted array: ${arr.join(",")}`);
Another case where using a function to modify arrays is the map method. This calls a function on every element on the array, and creates a new array with the return value of the function.
let arr1 = ["😀", "👽", "🤖", "👻"];
console.log(`Starting array: ${arr1.join(",")}`);
// map() will call the function on every element in the array.
// The function adds "🎉" to the end of the string.
// It then returns a new array with the return values of the
// function - so every element has "🎉" added on the end.
let arr2 = arr1.map(elem => elem + "🎉");
// arr2 is now: ["😀🎉", "👽🎉", "🤖🎉", "👻🎉"]
console.log(`Mapped array: ${arr2.join(",")}`);
Finally reduce() uses a method to combine together all the elements in the array. It's useful for things like summing all the numbers in an array. It accepts a function that is called for every element to combine it - in this case just adding to a total. It also takes a starting value, which is useful in case the array is empty (since then there would be nothing to combine).
let arr = [1, 2, 3, 4];
// Sum every element in the array.
// Note 0 is also passed as the starting value.
let sum = arr.reduce((total, current) => total + current, 0);
console.log(`Sum of array: ${sum}`);
There's lots more you can do with arrays in JavaScript. See the Array MDN documentation for more.