JavaScript Arrays

JavaScript Arrays

• Arrays are ordered collections of values

• Arrays can contain multiple data types (numbers, strings, etc)

• Arrays are zero-indexed meaning the first element is at index zero

• An array can span multiple lines as shown in the example code

• Defining Arrays

  • Using square brackets: const cars = ["Opel", "BMW", "Mercedes"];
  • Using the new Array() constructor: const cars2 = new Array("Saab", "Volvo", "BMW");
  • This is equivalent to the above syntax
  • Arrays defined with const are not constant; they cannot be reassigned

• Accessing Array Elements

  • Access elements using their index within the square brackets: cars[0] (returns "Opel")
  • To access the entire array, use document.getElementById("demo").innerHTML = cars;

• Converting Arrays to Strings:

  • Using toString(): converts each element to a string and joins them with commas. cars.toString() would return "Opel,BMW,Mercedes"

• Using join() : separates the array elements with a specified character: cars.join(" * ") would return "Opel * BMW * Mercedes"

• Array Length:

  • Use .length to get the number of elements in the array: cars.length would return 3

• Looping on Arrays:

  • Using a for loop: for (let i = 0; i < cars.length; i++) {text += cars[i];}
  • Using forEach(): A more concise approach for iterating through arrays.
  • cars.forEach(car => text+=car);

• Checking if an item is in an array

  • Using indexOf(): Returns the index of the first occurrence of an element in the array.

    • Returns -1 if not found.

  • Using lastIndexOf(): Returns the index of the last occurrence of an element in the array. -Returns -1 if not found.

• Arrays of objects

  • Arrays can contain objects as elements
  • Objects are collections of key-value pairs with labels

• Methods for manipulating arrays:

  • push(): appends an element to the end.
  • pop(): removes the last element.
  • shift(): removes the first element.
  • unshift(): adds an element to the beginning.
  • concat(): creates a new array by merging existing arrays.
  • splice(): adds/removes elements from an array at a specific index (important to understand the parameters for new element addition/removal).
    • splice(index, amountToRemove, ...newElements)
  • slice(): creates a new array containing a portion of the source array.
  • flat(): creates a new array by flattening a nested array to a specified depth

• Finding elements in Arrays:

  • find(): returns the first element matching a condition
  • findIndex(): returns the index of the first element matching a condition

• Sorting Arrays:

  • sort(): sorts elements alphabetically, may need a compare function for numerical sorting
  • reverse(): reverses the order of elements

• Using Math.min() and Math.max() on Arrays:

  • Math.min.apply(null, arr): Finds the smallest element in an array.
  • Math.max.apply(null, arr): Finds the largest element in an array.

JavaScript Loops

• for loop: Repeats a block of code a specified number of times.

  • for (let i = 0; i < 10; i++) { //code }

• for...in loop: Iterates over the properties of an object.

  • for (let key in myObj) { //code }

• for...of loop: Iterates over the values of an iterable object.

  • for (const value of myArr) { //code }

• while loop: Repeats a block of code as long as a condition is true.

  • while (condition) { //code }

• do...while loop: Similar to while but executes the block of code at least once.

• do { //some code } while(condition);

Regular Expressions

• A sequence of characters that forms a pattern for searching or replacing text
• Use /pattern/modifiers
• Modifiers (e.g., i for case-insensitive) adjust how patterns match.
• Key functions for working with Regex:
  • search(): to check if a string matches a pattern. -Returns the start index if a match is found. Returns -1 otherwise.
  • replace(): to replace parts of strings that match patterns.