Arrays

What makes an array an array

Creating an array

["apple", "banana", "cherry"]

square brackets on their own mean "please go create an array now"

and put these 3 other values inside it

Array Indexes

Array Indexes Exercise

Try this in node:

let fruits = ["apple", "banana", "cherry"]
fruits[1]

Did you get the result you expected?

Why or why not?

Start At Zero

When counting,

humans start at one,

but computers start at zero.

So the first item in an array is number zero, not number one.

The End

Try this:

fruits[99]

Did you get the result you expected?

Why or why not?

Undefined means none

by returning undefined, the computer is answering the question

"What is the 99th item?"

with the answer

"There is no 99th item."

Array Methods

MDN: Array

Reversing an array

let fruits = ["apple", "banana", "cherry"]
fruits.reverse()

Turning an array into a string

fruits.join()           // apple,banana,cherry
fruits.join(" and ")    // apple and banana and cherry
fruits.toString()       // apple,banana,cherry
fruits.toSource()       // [ 'apple', 'banana', 'cherry' ]

Note that console.log uses toSource(), which is usually better for debugging than toString

Looping through an array with forEach

fruits.forEach( (fruit) => {
  console.log("I like " + fruit + "!")
});
phrase meaning
fruits.forEach(...) hey fruits, for each thing inside you,
(fruit) please name it fruit
=> and send it to
{ ... } this block of code
console.log(fruit) so I can print it to the terminal

MDN: Array.forEach

Looping through an array with for-of

Recently, JavaScript added for..of, which does for arrays what for..in does for hashes (JS objects).

for (var fruit of fruits) { 
  console.log("I like " + fruit + "!")
}
phrase meaning
for in a loop,
of fruits take each thing inside fruits
var fruit name it fruit
{ ... } and send it to this block of code

Looping through an array with for

JavaScript inherited for(;;) from C; it's cumbersome but you should learn to recognize it.

for (var i=0; i < fruits.length; i++) { 
  console.log(fruits[i]);
}
phrase meaning
for in a loop,
var i make an index variable named i
i=0 and initially set it to 0
i < fruits.length then, as long as i is less than the number of fruits
{ ... } execute this block of code
console.log(fruits[i]) print the ith element of the fruits array
i++ and then increment i before the next time through

See? Cumbersome.

Lab: loud backwards fruit

Given this array:

let fruits = ["apple", "banana", "cherry"]

write a program that prints:

CHERRY
BANANA
APPLE

Setting items in an array

The [] operator works for assignment as well.

fruits[0] = "Apricot"
fruits[1] = "Blueberry"

console.log(fruits[0])

Checking an array

The includes method checks if an object is inside an array or not.

fruits.includes("apple")    // true

fruits.include("pizza")     // false

Remember, here we are sending a message to an array, asking if it includes a certain string.

LAB: enemies list refactoring

Refactoring is changing existing code so that it works the same, but is cleaner and easier to read.

In your old hello.js program you had an if statement to check if someone is your enemy. Something like:

if (name === "darth" || name === "voldemort" || name === "sauron")

I'd like you to refactor your old hello.js program to use the includes method to check if someone is your enemy. Is it possible to make that if statement more concise?

Next Lesson   Previous Lesson

Outline

[contents]

Arrays Slides - Code Like This

/

#