Recap Array

Tuesday, June 23, 2020

Course Link

1. Use an Array to Store a Collection of Data

One-dimensional array

let simpleArray =[1, "plains hymn", true,null,undefined]; // Change this line

// Access the length property
console.log(simpleArray.length);
// logs 5

multi-dimensional array
arrays are also capable of storing complex objects.

let complexArray = [
  [
    {
      one: 1,
      two: 2
    },
    {
      three: 3,
      four: 4
    }
  ],
  [
    {
      a: "a",
      b: "b"
    },
    {
      c: "c",
      d: "d"
    }
  ]
];

2. Access an Array’s Contents Using Bracket Notation

The fundamental feature of any data structure is, of course, the ability to not only store data, but to be able to retrieve that data on command.

let myArray = ["a", "b", "c", "d"];
// Only change code below this line
myArray[1] ="bd"
// Only change code above this line
console.log(myArray);

3. Add Items to an Array with `push()` and `unshift()`

Both methods take one or more elements as parameters and add those elements to the array the method is being called on.

push() method adds elements to the end of an array
unshift() adds elements to the beginning

let twentyThree = 'XXIII';
let romanNumerals = ['XXI', 'XXII'];

romanNumerals.unshift('XIX', 'XX');
// now equals ['XIX', 'XX', 'XXI', 'XXII']

romanNumerals.push(twentyThree);
// now equals ['XIX', 'XX', 'XXI', 'XXII', 'XXIII']Notice that we can also pass variables, which allows us even greater flexibility in dynamically modifying our array's data.

4. Remove Items from an Array with `pop()` and `shift()`

Both push() and unshift() have corresponding methods that are nearly functional opposites: pop() and shift()

let greetings = ['whats up?', 'hello', 'see ya!'];

greetings.pop();
// now equals ['whats up?', 'hello']

greetings.shift();
// now equals ['hello']

// return the value of the removed element
let popped = greetings.pop();
// returns 'hello'
// greetings now equals []

5. Remove Items Using `splice()`

splice() allows us to do just that: remove any number of consecutive elements from anywhere in an array.
splice() can take up to 3 parameters, but for now, we’ll focus on just the first 2.
- first parameter represents the index on the array from which to begin removing elements,
- while the second parameter indicates the number of elements to delete. For example:

let array = ['today', 'was', 'not', 'so', 'great'];

array.splice(2, 2);
// remove 2 elements beginning with the 3rd element
// array now equals ['today', 'was', 'great']

let array = ['I', 'am', 'feeling', 'really', 'sleepy'];

let newArray = array.splice(3, 2);
// newArray equals ['really', 'sleepy']
// array equals [ 'I', 'am', 'feeling' ]

// Use splice() to remove elements from arr, so that it only contains elements that sum to the value of 10
const arr = [2, 4, 5, 1, 7, 5, 2, 1];
// Only change code below this line
arr.splice(1,4)
// Only change code above this line
console.log(arr);

6. Add Items Using splice()

const numbers = [10, 11, 12, 12, 15];
const startIndex = 3;
const amountToDelete = 1;

numbers.splice(startIndex, amountToDelete, 13, 14);
// the second entry of 12 is removed, and we add 13 and 14 at the same index
console.log(numbers);
// returns [ 10, 11, 12, 13, 14, 15 ]

7. Add Items Using splice()

You can use the third parameter, comprised of one or more element(s), to add to the array. This can be incredibly useful for quickly switching out an element, or a set of elements, for another.

const numbers = [10, 11, 12, 12, 15];
const startIndex = 3;
const amountToDelete = 1;

numbers.splice(startIndex, amountToDelete, 13, 14);
// the second entry of 12 is removed, and we add 13 and 14 at the same index
console.log(numbers);
// returns [ 10, 11, 12, 13, 14, 15 ]

8. Copy Array Items Using slice()

slice(), rather than modifying an array, copies, or extracts, a given number of elements to a new array, leaving the array it is called upon untouched.
slice() takes only 2 parameters
- the first is the index at which to begin extraction
- the second is the index at which to stop extraction (extraction will occur up to, but not including the element at this index).
Example 1

let weatherConditions = ['rain', 'snow', 'sleet', 'hail', 'clear'];

let todaysWeather = weatherConditions.slice(1, 3);
// todaysWeather equals ['snow', 'sleet'];
// weatherConditions still equals ['rain', 'snow', 'sleet', 'hail', 'clear']

Example 2

function forecast(arr) {
  // Only change code below this line
  arr = arr.slice(2,4)

  return arr;
}

// Only change code above this line
console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms']));

9. Copy an Array with the Spread Operator `...`

Example 1

let thisArray = [true, true, undefined, false, null];
let thatArray = [...thisArray];
// thatArray equals [true, true, undefined, false, null]
// thisArray remains unchanged, and is identical to thatArray

Example 2

function copyMachine(arr, num) {
  let newArr = [];
  while (num >= 1) {
    // Only change code below this line
    newArr.push([...arr]);
    // Only change code above this line
    num--;
  }
  return newArr;
}

console.log(copyMachine([true, false, true], 2));

10. Combine Arrays with the Spread Operator

← Previous