CSCE 102 General Application Programming Section 1,2,3

1
CSCE 102 General Application ProgrammingSection
1,2,3

• Instructor Jin Jin
• jinj_at_cse.sc.edu

2
Introduction to Programming

• What is programming language?
• Programming language is what translates
  instructions from humans to computers.
  Programming languages are generally spelled with
  an initial cap such as Basic, C, C, Cobol,
  Fortran and Java.A typical instruction in a
  programming language look something like
• if (theLight red)
• theBrakeOn

3
Introduction to Programming

• What is scripting language?
• Series of instructions for the computer to
  execute. A scripting language is usually built
  into a specific application. Differences A
  programming language could be used to create a
  stand-alone application (software program.)
• What is Javascript?
• A great tool for adding interactivity to the
  webpage.

4
Introduction to Programming

• How does Javascript work in the webpage?
• Add javascript code to HTML/XHTML source
  document.
• A javascript interpreter is built into most
  current browsers such as internet explorer and
  navigator
• The browser interprets the HTML/XHTML code in a
  top-down fashion. When the javascript code is
  encountered, javascript interpreter interprets
  the javascript code line by line.
• Examples for javascript we are going to learn in
  class
• Webpage calculator, on-line quiz, image slide
  show etc.

5
Introduction to Javascript

• Javascript is case-sensitive
• Where to put Javascript code in HTML/XHTML?
• Embed javascript code in a ltscriptgt element
• ltscriptgt element
• ltscript typetext/javascriptgt
• Javascript instructions would go here
• lt/scriptgt
• Note 1. type is required in XHTML
• 2. Everything inside ltscriptgt element
  must be a valid Javascript instructions.

6
Introduction to Javascript

• Is it possible to have more than oneltscriptgt
  element? Yes
• Where to place ltscriptgt elements?
• Either before , after or between HTML code
• The browser uses a top-down approach in
  translating and displaying HTML and Javascript
  code.

7
Introduction to Javascript

• External file in javascript .js
• The external file must contain only Javascript
  code, no HTML code (including ltscriptgt)
• How to reference the external file?
• Adding the following in HTML/XHTML source code
• ltscript srcfilename.js typetext/javascript
  gt
• lt/scriptgt

8
Introduction to Javascript

• Syntax Errors and Logic Errors
• Syntax Errors occur when you misspell sth. or
  accidently omit a required element of an
  instruction.
• Logic Errors Syntax is correct, but the program
  will not do what you want. Also known as runtime
  errors.

9
Introduction to Javascript

• Comments in Javascript
• Single line comments
• // put your comments here
• Multiple-line comments
• / put your comments here /
• Note lt!- - comments - -gt is for HTML/XHTML code
  only.

10
Declaring and Naming Variables

• What is a variable? Something that stores a value
  and the value will change as the Javascript
  program goes on. Storage box examples
• Characteristics of variable
• Loosely typed
• Variable name
• Naming rules start with letter or
  underscore, and followed with letters, underscore
  or numbers, NO space in the variable name.
• Variable value string, numeric number or boolen
  value (true or false)

11
Declaring and Naming Variables

• Declare a variable
• ltscript typetext/javascriptgt
• var answer1, answer2, answer3
• lt/scriptgt
• Note 1. the name answer1 is different from
  Answer1
• 2. try to use more descriptive name for
  variables
• 3. var is a reserved word in
  javascript, so you can NOT use var as
  your variable name

12
Storing Values in Variables

• Initialize a variable when we create it
• 1st time, var answer42
• 2nd time, answerGeorge Washington
• 3rd time, answer true
• Note We can NOT enclose true in quotation marks
  because string is enclosed in quotation marks.
• Declare more than one variable
• var firstNumber98, secondNumber5.1,
  surferNameFred

13
Storing Values in Variables

• More examples
• var presidentName, firstUser
• presidentName George Washington
• firstUser presidentName
• alert(firstUser) display George Washington
• alert(firstUser) display firstUser
• Note firstUser is a variable and its value is
  George Washington
• firstUser is a string

14
Variables contd

• String concatenation use to combine strings,
  variables and special symbols
• typicalGreeting How are you, username
  ?
• Returning a value
• Prompt box
• var username prompt ("Please enter your name
  here", " ")
• alert("Good morning " username "\rToday you
  will learn about Javascript") // \r create
  a line break
• Confirm box
• var answer confirm("Would you like to start?")