JavaScript Multiple Values

🔵 1

Arrays

An array is an ordered collection where each value has a numeric index starting at 0.

let arrayVarName = [];                      // empty array
let arrayVarName = [val1, val2, ..., valn]; // array with values

let languages = ["JS", "Java", "Python"];
console.log(languages[0]);

›JS

You access array values by index, not by name. [] defines the array literal; elements are comma-separated; arrays can hold mixed types.

Mixed-type array

let mixed = ["Alice", 25, true];
console.log(mixed[0]);
console.log(mixed[1]);
console.log(mixed[2]);

›Alice 25 true

Array indices and length

let colors = ["red", "green", "blue"];
console.log(colors.length);
console.log(colors[colors.length - 1]);

›3 blue

colors.length gives the element count (3); colors[colors.length - 1] is the standard idiom for "last element." You can read with array[index] and write/replace with array[index] = newValue.

🟢 2

Array Methods

1. Add & Remove Elements

let arr = [2, 3];
arr.push(4);      console.log(arr);
arr.unshift(1);   console.log(arr);
arr.pop();        console.log(arr);
arr.shift();      console.log(arr);

›[ 2, 3, 4 ] [ 1, 2, 3, 4 ] [ 1, 2, 3 ] [ 2, 3 ]

Method	Effect
`push(x)`	Add x to the end
`unshift(x)`	Add x to the start
`pop()`	Remove & return the last element
`shift()`	Remove & return the first element

ℹ️ An arrow function is a shorter way to write a function (ES6): (parameters) => { /* body */ }. You'll see them throughout the methods below.

2. Iterate — forEach()

const numbers = [1, 2, 3];
numbers.forEach(num => {
  console.log(num);
});

›1 2 3

numbers.forEach((num, index) => {
  console.log(index, " ", num);
});

›0 1 1 2 2 3

3. Transform — map()

const nums = [1, 2, 3];
const doubled = nums.map(num => num * 2);
console.log(doubled);

›[ 2, 4, 6 ]

4. Filter — filter()

const nums = [1, 2, 3, 4, 5];
const even = nums.filter(num => num % 2 === 0);
console.log(even);

›[ 2, 4 ]

5. Find Elements — find() / findIndex()

const nums = [10, 20, 30];
const result = nums.find(num => num > 15);
console.log(result);

const index = nums.findIndex(num => num > 15);
console.log(index);

›20 1

6. Test Conditions — some() / every()

const nums = [1, 2, 3];
console.log(nums.some(num => num > 2));
console.log(nums.every(num => num > 0));

›true true

7. Reduce — reduce()

const nums = [1, 2, 3, 4];
const sum = nums.reduce((total, num) => total + num, 0);
console.log(sum);

›10

8. Search — includes() / indexOf()

const fruits = ["apple", "banana"];
console.log(fruits.includes("banana"));
console.log(fruits.indexOf("banana"));

›true 1

9. Slice & Splice

const arr = [1, 2, 3, 4];
console.log(arr.slice(1, 3));   // does NOT modify original
console.log(arr);

›[ 2, 3 ] [ 1, 2, 3, 4 ]

const arr2 = [1, 2, 3, 4];
arr2.splice(1, 2);   // DOES modify original
console.log(arr2);

›[ 1, 4 ]

💡 slice() returns a new array, leaving the original untouched. splice() mutates the original in place — a common source of bugs when the distinction is missed.

10. Join & Split

const words = ["Hello", "World"];
console.log(words.join(" "));

let stmt = "Today is saturday";
console.log(stmt.split(" "));

›Hello World [ 'Today', 'is', 'saturday' ]

11. Sort & Reverse

const nums = [3, 1, 5, 2];
nums.sort();
console.log(nums);

const arr3 = [1, 2, 3];
arr3.reverse();
console.log(arr3);

›[ 1, 2, 3, 5 ] [ 3, 2, 1 ]

⚠️ Default sort() compares elements as strings — sorting numbers like [10, 2, 33] without a compare function gives surprising alphabetical results. Use nums.sort((a,b) => a - b) for numeric sorting.

12. Combine — concat()

const a = [1, 2];
const b = [3, 4];
const result = a.concat(b);
console.log(result);

›[ 1, 2, 3, 4 ]

13. Flatten — flat() / flatMap()

const arr4 = [1, [2, 3], [4, [5]]];
console.log(arr4.flat());

›[ 1, 2, 3, 4, [ 5 ] ]

const arr5 = ["hello world", "javascript"];
const words2 = arr5.flatMap(str => str.split(" "));
console.log(words2);

›[ 'hello', 'world', 'javascript' ]

flat() only flattens one level deep by default — pass a depth like flat(2) to go deeper.

14. Create Arrays

console.log(Array.from("hello"));
console.log(Array.of(1, 2, 3));
console.log(new Array(3));
console.log(Array(3).fill(0));

›[ 'h', 'e', 'l', 'l', 'o' ] [ 1, 2, 3 ] [ <3 empty items> ] [ 0, 0, 0 ]

15. Fill Arrays — fill()

const arr6 = [1, 2, 3];
arr6.fill(0);
console.log(arr6);

›[ 0, 0, 0 ]

16. Check Array Type — Array.isArray()

console.log(Array.isArray([1, 2]));
console.log(Array.isArray("hello"));

›true false

🟠 Reference

Quick Interview Cheat Sheet

Need to...	Use
Add/remove at ends	`push / pop / shift / unshift`
Transform every item	`map`
Keep only matching items	`filter`
Get one value from all items	`reduce`
Find one item / its position	`find / findIndex`
Check true/false across items	`some / every`
Check membership	`includes / indexOf`
Non-destructive extract	`slice`
Destructive insert/remove	`splice`
Array ↔ string	`join / split`

🩷 3

Loops Recap

Loops repeatedly execute a block of code while a condition holds — used for repeating operations, iterating arrays/objects, and generating sequences.

while

let i = 0;
while (i < 10) {
  console.log(i);
  i = i + 1;
}

›0 1 2 3 4 5 6 7 8 9

for

for (let i = 0; i < 10; i = i + 1) {
  console.log(i);
}

›0 1 2 3 4 5 6 7 8 9

for...of

let names = ["Chantal", "John", "Maxime"];
for (let name of names) {
  console.log(name);
}

›Chantal John Maxime

ℹ️ Full coverage of while, do...while, for, nested loops, and for...in — with worked examples like the Fibonacci generator and array search — lives in the separate JavaScript Loops notes. This is just a quick recap before break/continue below.

🔷 4

break vs continue

break — immediately terminates the nearest enclosing loop.
continue — skips the rest of the current iteration and moves to the next one.

for (let i = 1; i <= 10; i++) {
    if (i === 6) {
        break;   // stops the loop entirely
    }
    console.log(i);
}

›1 2 3 4 5

for (let i = 1; i <= 10; i++) {
    if (i === 6) {
        continue;   // skips just this one iteration
    }
    console.log(i);
}

›1 2 3 4 5 7 8 9 10

With break, the loop stops the moment i reaches 6 — nothing after 5 ever prints. With continue, only the value 6 itself is skipped; the loop keeps running through 10.