1. CIS 136 Building Mobile Apps
More Javascript Code to respond to Page Events, Physical Events, Device Events
CIS 136 Building Mobile Apps

2. A review of Javascript

3. Using the <script> Element
script statements;
</script>
Each statement inside the script tags is a single line that indicates an action for the browser to take
The semicolon notifies the browser that it has reached the end of the statement

4. Declaring a variable A variable is a value stored in device memory
You can declare variables with any of the following JavaScript commands:
var variable;
var variable = value;
variable = value;
where variable is the name of the variable and value is the initial value of the variable.
Use reserved keyword var to create variables
The first command creates the variable without assigning it a value;
the second and third commands both create the variable and assign it a value
Assignment operator: equal sign (=)
Assigns value on the right side of the expression to the variable on the left side of the expression

5. Case Sensitivity in JavaScript
JavaScript is case sensitive
Ignores most occurrences of extra white space
Do not break a statement into several lines

6. Making Decisions Decision making
Process of determining the order in which statements execute in a program
Decision-making statements, decision-making structures, or conditional statements
Used when you need to adopt one path out of the given two paths
Conditional statements allow your program to make correct decisions and perform right actions
Runs a command or command block only when certain circumstances are met
JavaScript supports 2 kinds of conditional statements which are used to perform different actions based on different conditions
if .. else
switch

7. if/else Statements Executes one action if the condition is true
And a different action if the condition is false
Syntax for an if else statement
if (expression) {
statements }
else {

8. New stuff in Javascript

9. Adding Comments to a JavaScript Program
Nonprinting lines placed in code containing various types of remarks
Will be ignored by the browser
Line comment
Hides a single line of code
Add two slashes // before the comment text
Block comments
Hide multiple lines of code
Add /* before the first character included in the block and */ after the last character in the block

10. Concatenation Combining two pieces of data using the + sign
JavaScript is a weakly typed language
The + symbol can be used with either numeric values or text strings
When both sides of the + sign contain numbers, addition will be performed
var total = 5 + 4;
var emLink = "cadler" + + "mpl.gov";

11. switch Statements
Controls program flow by executing a specific set of statements based on an expression (one value) until a match is found
Examines the expression and then evaluates a series of possible matching values
The switch statement is given an expression to evaluate
The case statements contain the possible values and the code to execute for each possible value
The interpreter checks each case against the value of the expression until a match is found
If nothing matches, a default condition will be used.
Break statement stops the matching
Break statement

12. Switch switch (americanCity) { case "Boston": alert "Massachusetts";
break;
case "Chicago":
alert "Illinois";
case "Los Angeles":
alert "California";
default:
alert "United States"; }

13. Arrays where one variable holds many values, like a list

14. Arrays An Array is a Javascript Object
It contains one or more items, called elements
Each element can hold any type of data
Numbers, strings, objects
An array can hold many values under a single name

15. Creating Arrays An array can be created & populated several ways
Declaration
var cellphones = new Array();
String object’s split method:
var cellphones=dataString.split(',');

16. Declaring and Initializing Arrays (cont’d.)
Element
Each piece of data contained in an array
Index
Element’s numeric position within the array
Array element numbering
Starts with index number of zero (0)
To access data in an array, refer to the arrayname followed by its index
cellphones[0];

17. Strings

18. Manipulating Strings String var txt = “special text";
Text contained within double or single quotation marks
To create strings
var txt = “special text";
String Class is used to manipulate text
parse (extract) text strings in scripts
Format text
Find text patterns
Replace text
Chop up text

19. Split method split()- Splits a string into an array of substrings
var str = "How are you doing today?"; var res = str.split(" ");
Results in an array namede res
Res[0] holds the value How
Res[1] holds the value are

20. Controlling when code executes
Functions
Controlling when code executes

21. Functions
A JavaScript function is a block of code designed to perform a particular task – an action of some sort
A JavaScript function is executed when "something" invokes it (calls it).
Functions must be contained within a <script> element
Function statements do the actual work and are contained within curly braces

22. Defining Functions Syntax function nameOfFunction(parameters) {
statements; }
Parameter
Variable used within a function
Placed within parentheses following a function name
Multiple parameters allowed
function calc_square_root(number1, number2) {
var sr1 = number1 * number1

23. Lets Practice Define a function named “displayMyBank”
Inside the function, use a an alert statement, to write out the name of your bank
The function does not need parameters
Syntax
function averageNumbers(a, b, c) {
var sum_of_numbers = a + b + c;
var result = sum_of_numbers / 3; }

24. Calling Functions
Functions can be written anywhere in the web page, but are usually within the document head, or an external .js file
Calls to the function are usually within the body section and consist of the function name followed by parentheses
function printStudentNames() {
navigator.notification.alert(“<p>” + Joe + “</p>”);
navigator.notification.alert(“<p>” + Sam + “</p>”);
navigator.notification.alert(“<p>” + Bob + “</p>”); }
</script> </head>
<body>
<script>
printStudentNames();
</script>

25. Calling Functions using parameters
If a function needs additional information, providing it is called Passing arguments
The function must be designed to receive that data, and that data is called a parameter
Arguments vs. Parameters – refer to the same memory location, therefore the same data
function averageNumbers(a, b, c) {
var sum_of_numbers = a + b + c;
var result = sum_of_numbers / 3; }
averageNumbers(1,2,3);