Array Operations

1. Overview

Summarize array operations, such as pop, push, shift, unshift, splice, slice, and split in javascript

 

2. Description

var a = [1, 2, 3];                                                                                                                                                                                          
var b = a.unshift(0);
console.log(a); //[0, 1, 2, 3]
console.log(b); //4

var a = [1, 2, 3];
var b = a.shift();
console.log(a); //[2, 3]
console.log(b); //1
var b = a.shift(2);
console.log(a); //[3]
console.log(b); //2, only one element is shifted

var a = [1, 2, 3];
var b = a.pop();
console.log(a); //[1, 2]
console.log(b); //3
var b = a.pop(2);
console.log(a); //[1]
console.log(b); //2, only one element is poped

var a = [1, 2, 3];
var b = a.push(4);
console.log(a); //[1, 2, 3, 4]
console.log(b); //4

 

• If deleteCount is 0 or negative, no elements are removed.

 

• Difference between splice and slice

Features	Slice	Splice
Description	Will return a new array with a smaller version of the original array. You have to specify the starting and ending index from where you want to cut the array.	Will update the current array leaving everything but the smaller version that you want to remove. You will need to specify the starting and ending indexes from where you want to remove.
Alter original array	No	Yes
Return	An array containing the deleted also said extracted, elements	A shallow copy of elements from the original
Arguments	start(optional), end(optional. Not included)	start(essential), deleteCount(optional), items(optional. such as item1, item2, ...)
Notes	A negative index indicates an offset from the end of the sequence If begin is undefined, begins from index 0 If begin is greater than the length of the sequence, an empty array is returned If end is omitted or greater than the length of a sequence, extracting through the end of the sequence(arr.length)	If the absolute value of start is greater than the length of the array, begins from index 0 If deleteCount is 0 or negative, no elements are removed. If deleteCount is omitted, or if its value is equal to or larger than array.length - start, then all the elements from start to the end of the array will be deleted.  If items array are omitted, only removing occurs

• splice

• Syntax

var arrDeletedItems = array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

• Add and Replacement

var months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'June']

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'May']

• Cut

var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
var removed = myFish.splice(2, 2);

// myFish is ["parrot", "anemone", "sturgeon"] 
// removed is ["blue", "trumpet"]

• Negative Index

let tesla = ['Model S', 'Model X', 'Model 3'];
let removedItem = tesla.splice(-1); // negative index means 

console.log(tesla); // Model S, Model X
console.log(removedItem); // Model 3

var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
var removed = myFish.splice(-2, 1);

// myFish is ["angel", "clown", "sturgeon"] 
// removed is ["mandarin"]

 

• slice

• Syntax

arr.slice([begin[, end]])

• Cut

var animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

 

• Negative index

string.slice(-5) // slice
string.slice(0) // slice

string.slice(-5,-3) // "sli"

string.slice(-5,-1) // "slic"
string.slice(-1) // "e"

 

3. Application to data structure

• Stack

var stack = [];
stack.push(2);       // stack is now [2]
stack.push(5);       // stack is now [2, 5]
var i = stack.pop(); // stack is now [2]
alert(i);            // displays 5

• Queue

var queue = [];
queue.push(2);         // queue is now [2]
queue.push(5);         // queue is now [2, 5]
var i = queue.shift(); // queue is now [5]
alert(i);              // displays 2

 

4. References

https://maeharin.hatenablog.com/entry/20130122/unshift_shift_pop_push

https://stackoverflow.com/questions/37601282/javascript-array-splice-vs-slice

https://content.breatheco.de/lesson/what-is-an-array-define-array

https://stackoverflow.com/questions/1590247/how-do-you-implement-a-stack-and-a-queue-in-javascript

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

https://appdividend.com/2018/12/18/javascript-array-splice-example-array-prototype-splice-tutorial/

https://www.arungudelli.com/tutorial/javascript/javascript-string-substring-vs-string-substr-vs-string-slice-differences/