JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
JavaScript Arrays
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
Storing lots of data at once
• The variables I have used to this point store a single piece of
information
○ Number, String, Boolean, or Object
• What do you do if you want multiple, related pieces of
information?
• Store them in arrays
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
Declaring An Array
• Declaring an array
var grades= [80, 87, 94, 82, 62, 98, 81, 81, 74, 91]
var foods = ['bananas', 'apples', 'pizza']
var images= document.getElementsByClassName['imgs']
var listItems = document.getElementsByTagName['li']
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
Arrays
• An array is a collection of values element
grades 80 87 94 82 62 98 81 81 74 91
0 1 2 3 4 5 6 7 8 9
array name
Each element has a numeric index
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
Accessing An Array
• Each value is called an element
• Elements are referenced by index
grades[0] refers to the value 80 (1st value)
grades[4] refers to the value 62 (5th value)
80 87 94 82 62 98 81 81 74 91
0 1 2 3 4 5 6 7 8 9
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
Arrays
• The elements in the array DON'T have to be all the same
type
var info= ["Colleen", 1715, "Walnut", 44004]
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
JavaScript Arrays are Objects
• They have attributes and methods
• grades.length
• grades.sort()
• grades.push(element)
○ grades[grades.length] = element
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
Review
• Learning to declare and manipulate arrays will make your
code more powerful
• We can now play with new API methods:
○ getElementsByTagName('t')
○ getElementsByClassName('c');
JavaScript Arrays INTERACTIVITY
WITH JAVASCRIPT
© Colleen van Lent
University of Michigan
School of Information
Unless otherwise noted, this work is licensed under the
CC BY-NC 4.0 license.
