GoSkills
Help Sign up Share
Back to course

Arrays

Quiz me Compact player layout Large player layout
Auto
  • HD
  • 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.

View pricing

Cool lesson, huh? Share it with your friends

Google+ Facebook Twitter LinkedIn
  • Lesson resources
  • Quick reference
  • Transcript
  • Notes

About this lesson

What are arrays, and how does JavaScript use them?

Exercise files

Download this lesson’s related exercise files.

Arrays.docx
199.3 KB
Arrays - Solution.docx
199.6 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
  • 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
3m:02s
Objects
3m:39s
Share this lesson and earn rewards Google+ Facebook Twitter LinkedIn
Gift this course
Give feedback

How is your GoSkills experience?

I need help

Your feedback has been sent

Thank you

Back to the top

© 2018 GoSkills Ltd. Skills for career advancement