Skip to content

Instantly share code, notes, and snippets.

@MisterBrash
Last active April 30, 2024 14:18
Show Gist options
  • Save MisterBrash/4532db4d634a7ac5c579a295c0408c88 to your computer and use it in GitHub Desktop.
Save MisterBrash/4532db4d634a7ac5c579a295c0408c88 to your computer and use it in GitHub Desktop.
ICS3U Lesson 3.6 - Arrays

3.6 - Arrays

ICS3U - Mr. Brash 🐿️
Table of Contents

The Lesson: Arrays

Strings are a very special type of variable. They are an array. Almost every programming language in the world has Arrays - at least as an add-on. Arrays let us package multiple values together in one variable. Kind of like a string of letters but instead it could be numbers or booleans or whatever data you need to store.

Imagine creating a contact list program. Every contact that gets added is another piece of data that has to go in a variable. But if you don't know how many contacts there will be - how do you know how many variables to make? contact1, contact2, ... contact999?

Examples:

// Make an array of numbers
let someNumbers = [2,4,5,0,-9,5,2,1,2,4];
console.log(someNumbers.length);  // 10
console.log(someNumbers[2]);      // What gets printed?

One of the biggest differences between Strings and Arrays - you can modify an array.

console.log(someNumbers[1]);  // 4
someNumbers[1] = 17;
console.log(someNumbers[1]);  // 17

In JavaScript and Python, an Array can contain a mixture of any type of data. (Python calls them lists). Other programming languages can only hold one type of data in an array - due to memory security and restrictions.

let myArray = ["This is text", 4, 5, true];

We can loop through arrays just like we did with Strings!

for (let i = 0; i < myArray.length; i++)
  `Do something with` myArray[i];

We can add an element to the end of an existing array with .push()

myArray.push("Some more text");

We can also remove the last element with .pop() (read about it here)


We can declare an empty array two ways:

let my_array_for_later = [];     // Don't know the size

let my_other_array = new Array(20);  // Empty array of 20 slots

There are other built-in functions as well, that you can look up online.

Practice Tasks

Create a new code file for yourself. I recommend naming it 3.6 - Arrays.js.

/** Here are some sample arrays, if you want them for testing */
let test_array1 = [1, 3, 9, 7, -5, 7, 9, 9, -3.14];  // Numbers
let test_array2 = ["3", "castle", "-98", "cookie", "sandwich", "Hi"];  // Strings
let test_array3 = [9, -7, "Deadpool", true, 1, false, "pizza", -3];  // Mix

// We can put anything in a JavaScript array and use new-lines after a comma:
let test_array4 = [0, 0, 10, 0, test_array2, 0,
                   true, test_array3, "Mr. Squirrel",
                   -50, test_array1, "💩", [1,2]];

print_array( )

  1. Create the function print_array(arr) that prints the elements of the array arr to the console one-by-one, each on a new line. This will be very similar to printing each letter of a String.
    Example:

    let my_array = [56, 34, -99, "Hello", true, "Good bye", 0, -1, 42];
    
    print_array(my_array);  // Should print all the contents, each on a new line
    
    // OR:
    print_array([1, 1, 2, 3, 5, 8, 13]);  // Again, should print each on a new line

min( )

  1. Create the function min(arr) that goes through a numeric array and returns the lowest numeric value in the array. It's safe to assume that the input parameter arr is an array of numbers and has at least one value.
    Examples:

    let my_array = [7,2,-4,5,2,9,8,0,1,3,9,-5,-1,5,-1,-8,2,3];
    min(my_array);            // returns -8
    min([6,5,4,3,2,3,4,5,6])  // returns 2
    min([5,5,5,5,5,5,5]);     // returns 5

longest_string( )

  1. Create the function longest_string(arr) that goes through an array of Strings and returns the length of the longest String in the array. It should return the length, not the string. It's safe to assume that the input parameter arr is an array of only Strings and has at least one value in it.

contains( )

  1. Arrays have a built-in .includes() that will tell you if the given element exists in the array. We're going to recreate that function. Create the function contains(arr, value) that returns true if the arr contains a copy of the given value. It should return false otherwise.
    Examples:

    let someValues = [1, 2, 3, 4, "hello"];
    contains(someValues, "hello");   // Returns true
    contains(someValues, 5);         // Returns false
    contains(someValues, "HELLO");   // Returns false
    contains(someValues, 2);         // Returns true
    contains(someValues, "2");       // Returns false

    Remember: The double-equals only compares value and JavaScript thinks 2 and "2" are equal in value. The triple-eqauls also compares data type.

    2 == "2"    // true
    2 === "2"   // false

Challenge Tasks

  1. Create the function min_max(arr) that returns an array with two elements: [min, max]
    Examples:
    let my_array = [7,2,-4,5,2,9,8,0,1,3,9,-5,-1,5,-1,-8,2,3];
    minMax(my_array);  // returns [-8, 9]
    
    minMax[5,5,5,5,5,5,5]);  // returns [5, 5]

  1. Create the function sum(arr) that returns the sum of only the numeric values in the array. For the purposes of this task, anything that can be converted to a number is good. The value "9" is considered numeric. So is true (equates to 1). Hint: we have learned about the isNaN( ) function in previous work.
    Examples:
    sum([1,2,3,4,5]);  // returns 15
    
    let x = ["Hello", "4", 3, "s'up?", true];
    sum(x);  // returns 8 because of "4", 3, and true
    
    // The boolean keyword true equates to a numeric value!
    Hint: for this you might need such things as isNaN, parseInt or Number, and typeof.

  1. Create the function reverse_strings(arr) that returns goes through the given arr of Strings and does the following:

    • Print each string to the console reversed (without using any built-in reverse functionality or .split() or .join())
    • Returns an array of the reversed strings - in reverse.


    Example:

    let my_strings = ["Hello", "Goodbye", "Coding is fun!", "Strings are easy.", "zzzzzzz"]
    reverse_strings(my_strings);
    // Prints the following:
    olleH
    eybdooG
    !nuf si gnidoC
    .ysae era sgnirtS
    zzzzzzz
    
    // Returns the following:
    ["zzzzzzz", ".ysae era sgnirtS", "!nuf si gnidoC", "eybdooG", "olleH"]

    Hint: for this you might need such things as isNaN, parseInt or Number, and typeof.



🐿️

Programming - Review

🐿️

So far we have covered all the basic coding constructs:

We've also seen some things specific to JavaScript (but usually available in other languages):

All of these (above) are readily available in tutorials online and through w3schools. Does anyone need a refresher or quick tutorial on anything listed above (or was anything missed)?



🐿️

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment