Overview: Programming Concepts

2. Overview: Programming Concepts Programming Formulating an algorithm or program Concepts from JavaScript Fully general programming language Designed for making active web pages/apps

3. Programming Concepts Not enough for fancy web pages, but these provide a basic set of first capabilities Names, values, variables Declarations Data types, numbers, string literals and Booleans Assignment Expressions Conditionals

6. Names, Values, And Variables A Name is a symbol that represents something Names Have Changing Values U.S. President: Barack Obama Names in a Program Are Called Variables “variable”: reminds us that the value associated with the symbol can vary Values associated with a variable change in programs using the assignment statement ( = )

7. Names and Changing Values

8. Identifiers and Their Rules Identifieris character sequence that is a variable's name Formed following specific rules Must begin with a letter or underscore ( _ ) followed by any sequence of letters, digits, or underscore characters Cannot contain spaces Case sensitive

9. ValidInvalidfirstOne 1stOnefirst1 first-1First_1 first$1First_One first OnefIRSToNE First1! _special 5 very_long_name_ok happy:) For each invalid identifier, what rule is broken? Identifiers and Their Rules

10. A Variable Declaration Statement Declaration: State variables which will be used varradius, area; Variable declaration is a type of statement Can have many var statements in a program

11. The Statement Terminator Program is a list of statements Each statement is terminated by the statement terminator symbol JavaScript: semicolon( ; )

12. Rules for Declaring Variables Must declare variables before use Declaration can appear anywhere Often first (“up top”) Undefined values Only has value if initialized or assigned varspeed; speed = 42;

13. Initializing a Declaration Setting initial value var speed = 42; Related variables may be declared together varnumA = 27, numB, numC;

14. Three Basic Date Types in JavaScript Values are grouped into related categories called data types numbers strings (used for text) Booleans (used for logic)

15. Rules for Writing Numbers No "units" or commas Can have about 10 significant digits and can range from 10-324 to 10308 Values with no decimal point are integers 10 1567238 -487 -776734551 0 Values with a decimal point are real, or floating point 10.0 3.1415926 -478934.4 0.000101101111

16. Strings Strings are sequences of characters Surrounded with single ( ' ' ) or double quotes ( " " ) Initialization varhairColor = "black", sign= 'Leo'; vargreeting = "Hello, how are you today?"

17. Rules for Writing Strings in JavaScript Allow most characters except return (Enter), backspace, tab, \ Double quoted strings can contain single quoted strings and vice versa ( “My dog ‘Spot’ is a yellow Lab” )

18. Any number of characters allowed in a string Even " " (empty string) Quotes do not count in figuring a string’s length Empty string is length 0 " " has length 1 Rules for Writing Strings in JavaScript

19. Literals Literal: term for a string or number value String Literals stored in memory Quotes are removed Any character can be stored in memory Even characters that cannot be typed vartwoTabs = “\t\t”, singQuote=“\’”

21. Boolean Values Two logical values: true and false Not identifiers or strings Used implicitly; only occasionally for initializing variables Mostly used in comparisons (if (x < 5)) vardone = false, simpleMode = true, speed = 42;

22. The Assignment Statement Used to change a variable's value <variable> <assignment symbol> <expression> ; Assignment Symbol In JavaScript, the equal sign ( = )

23. Interpreting an Assignment Statement Read assignment symbol as "gets“ speed = 42 * 3; Expression is evaluated first If there are any variables in it, their current value is used Then computed value becomes value of variable on left side

24. A Key Point about Assignment Programming is not Algebra Consider this statement x = x + 1 18-24

25. An Expression and its Syntax Expression is math-like formula Built out of values and operators standard arithmetic operators relationaloperators compare values logicaloperators and string operators too

26. Arithmetic Operators Add, subtract, multiply, divide ( +, -, *, / ) Multiplication must be given explicitly 2ab in math => 2 * a * b Multiply and divide take precedence over add and subtract Override with parens

27. Arithmetic Operators Modulus or mod ( % ) divides two integers and returns remainder No exponentiation Binary operators operate on two operands like + and * and % Unary operators operate on one operand like - for negation

28. Relational Operators Make comparisons between numeric values Outcome is a Boolean value, true or false < less than <= less than or equal to == equal to (note difference between = and ==) != not equal to >= greater than or equal to > greater than 5 < 10 evaluates to true 8.54 == 14.7 evaluates to false speed > 42 depends

29. Logical Operators Used with Boolean values Logical And Operator is && Outcome of a && b is true if both a and b are true; otherwise it is false Logical Or Operator is || Outcome of a || b is true if either a is true or b is true Logical Not Operator is ! Unary operator. Outcome is opposite of value of operand

30. To test two or more relationships together Teenagers are older than 12 and younger than 20 var age = 6 Evaluate age > 12 && age < 20 age > 12 evaluates tofalse age < 20 evaluates totrue Finally,false && true evaluates tofalse Try it forvar age = 14 Logical Operators

31. Operators (cont'd) Operator Overload Use of one operator symbol with different data types Example: + Addition 4 + 5 produces 9 Concatenation "four" + "five" produces "fourfive"

32. A Conditional Statement Conditional statements: perform tests based on variable values if(<Boolean expression> ) <then-statement> ; Boolean expression is usually a relational expression

33. If Statements and Their Flow of Control Boolean statement (predicate), is evaluated If outcome is true, then-statementis performed If outcome is false, then-statementis skipped

34. Compound Statements Then-statement can be a sequence of statements (compound stmt) Group with curly braces { } if (waterTempC < 0) { waterState = “solid”; description = “ice”; }

35. if/else Statements To execute statements if a condition is false if ( <Boolean expression> ) { <then-statements>;} else { <else-statements>;} Boolean expression is evaluated first If outcome is true, then-statements are executed and else-statementsare skipped If outcome is false, then-statementsare skipped and else-statementsare executed

36. Nested if/else Statements A then-statement (or an else-statement) can contain another if/else By rule, an else is associated with closest preceding if Use curly braces to avoid confusion

37. Nested if/else Statements if (<Boolean exp1>) if (< Boolean exp2>) { <then-stmts for exp2>; } else { <else-stmts for exp2>; } if (<Boolean exp1>) { if (< Boolean exp2>) { <then-stmts for exp2>; } } else { <else-stmts for exp1>; }

38. Freely Use Braces for Clarity if (flip1 == guess1) { if (flip2 == guess2) score = “win win”; else score = “win lose”; } else { // here we lost the first if (flip2 == guess2) score = “lose win”; else score = “lose lose”; }

39. The Espresso Program (again)

40. The Espresso Program Line 3 is a basic conditional statement Lines 4-4c use an if statement with conditionals in the then statement Line 5 uses basic if statement Lines 6, 7 compute using arithmetic operators Try tracing the logic for a “double tall latte” drink=“latte”; ounce=12; shots=2;

41. Summary Variables: names and values Initialization and assignment Data types Expressions

42. Summary Operators Arithmetic Relational Logical Conditional statements Compound statements