Arrays Notebook

Take Quiz

Arrays

JavaScript arrays are objects.

IN [ ]
const fruits = ["Banana", "Orange", "Apple", "Mango"];
console.log(
  "typeof fruits = " + typeof fruits
)
IN [ ]
// toString() join() concat()
console.log(
  " fruits = " + fruits+
  "\n toString() = " + fruits.toString()+
  "\n join(',,') = " + fruits.join(',,')+'      #custom seperator'+
  "\n concat(['Kiwi']) = " + fruits.concat(['Kiwi'])
)
IN [ ]
// flat()
let nested = [[1, 2, 3], [4, 5, 6], [7, 8, 9, [10, 11, 12]]];
console.log(
  "nested = " + nested+
  "\n flat() = " + nested.flat()
)
IN [ ]
// sort()
console.log(
  "sort() = " + fruits.sort()
)

Mnemonic: VIA = value, index, array

IN [ ]
// forEach()
let str='';
fruits.forEach(function (value, index, array) {
  str += value + " ";
});
console.log("forEach() = " + str);
IN [ ]
// forEach(function)
let str='';
function myFunction(value, index, array) {
  str += value + " ";
}
fruits.forEach(myFunction);
console.log("forEach(myFunction) = " + str);
IN [ ]
// pop() and push() & shift() and unshift()
// delete
let arr = [1, 2, 3, 4, 5];
console.log(
  " arr = " + arr+
  "\n pop() = " + arr.pop()+ '  ' + "arr = " + arr+
  "\n push(6) = " + arr.push(6)+ '  ' + "arr = " + arr+
  "\n shift() = " + arr.shift()+ '  ' + "arr = " + arr+
  "\n unshift(0) = " + arr.unshift(0) + '  ' + "arr = " + arr+
  "\n unshift(5) = " + arr.unshift(5) + '  ' + "arr = " + arr+
  "\n delete arr[2] = " + delete arr[2]+ '  ' + "arr = " + arr
)
IN [ ]
// isArray() & instanceof()
console.log(
  "isArray() = " + Array.isArray(fruits)+
  "\n instanceof() = " + (fruits instanceof Array)
)
IN [ ]
// slice(startIndex, endIndex) & splice(startIndex, numberOfElements) splice literally removes elements from an array
// splice can insert intermediate elements along with the removed elements immediate next to the added elements
let cutting = [1, 2, 3, 4, 5];
console.log(
  " cutting = " + cutting+
  "\n slice(1, 4) = " + cutting.slice(1, 4)+ '  ' + "cutting = " + cutting+'    # slice() returns array object'+
  "\n typeof slice(1, 4) = " + typeof cutting.slice(1, 4)+ '  ' + 
  "\n splice(1, 3) = " + cutting.splice(1, 3)+ '  ' + "cutting = " + cutting+
  "\n splice(1, 0, 6, 7) = " + cutting.splice(1, 0, 6, 7)+ '  ' + "cutting = " + cutting + '     # adds 6, 7 at index 1 removes 0 elements'+
  "\n splice(2, 1, 8, 9) = " + cutting.splice(2, 1, 8, 9)+ '  ' + "cutting = " + cutting + '     # adds 8, 9 at index 2 removes 1 elements'
)
IN [ ]
// toSpliced() does not alter original array
const months = ["Jan", "Feb", "Mar", "Apr"];
const spliced = months.toSpliced(0, 1); // from index 0, remove 1 element
console.log(
  "months = " + months+
  "\n spliced = " + spliced
)
IN [ ]
// indexOf() & lastIndexOf() includes()
console.log(
  " fruits = " + fruits+
  "\n indexOf('Apple') = " + fruits.indexOf('Apple')+
  "\n indexOf('nonexistent') = " + fruits.indexOf('nonexistent')+
  "\n indexOf('Banana') = " + fruits.indexOf('Banana')+
  "\n lastIndexOf('Apple') = " + fruits.lastIndexOf('Apple')+
  "\n lastIndexOf('nonexistent') = " + fruits.lastIndexOf('nonexistent')+
  "\n lastIndexOf('Banana') = " + fruits.lastIndexOf('Banana')+
  "\n includes('Banana') = " + fruits.includes('Banana')
)
IN [ ]
// find(), findIndex(), findLast(), findLastIndex()
let arr = [1, 2, 3, 4, 2, 5];
console.log(
  " For integer arr = " + arr+
  "\n find((value, index, array) => value > 2) = " + arr.find((value, index, array) => value > 2)+
  "\n findIndex((v,i,a) => v > 2) = " + arr.findIndex((v,i,a) => v > 2)+
  "\n findLast((value, index, array) => value > 2) = " + arr.findLast((value, index, array) => value > 2)+
  "\n findLastIndex((value, index, array) => value > 2) = " + arr.findLastIndex((value, index, array) => value > 2)+
  "\n"+
  "\n Fruits = " + fruits+
  "\n find((v,i,a) => v === 'Banana') = " + fruits.find((v,i,a) => v === 'Banana')+
  "\n findIndex((v,i,a) => v === 'Banana') = " + fruits.findIndex((v,i,a) => v === 'Banana')+
  "\n findLast((v,i,a) => v === 'Banana') = " + fruits.findLast((v,i,a) => v === 'Banana')+
  "\n findLastIndex((v,i,a) => v === 'Banana') = " + fruits.findLastIndex((v,i,a) => v === 'Banana')
)
IN [ ]
// how to use i and a in find() & findLast()
console.log(
  " fruits = " + fruits+
  "\n find((v,i,a) => i === 1) = " + fruits.find((v,i,a) => i === 1)+
  "\n findLast((v,i,a) => i === 1) = " + fruits.findLast((v,i,a) => i === 1)+
  "\n findLastIndex((v,i,array) => array.indexOf(v == 'Orange)) = " + fruits.findLastIndex((v,i,array) => array.indexOf(v == 'Orange'))+
  "\n find((x) => x === 'Orange') = " + fruits.find((x) => x === 'Orange')+
  "\n find(x => x === 'Orange') = " + fruits.find(x => x === 'Orange') // single param doesn't need ()
)
IN [ ]
// sort(), reverse(), toSorted(), toReversed()
let days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
console.log(
  " days = " + days+
  "\n toSorted() = " + days.toSorted()+'          days='+days+
  "\n toReversed() = " + days.toReversed()+'        days='+days+
  "\n sort() = " + days.sort()+'                days='+days+
  "\n reverse() = " + days.reverse()+'            days='+days
)
IN [ ]
// sort(), reverse(), toSorted(), toReversed()
let numbers = [5, 1, 6, 8, 9, 6, 0, 1]
console.log(
  " numbers = " + numbers+
  "\n toSorted() = " + numbers.toSorted()+'          numbers='+numbers+
  "\n toReversed() = " + numbers.toReversed()+'        numbers='+numbers+
  "\n sort() = " + numbers.sort()+'                numbers='+numbers+
  "\n reverse() = " + numbers.reverse()+'            numbers='+numbers
)
IN [ ]
// sort(function), reverse(function), toSorted(function), toReversed(function)
let numbers = [5, 1, 6, 8, 9, 6, 0, 1]
console.log(
  " numbers = " + numbers+
  "\n toSorted() = " + numbers.toSorted()+'          numbers='+numbers+
  "\n toReversed() = " + numbers.toReversed()+'        numbers='+numbers+
  "\n sort((a,b) => a - b) = " + numbers.sort((a,b) => a - b)+'        numbers='+numbers+
  "\n sort((a,b) => b - a) = " + numbers.sort((a,b) => b - a)+'        numbers='+numbers+
  "\n sort((a,b) => 0.5 - Math.random()) = " + numbers.sort((a,b) => 0.5 - Math.random())+'        numbers='+numbers
)
IN [ ]
// Math.min(), Math.max(), Math.min().apply(), Math.max().apply()
let numbers = [5, 1, 6, 8, 9, 6, 0, 1]
console.log(
  " numbers = " + numbers+
  "\n Math.max() = " + Math.max(numbers)+'          # Need to parseInt(array)'+
  "\n Math.max() = " + Math.max(parseInt(numbers))+
  "\n Math.min().apply() = " + Math.min.apply(null, numbers)+ '          # or concat array with null, in .apply'+
  "\n Math.max().apply() = " + Math.max.apply(null, numbers)
)
IN [ ]
// find() sort() objects
const cars = [
  {type:"Volvo", year:2016},
  {type:"Saab", year:2001},
  {type:"BMW", year:2010}
];

