Scribd
Upload
10 views

03.01.JS JavaScriptArrays

Uploaded by

Le Van Phuoc (K17 HCM)
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
10 views

03.01.JS JavaScriptArrays

Uploaded by

Le Van Phuoc (K17 HCM)
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

INTERACTIVITY

03.01 JavaScript Arrays WITH JAVASCRIPT

JavaScript Arrays
INTERACTIVITY
03.01 JavaScript Arrays 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
INTERACTIVITY
03.01 JavaScript Arrays 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’];


INTERACTIVITY
03.01 JavaScript Arrays WITH JAVASCRIPT

Arrays
element
• An array is a collection of values

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
INTERACTIVITY
03.01 JavaScript Arrays WITH JAVASCRIPT

Accessing An Array
80 87 94 82 62 98 81 81 74 91
0 1 2 3 4 5 6 7 8 9
• 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)
INTERACTIVITY
03.01 JavaScript Arrays WITH JAVASCRIPT

Arrays
• The elements in the array DON’T have to
be all the same type
var info= [“Colleen’, 1715, “Walnut”, 44004];
INTERACTIVITY
03.01 JavaScript Arrays WITH JAVASCRIPT

JavaScript Arrays are Objects


• They have attributes and methods
• grades.length
• grades.sort()
• grades.push(element)
• grades[grades.length] = element
INTERACTIVITY
03.01 JavaScript Arrays 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’);
INTERACTIVITY
03.01 JavaScript Arrays WITH JAVASCRIPT

Acknowledgements/Contributions
These slides are Copyright 2015- Colleen van Lent as part of
http://www.intro-webdesign.com/ and made available under a Creative
Commons Attribution Non-Commercial 4.0 License. Please maintain
this last slide in all copies of the document to comply with the attribution
requirements of the license. If you make a change, feel free to add
your name and organization to the list of contributors on this page as
you republish the materials.

Initial Development: Colleen van Lent , University of Michigan School of


Information

You might also like