JavaScript (Part 5)- Arrays and JavaScript Libraries
JavaScript (Part 5)- Arrays and JavaScript Libraries
Ullrich Hustadt
Array Literals
• An array literal is a comma-separated list of values enclosed in
square brackets
[2 ,3 ,5 ,7 ,11]
Arrays
• An array is created by assigning an array literal to a variable
var arrayVar = []
var arrayVar = [ elem0 , elem1 , ... ]
Arrays
• It is possible to assign a value to arrayVar.length
• if the assigned value is greater than the previous value of arrayVar.length,
then the array is ‘extended’ by additional undefined elements
• if the assigned value is smaller than the previous value of arrayVar.length,
then array elements with greater or equal index will be deleted
• Assigning an array to a new variable creates a reference to the
original array
; changes to the new variable affect the original array
• Arrays are also passed to functions by reference
• The slice function can be used to create a proper copy of an array:
object arrayVar.slice(start, end)
returns a copy of those elements of array variable that have indices
between start and end
Arrays: Example
var array1 = [ ’ hello ’ , [1 , 2] , function () { return 5} , 43]
console . log ("1: array1 . length = "+ array1 . length )
console . log ("2: array1 [3] ="+ array1 [3])
1: array1 . length = 4
2: array1 [3] = 43
array1 [5] = ’ world ’
console . log ("3: array1 . length = "+ array1 . length )
console . log ("4: array1 [4] ="+ array1 [4])
console . log ("5: array1 [5] ="+ array1 [5])
3: array1 . length = 6
4: array1 [4] = undefined
5: array1 [5] = world
array1 . length = 4
console . log ("6: array1 [5] ="+ array1 [5])
6: array1 [5] = undefined
var array2 = array1
array2 [3] = 7
console . log ("7: array1 [3] ="+ array1 [3])
7: array1 [3] = 7
forEach-method
• The recommended way to iterate over all elements of an array is a
for-loop
for ( index = 0; index < arrayVar . length ; index ++) {
... arrayVar [ index ] ...
}
forEach-method
var rewriteNames = function ( elem , index , arr ) {
arr [ index ] = elem . replace (/(\ w +)\ s (\ w +)/ , " $2 , $1 ");
}
Stack
A collection of items that are inserted and removed according to the
last-in first-out (LIFO) principle
• push adds an item to the top of the stack
• pop removes the top item from the stack
Queue
A collection of items that are inserted and removed according to the
first-in first-out (FIFO) principle
• enqueue adds an item to the back of the queue
• dequeue removes the item at the front of the queue
Array functions
JavaScript:
$array3 = ["1.23 e2 " ,5]
$array4 = ["12.3 e1 " , true ]
if ( $array3 == $array4 )
console . log (" The two arrays are equal ")
else console . log (" The two arrays are not equal ")
Output: The two arrays are not equal
PHP:
$array3 = array ("1.23 e2 " ,5);
$array4 = array ("12.3 e1 " , true );
if ( $array3 == $array4 )
print (" The two arrays are equal ");
else print (" The two arrays are not equal ");
Output: The two arrays are equal
COMP519 Web Programming Lecture 14 Slide L14 – 16
Equality and Program Behaviour
JavaScript:
$array3 = ["1.23 e2 " ,5]
$array4 = ["1.23 e2 " ,5]
if ( $array3 == $array4 )
console . log (" The two arrays are equal ")
else console . log (" The two arrays are not equal ")
Output: The two arrays are not equal
PHP:
$array3 = array ("1.23 e2 " ,5);
$array4 = array ("12.3 e1 " ,5);
if ( $array3 == $array4 )
print (" The two arrays are equal ");
else print (" The two arrays are not equal ");
Output: The two arrays are equal
COMP519 Web Programming Lecture 14 Slide L14 – 17
JavaScript Libraries
JavaScript libraries
• Collections of JavaScript functions (and other code), libraries,
can be stored in one or more files and then be reused
• By convention, files containing a JavaScript library are given
the file name extension .js
• <script>-tags are not allowed to occur in the file
• A JavaScript library is imported using
< script src =" url " > </ script >