Javascript Client-side scripting. Up to now  We've seen a little about how to control  content with HTML  presentation with CSS  Javascript is a language.

Slides:



Advertisements
Similar presentations
JavaScript I. JavaScript is an object oriented programming language used to add interactivity to web pages. Different from Java, even though bears some.
Advertisements

Introducing JavaScript
JavaScript FaaDoOEngineers.com FaaDoOEngineers.com.
Programming Languages and Paradigms The C Programming Language.
Javascript It’s not JAVA. What do these all have in common?
1 CSC 551: Web Programming Spring 2004 client-side programming with JavaScript  scripts vs. programs  JavaScript vs. JScript vs. VBScript  common tasks.
The Web Warrior Guide to Web Design Technologies
Outline IS400: Development of Business Applications on the Internet Fall 2004 Instructor: Dr. Boris Jukic JavaScript: Introduction to Scripting.
12-Jun-15 JavaScript Language Fundamentals I. 2 About JavaScript JavaScript is not Java, or even related to Java The original name for JavaScript was.
Working with JavaScript. 2 Objectives Introducing JavaScript Inserting JavaScript into a Web Page File Writing Output to the Web Page Working with Variables.
XP 1 Working with JavaScript Creating a Programmable Web Page for North Pole Novelties Tutorial 10.
Javascript II Expressions and Data Types. 2 JavaScript Review programs executed by the web browser programs embedded in a web page using the script element.
PHP Server-side Programming. PHP  PHP stands for PHP: Hypertext Preprocessor  PHP is interpreted  PHP code is embedded into HTML code  interpreter.
2012 •••••••••••••••••••••••••••••••••• Summer WorkShop Mostafa Badr
Introduction to PHP. PHP PHP is the Hypertext Pre-processor –Script language –Embedded into HTML –Runs as Apache module –Can use DB (MySQL, Oracle, Microsoft.
JavaScript: Control Structures September 27, 2005 Slides modified from Internet & World Wide Web: How to Program (3rd) edition. By Deitel, Deitel,
WEB DESIGN AND PROGRAMMING Introduction to Javascript.
JavaScript JavaScript is a scripting language that is most commonly used to add client- side programming to a web page. Some of the things it is used for.
JavaScript, Fifth Edition Chapter 1 Introduction to JavaScript.
JavaScript Defined DOM (Document Object Model) General Syntax Body vs. Head Variables Math & Logic Selection Functions & Events Loops Animation Getting.
Created by, Author Name, School Name—State FLUENCY WITH INFORMATION TECNOLOGY Skills, Concepts, and Capabilities.
SYST Web Technologies SYST Web Technologies Lesson 6 – Intro to JavaScript.
CNIT 133 Interactive Web Pags – JavaScript and AJAX JavaScript Data Types.
CP476 Internet Computing JavaScript Client-Side Programming 1 1. What is JavaScript –Another script language for both client-side and sever-side programming.
1 JavaScript. 2 What’s wrong with JavaScript? A very powerful language, yet –Often hated –Browser inconsistencies –Misunderstood –Developers find it painful.
CISC474 - JavaScript 03/02/2011. Some Background… Great JavaScript Guides: –
Chap 3 – PHP Quick Start COMP RL Professor Mattos.
Client Scripting1 Internet Systems Design. Client Scripting2 n “A scripting language is a programming language that is used to manipulate, customize,
Javascript. Outline Introduction Fundamental of JavaScript Javascript events management DOM and Dynamic HTML (DHTML)
INTRODUCTION TO JAVASCRIPT AND DOM Internet Engineering Spring 2012.
CMPS 211 JavaScript Topic 1 JavaScript Syntax. 2Outline Goals and Objectives Goals and Objectives Chapter Headlines Chapter Headlines Introduction Introduction.
XP Tutorial 10New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Working with JavaScript Creating a Programmable Web Page for North Pole.
TUTORIAL 10: PROGRAMMING WITH JAVASCRIPT Session 2: What is JavaScript?
20-753: Fundamentals of Web Programming 1 Lecture 12: Javascript I Fundamentals of Web Programming Lecture 12: Introduction to Javascript.
Lecture 9 The Basics of JavaScript Boriana Koleva Room: C54
JavaScript Syntax and Semantics. Slide 2 Lecture Overview Core JavaScript Syntax (I will not review every nuance of the language)
4.4 JavaScript (JS) Deitel Ch. 7, 8, 9, JavaScript & Java: Similarities JS (JavaScript) is case-sensitive Operators –arithmetic: unary +, unary.
Basic Data Types Numbers (integer and floating point)‏ Strings (sequences of characters)‏ Boolean values (true/false)‏
XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 1 Working with JavaScript Creating a Programmable Web Page for North Pole Novelties Tutorial.
JavaScript Scripting language What is Scripting ? A scripting language, script language, or extension language is a programming language.
JavaScript History and Versions JavaScript was introduced as part of the Netscape 2.0 browser Microsoft soon released its own version called JScript ECMA.
4. Javascript M. Udin Harun Al Rasyid, S.Kom, Ph.D Lab Jaringan Komputer (C-307) Desain.
COP 3813 Intro to Internet Computing Prof. Roy Levow Lecture 4 JavaScript.
JavaScript Defined DOM (Document Object Model) General Syntax Body vs. Head Variables Math & Logic Selection Functions & Events Loops Animation Getting.
“The world’s most misunderstood language has become the world’s most popular programming language” Akshay Arora
Introduction to JavaScript CSc 2320 Fall 2014 Disclaimer: All words, pictures are adopted from “Simple JavaScript”by Kevin Yank and Cameron Adams and also.
JavaScript is an object-based scripting language that is lightweight and cross-platform. 3-Feb-16 JavaScript.
Rich Internet Applications 2. Core JavaScript. The importance of JavaScript Many choices open to the developer for server-side Can choose server technology.
1 PHP Intro PHP Introduction After this lecture, you should be able to: Know the fundamental concepts of Web Scripting Languages in general, PHP in particular.
Dr. Abdullah Almutairi Spring PHP is a server scripting language, and a powerful tool for making dynamic and interactive Web pages. PHP is a widely-used,
Javascript Basic Concepts Presentation By: Er. Sunny Chanday Lecturer CSE/IT RBIENT.
XP Tutorial 10New Perspectives on HTML, XHTML, and DHTML, Comprehensive 1 Working with JavaScript Creating a Programmable Web Page for North Pole Novelties.
1 Agenda  Unit 7: Introduction to Programming Using JavaScript T. Jumana Abu Shmais – AOU - Riyadh.
JavaScript: A short introduction Joseph Lee Created by Joseph Lee.
JavaScript Tutorial First lecture 19/2/2016. Javascript is a dynamic computer programming language. It is lightweight and most commonly used as a part.
Javascript Prof. Wenwen Li School of Geographical Sciences and Urban Planning 5644 Coor Hall
PHP using MySQL Database for Web Development (part II)
Scope, Objects, Strings, Numbers
JavaScript Syntax and Semantics
JavaScript.
JavaScript an introduction.
Web Systems Development (CSC-215)
PHP.
T. Jumana Abu Shmais – AOU - Riyadh
JavaScript CS 4640 Programming Languages for Web Applications
Tutorial 10: Programming with javascript
The <script> Tag
PHP an introduction.
SEEM 4540 Tutorial 4 Basic PHP based on w3Schools
JavaScript CS 4640 Programming Languages for Web Applications
Presentation transcript:

Javascript Client-side scripting

Up to now  We've seen a little about how to control  content with HTML  presentation with CSS  Javascript is a language that can be used to control browser actions

Javascript language  General-purpose language designed to be embedded within other applications  C-like syntax  Object-oriented  Interpreted  Built-in garbage collection  Support for regular expressions  Built-in security - can't read local files or do networking

What JavaScript can do  Control document appearance and content  Control the browser  Interact with forms  Validate user input  Interact with user  Use cookies

JavaScript is several languages  JavaScript - implemented by Netscape (and later Mozilla)   Jscript - Microsoft version  ECMAScript -standardized version of the language  international.org/publications/standards/Ecma-327.htm  JavaScript is not related to Java

How to use JavaScript  JavaScript can be embedded into your html pages in a couple of ways  in elements in both and elements of page  in event attributes of appropriate elements  You can also reference external files containing JavaScript code 

Basic Syntax  Case-sensitive  Insensitive to whitespace  ; line terminator is optional (unless result is ambiguous)  // and /* … */ comments  Same rules for identifiers as Java

Variables  Must be declared before they can be used var i; var x, y;  using undeclared variable causes an implicit declaration - resulting variable is global  variables declared in functions are local  Untyped  can be assigned to values of any type

Types  Primitive types  numbers  strings  booleans - true or false  &&, || and !  null  undefined  Reference types  objects: unordered collection of named values  arrays: ordered collection of unnamed values  functions  special classes  Date  RegExp

Numbers  Numbers - all stored using IEEE bit standard  Literals  integer :  Hex : 0xff 0xCAFE911  Octal : 0377  Floating point : e23 1.6e-19  Operations: standard arithmetic, functions of Math object, relational operators, bitwise operators  Special values: Infinity, NaN, Number properties

Strings  Sequence of Unicode characters  Literals can be enclosed in either single or double quotes  Escape sequences include the ones you are used to plus the ability to represent a character by its Unicode ( \uXXXX )  Concatenate with +

String properties and methods  length - the number of characters in the string  charAt( index) - index from 0  substring( start, endPlus1)  use + to concatenate strings

Functions  A piece of executable code  First-class objects  Definition function square(x) {return x*x; }  Literal functions var square = function(x){return x*x; } var square = new Function( "x", "return x*x;”);

Objects  An object is collection of named values which are referred to as the properties of the object  property that is a function is called a method  Objects are created with new var o = new Object()  Object literals var point = {x:2.3, y:-1.2}

Using Objects  Once the object is created, you can add and use whatever properties you need var point = new Object(); point.x = 2.3; point.y = -1.2  Use the in operator to check if an object has a particular property var hasXcoord = "x" in point;

Arrays  Arrays are indexed collections of data values  size is dynamic  Creating arrays var a = new Array(); // now add elements a[0] = 1.2; a[1]="JavaScript"; … var b = new Array( 1.2, "JavaScript", true, …} var c = new Array(5); //5-element array  Array Literals var a = [1.2, "JavaScript", true, {x:1, y:3}]

Statement Types  Expression statements have side effects  Assignment - both simple ( = ) and compound ( +=, -=, …)  delete  function calls (with no return value)  Compound statements - enclosed in { }  no block scope in JavaScript  var for declaring variables

Selection  if if (cond1) stmt1; elseif (cond2) stmt2; … else stmtLast;  switch switch (n) { case 1: block1; break; … default: defaultBlock; }

Repetition  while while (cond) stmt;  do/while do stmt; while (cond);  for for (init; test; update) stmt;  for/in for (var in obj) stmt; loops through elements of array or properties of object

More statement types  function  return  throw  try/catch/finally  with - used to temporarily modify scope chain  ; is empty statement

Sources  Web Design and Programming by Paul S. Wang and Sanda S. Katila  JavaScript The Definitive Guide by David Flanagan  dbook/javascript/ dbook/javascript/  international.org/publications/standards/Ecma- 262.htm