Week 3: JavaScript Loops and Arrays

Week	Topic	Learning Objectives	Key Resources
3	JS Loops & Arrays	Students will be able to use loops to repeat tasks and iterate in JavaScript; work with arrays in JavaScript – create, access elements, modify arrays; and write reusable functions that use parameters, loops, arrays and return values.	Week 3 Slides

Overview

JavaScript Fundamentals Part 4: JS Loops and Arrays

• Arrays
  • Arrays are ordered collections that store multiple values (strings, numbers, etc) in a single variable
  • Useful for organizing and manipulating large amounts of data
  • Built-in methods allow you to transform arrays in useful ways
• Loops
  • Allow you to execute a block of code repeatedly
  • Useful for performing repetitive tasks, especially on arrays
  • Types of loops like "for" and "while"
  • Can execute code thousands of times very quickly
• Test Driven Development (TDD)
  • Write automated tests that describe expectations for code before writing the code
  • Write tests that will fail first, then write code to make tests pass
  • More productive way of developing than writing code without tests first
  • Ensures code works as expected without manual testing effort

Guidance for Mentors

• For this assignment, students are asked to write functions that use loops, arrays, array methods, parameters and returns values to accomplish tasks. Students need to call these functions, test them with sample inputs, and verify the outputs match expectations using console.logs. The goal is to demonstrate understanding of how to use JavaScript loops, arrays methods, write reusable functions, and debug code.

Assignment Rubric

You can mark the student's assignment as complete if they:

• Fork the Replit file and submit their own link.
• Use proper syntax and good JavaScript logic to answer the questions. Example outputs (Note that some student work variation is expected!):

Question 1:

function repeat(num) {
  for (let i = 0; i < num; i++) {
    console.log("Hello World!");
  }
}

console.log("Q1: ", repeat(5));

Question 2:

function pyramidCounting(num) {
  let sum = 0;
  for (let i = 0; i <= num; i++) {
    sum += i;
  }
  return sum;
}

console.log("Q2: ", pyramidCounting(5));

Question 3:

function noVowels(str) {
  let result = "";
  for (let i = 0; i < str.length; i++) {
    let char = str[i].toLowerCase();
    if (char !== "a" && char !== "e" && char !== "i" && char !== "o" && char !== "u") {
      result += str[i];
    }
  }
  return result;
}

console.log("Q3: ", noVowels("Hello World"));

Question 4:

function vowelCount(str) {
  let count = 0;
  for (let i = 0; i < str.length; i++) {
    let char = str[i].toLowerCase();
    if (char === "a" || char === "e" || char === "i" || char === "o" || char === "u") {
      count++;
    }
  }
  return count;
}

console.log("Q4: ", vowelCount("Hello World"));

Question 5:

function numOfOdds(num) {
  let count = 0;
  for (let i = 0; i <= num; i++) {
    if (i % 2 !== 0) {
      count++;
    }
  }
  return count;
}

console.log("Q5: ", numOfOdds(10));

Question 6:

let empty = [];
let full = [1, 2, 3];

function arrayChecker(arr) {
  if (arr.length === 0) {
    return true;
  } else {
    return false;
  }
}

// Checking the 'empty' variable
console.log("Q6 - empty array: ", arrayChecker(empty));

// Checking the 'full' variable
console.log("Q6 - full array: ", arrayChecker(full));

Question 7:

function getElementAt(arr, index) {
  if (index >= 0 && index < arr.length) {
    return arr[index];
  } else {
    return null;
  }
}

// Using the 'full' variable from Question 6
console.log("Q7: ", getElementAt(full, 2));

Question 8:

function insertInArray(arr) {
  let newArray = [...arr]; // Create a new array using the spread operator

  newArray.splice(1, 0, 0); // Insert 0 at the second position in the new array

  return newArray; // Return the new array
}

console.log("Q8: ", insertInArray(full));

Question 9:

function compareArrays(arr1, arr2) {
  if (arr1.length !== arr2.length) {
    return false;
  }

  for (let i = 0; i < arr1.length; i++) {
    if (arr1[i] !== arr2[i]) {
      return false;
    }
  }

  return true;
}

// Testing with 'empty' and 'full' variables from Question 6
console.log("Q9 - empty and full: ", compareArrays(empty, full));

// Creating a variable 'compare' as a copy of 'full' array
let compare = [...full];
console.log("Q9 - full and compare: ", compareArrays(full, compare));

// Creating a variable 'part' as a partial copy of 'full' array
let part = full.slice(0, 2);
console.log("Q9 - full and part: ", compareArrays(full, part));

Question 10:

let numbers = [10, 3, 4]; // Create a variable called 'numbers' and assign it an array with at least 3 numbers

function calculateTotal(arr) {
  let total = 0; // Initialize a variable 'total' to store the sum

  for (let i = 0; i < arr.length; i++) {
    total += arr[i]; // Add each element of the array to 'total'
  }

  return total; // Return the sum of all array elements
}

// Testing with the 'numbers' array
console.log("Q10 - Total: ", calculateTotal(numbers));

Question 11:

function findEvens(arr) {
  let evenArray = arr.filter(num => num % 2 === 0); // Use the filter method to create a new array of even numbers
  return evenArray;
}

function findOdds(arr) { let oddArray = arr.filter(num => num % 2 !== 0); // Use the filter method to create a new array of odd numbers return oddArray; }

// Testing with any input
console.log("Q10 - findEvens: ", findEvens([1, 2, 3, 4, 5, 6]));
console.log("Q10 - findOdds: ", findOdds([1, 2, 3, 4, 5, 6]));

Question 12:

function makeSquares(arr) {
  let newArray = arr.map(num => num ** 2); // Use the map method to create a new array with squared values
  return newArray;
}

// Testing with any input
console.log("Q12 - Squares: ", makeSquares([1, 2, 3, 4, 5]));