GoSkills
Help Sign up Share
Back to course

Arrays

Quiz me Quiz Compact player layout Large player layout
Focus video player for keyboard shortcuts
Auto
  • 720p
  • 540p
  • 360p
1.00x
  • 0.50x
  • 0.75x
  • 1.00x
  • 1.25x
  • 1.50x
  • 1.75x
  • 2.00x
cc

We hope you enjoyed this lesson.

Get the Introduction to JavaScript course for more great video tutorials.

Start free trial

Cool lesson, huh? Share it with your friends

Facebook Twitter LinkedIn WhatsApp Email

  • Lesson resourcesResources
  • Quick referenceReference
  • Transcript
  • Notes

About this lesson

What are arrays, and how does JavaScript use them?

Exercise files

Download this lesson’s related exercise files.

Arrays
58.7 KB
Arrays - Solution
58.9 KB

Quick reference

Arrays

An array is a container that holds many items.

When to use

Anytime you need to contain many items, use an array.

Instructions

Arrays look like this:

var pizza = ["Hamburger", "Cheese", "Mushroom"];

To call an item in the array, we reference its index number:

pizza[1];

Index numbers start with 0.

We can find out how many items are in an array:

pizza.length;

We can sort an array alphabetically:

pizza.sort();

To add more items to an array, use:

pizza.push("Onion");

 

Hints & tips

  • Arrays are containers that can hold many things
  • Index numbers start at 0
  • pizza.length to get the length of an array
  • pizza.sort() to sort an array
  • pizza.push("Add something") to add an item
Login to download
  • 00:05 Okay, we've already talked about variables.
  • 00:06 In this video, I wanna talk about arrays.
  • 00:08 And arrays are just incredibly important to any programming language.
  • 00:12 And they're really sort of the beginning of more intermediate programming stuff.
  • 00:17 We've been talking about basic stuff up until now.
  • 00:19 Arrays, we're starting to get into more advanced stuff.
  • 00:21 They're just one of those fundamental things that all programming languages
  • 00:24 have, and you're gonna use them a lot.
  • 00:26 So if a variable is a container, or
  • 00:28 a bucket, that holds one thing, an array is a container that holds lots of things.
  • 00:33 In fact, they'll hold as many things as you can cram in there.
  • 00:36 And you can keep putting things in, and you can take things out.
  • 00:39 And you can do all kinds of things.
  • 00:40 So they're great for
  • 00:41 storing lists of things like lists of names or customer phone numbers or
  • 00:46 email addresses or anything you want, pizza toppings, it doesn't really matter.
  • 00:50 So, how do we make an array in JavaScript?
  • 00:52 Well, it's pretty easy, and it looks a lot like a variable.
  • 00:55 So if we come up here, we can go, var, we're gonna declare it, give it a name.
  • 01:00 Let's call it pizza and equals to.
  • 01:02 Up until now it looks just like a variable.
  • 01:04 Now we use these brackets.
  • 01:06 And every item we wanna put into the array we just put quotations around.
  • 01:11 So we could go "pepperoni" and then we separate each item with a comma.
  • 01:16 So "pepperoni", "hamburger", "cheese", "mushroom", whatever.
  • 01:23 That's an array, very simple.
  • 01:25 So you can see I've got all this on one line, and
  • 01:28 in fact you can put this on multiple lines, and that's sort of the convention.
  • 01:32 Just because it makes it much easier to read.
  • 01:34 This is a very small array, if you have a huge array with hundreds of things in it,
  • 01:38 or something you wanna put it on separate lines,
  • 01:40 just because it's gonna be easier to read.
  • 01:42 So, we can call out things from our array, and we can and do things with them,
  • 01:45 just like when we output variables to the screen we can do the same thing.
  • 01:48 And we do that by referencing the index number of each item.
  • 01:52 Each item in an array has its own index number.
  • 01:55 And the numbers start at zero.
  • 01:57 This is very important.
  • 01:58 This screws up a lot of people.
  • 01:59 So "Pepperoni," this is the zeroth item.
  • 02:02 Right, it's not the first item, it's 0.
  • 02:04 Hamburger is number 1, cheese is number 2, mushroom is number 3.
  • 02:08 So there're 4 items in here, but it only goes up to 3 in index numbers.
  • 02:13 That confused a lot of people.
  • 02:14 Even to this day I'll forget every once in a while, and I'll wanna use pepperoni and
  • 02:19 I'll call for variable index number one, and it'll be hamburger, and
  • 02:22 I'll be like, yeah, I forgot, it's zero.
  • 02:24 Try and keep that in mind.
  • 02:25 So, to access an array item, all we have to do is just call our array,
  • 02:31 do this, and boom, 0. That's it.
  • 02:33 So if we wanted to go document.write, just like we have in the past for everything.
  • 02:40 So we're calling out our array we wanna output the zeroeth item.
  • 02:45 That's pepperoni.
  • 02:46 If we wanna output the third item, that's mushroom.
  • 02:50 We can also reference the entire array by not giving it an index number,
  • 02:54 just calling it pizza.
  • 02:55 If we do that, we're gonna get everything output separated by a comma.
  • 03:00 Now we an loop through these and pull out each item automatically.
  • 03:03 We're gonna talk about loops later.
  • 03:05 And when we do, we'll look at arrays and loops and you'll see how to do that.
  • 03:08 So you can put all kinds of things in arrays.
  • 03:10 We've got strings here.
  • 03:11 You can also put, we can put numbers.
  • 03:14 That works just as well.
  • 03:15 We can put other arrays in an array,
  • 03:18 that will blow your mind later when we start to do that.
  • 03:20 We can do math with arrays, so 41 and 2.
  • 03:23 Now if we come down here and call pizza, let's see this is 0, 1,
  • 03:28 2, 3, this is the 4th and the 5th item.
  • 03:31 So if we go 4 + pizza 5,
  • 03:39 Typo, 04 + 05.
  • 03:42 That's gonna be 43.
  • 03:43 So we can do addition,
  • 03:44 we can do anything we want with an array that we can do with a variable, basically.
  • 03:48 We can ask it what the length is,
  • 03:50 how many items are in there by calling length, pizza.length.
  • 03:55 And we can see there are six items in our array.
  • 03:58 We can do sort which is kinda fun.
  • 04:01 So we got pepperoni, hamburger, cheese.
  • 04:04 If we sort them, it does it, oops, actually we need to sort and
  • 04:08 then two little parenthesis.
  • 04:10 Now it puts it in alphabetical order, now it's cheese, hamburger, mushrooms and
  • 04:15 starts with 2 and 41 'cause 2 is smaller than 41 so that's automatically sorting for us.
  • 04:20 We can add things to our array.
  • 04:22 We can go pizza.push to push something in.
  • 04:27 And then we can go, say, "onion", right.
  • 04:30 Now, if we call our array,
  • 04:31 we can see "onion" has been added to it automatically, programmatically.
  • 04:37 So, those are arrays, they're really fun and
  • 04:39 in the next video we'll talk about objects.

Lesson notes are only available for subscribers.

Strings, Numbers, and Boolean Data Types
03m:09s
Objects
03m:45s
Share this lesson and earn rewards

Facebook Twitter LinkedIn WhatsApp Email

Gift this course
Give feedback

How is your GoSkills experience?

I need help

Your feedback has been sent

Thank you

Back to the top

© 2023 GoSkills Ltd. Skills for career advancement