console.log(
  " cars = " + cars+
  "\n sort((a,b) => a.year - b.year) = " + cars.sort((a,b) => a.year - b.year)+
  "\n find(v => v.year === 2016) = " + JSON.stringify(cars.find(v => v.year === 2016))
)
IN [ ]
// string sort is a bit complex
cars.sort(function(a, b){
  let x = a.type.toLowerCase();
  let y = b.type.toLowerCase();
  if (x < y) {return -1;}
  if (x > y) {return 1;}
  return 0;
});

console.log(
  "sorted cars type = " + JSON.stringify(cars)
)

Iteration

forEach, map(), flatMap(), filter(), reduce(), reduceRight(), every(), some(), from(), keys(), entries(), with(), Spread (...)

IN [ ]
let arr = [1, 2, 3, 4, 5];

console.log(
  " arr = " + arr+
  "\n map(x => x * 2) = " + arr.map(x => x * 2)+'          arr='+arr+
  "\n filter(x => x > 2) = " + arr.filter(x => x > 2)+'          arr='+arr+
  "\n every(x => x > 2) = " + arr.every(x => x > 2)+'          arr='+arr+
  "\n some(x => x > 2) = " + arr.some(x => x > 2)+'          arr='+arr+
  "\n reduce((a, b) => a + b, 0) = " + arr.reduce((a, b) => a + b, 0)+'          arr='+arr+
  "\n reduceRight((a, b) => a + b, 0) = " + arr.reduceRight((a, b) => a + b, 0)+'          arr='+arr+
  "\n flatMap(x => [x, x]) = " + arr.flatMap(x => [x, x])+'          arr='+arr+
  "\n keys() = " + arr.keys()+'          arr='+arr+
  "\n entries() = " + arr.entries()+'          arr='+arr+
  "\n with(2,22) = " + arr.with(2, 22)+'          arr='+arr
)
IN [ ]
// forEach
let arr = [1, 2, 3, 4, 5];

arr.forEach(x => console.log(x));
IN [ ]
console.log(-2 - 0)
IN [ ]