Add to collection(s) Add to saved
  1. Engineering & Technology
  2. Computer Science
  3. Computer Programming

JavaScript Fundamentals

advertisement 
2440: 211
Interactive Web Programming
JavaScript Fundamentals
Programming Language Elements
 Key words (reserved words) – words with a special




meaning in the programming language
Operators – symbols or words that perform operations
on one or more operands
Punctuation – serve specific purposes like marking the
beginning and ending of a statement
Programmer-defined names – words or names defined
by the programmer
Syntax – rules that dictate how keywords and operators
may be used and where punctuation symbols must
appear
JavaScript Fundamentals
2
Methods of Programming
 Two primary methods of programming are:
 Procedural – creates programs made up of variables
and procedures
 Variable – named storage location in a computer’s memory
 Procedure – set of programming language statements that
perform a specific task
 Object-oriented – creates programs made up of
objects (instances of a class)
 Object – a software entity with attributes (fields) and
methods (procedures associated with an object)
 Class – specifies the attributes and methods of objects
JavaScript Fundamentals
3
Basic JavaScript Tips
 All JavaScript programs must be stored in
 A Web page’s <head> or <body> element or
 A separate file with a .js extension
 Comments are ignored by the compiler
 JavaScript is case-sensitive
 For every opening brace, there must be a corresponding
closing brace
 JavaScript statements are terminated with semicolons
(;), except comments, method headers, or braces
 Only when you want to separate statements that are placed on a
single line
 But it is good practice to end all statements with semicolons
JavaScript Fundamentals
4
JavaScript Programs
 Run from a Web page as scripts
 Can either be:
 Placed in a Web page’s <head> or <body> element
 Using the <script> element with a type attribute to indicate the scripting
language of choice
 E.g.
<script type=“text/javascript”>
JavaScript commands
</script>
 The language attribute (deprecated) can also be used for HTML documents
 E.g.
<script language=“JavaScript”>
JavaScript commands
</script>
 Saved in an external text file with a (.js) file extension
 Saved JavaScript file is accessed using the <script> element
 E.g.
<script type=“text/javascript” src=“javascriptfile.js”>
JavaScript Fundamentals
5
Comments
 Non executable statements
 Used to document code
 The two JavaScript comments are:
 Line comments
 E.g. // Line comment here
 Paragraph comments
 E.g. /* Paragraph comments here */
 Used to hide JavaScript code from browsers that do not support
JavaScript code
 HTML/XHTML comments may be used for this purpose
 E.g.
<script type=“text/javascript”>
<!– Hide from non-JavaScript browsers
JavaScript commands
// Stop hiding from non-JavaScript browsers -->
</script>
JavaScript Fundamentals
6
JavaScript Statements
 JavaScript is an object-based language
 Uses objects by modifying their properties or applying their
methods
 Object – any software entity with attributes (properties) and
procedures (methods)
 Example of JavaScript objects include document, window, Date,
Math, etc
 Property (attribute) – description of an object
 E.g. window.status
 Procedure (method) – used to perform specific tasks on objects
 E.g. document.writeln()
 The period (.) is used to distinguish between an object and its
properties and procedures
 E.g.
 document.writeln() // uses the document’s writeln() procedure
 window.alert // uses the window’s status property
JavaScript Fundamentals
7
Sending Output to a Web
Document
 The document object’s write( ) and writeln( ) methods
are used to send output to a Web page
 E.g. document.writeln(“JavaScript is fun…”);
 Single line strings must be placed on a single line as
shown above
 An error is generated when a line break is found
 E.g.
document.writeln(“JavaScript is
fun… “);
 If line breaks have to be included use the following methods
 Examples:
document.writeln(“JavaScript is \
fun… “);
document.writeln(“JavaScript is “ +
“fun… “);
JavaScript Fundamentals
8
Sending Output to a Web
Document…
 The only difference between the write()
and writeln() methods is that the writeln()
adds a line break after the output
 The difference is only recognized in a <pre>
element
JavaScript Fundamentals
9
Regular Outputs on a Web page
<script type="text/javascript">
<!-- hide from non-JavaScript browsers
// Javascript line comments here
/* JavaScript paragraph/block comments
here
document.writeln("Hello...");
document.write("I love JavaScript
programming...");
// Stop hiding from non-JavaScript browsers -->
</script>
JavaScript Fundamentals
10
Outputs within <pre> Element
<pre>
<script type="text/javascript">
<!-- hide from non-JavaScript browsers
// Javascript line comments here
/* JavaScript paragraph/block comments here
document.writeln("Hello...");
document.write("I love JavaScript programming...");
// Stop hiding from non-JavaScript browsers -->
</script>
</pre>
JavaScript Fundamentals
11
Debugging
 The process of removing errors in a program
 Bug – an error in a program
 Types of errors include:
 Syntax errors – violates rules of the programming language
 Logical errors – cause programs to produce wrong results
 Common syntax errors include:





Missing quotes
Mismatched quotes
Mismatched parenthesis or braces
Misspelled user-defined names
Missing punctuations
JavaScript Fundamentals
12
Download
advertisement