+ All Categories
Home > Technology > Javascript session 01 - Introduction to Javascript

Javascript session 01 - Introduction to Javascript

Date post: 26-Jun-2015
Category:
Upload: livingston-samuel
View: 1,619 times
Download: 6 times
Share this document with a friend
Popular Tags:
33
Introduction to Javascript
Transcript
Page 1: Javascript session 01 - Introduction to Javascript

Introduction to Javascript

Page 2: Javascript session 01 - Introduction to Javascript

History of Javascript

oFirst appeared in 1995

oMain purpose was Input validation

oNetscape Navigator 3

oCmm -> ScriptEase -> Expresso Pages

oBrendan Eich

oMocha -> LiveScript -> Javascript

oIE 3 & Jscript

oECMAScript – 1997

Page 3: Javascript session 01 - Introduction to Javascript

Javascript Implementation

oThe Core (ECMAScript)

oDocument Object Model (DOM)

oBrowser Object Model (BOM)

Page 4: Javascript session 01 - Introduction to Javascript

Implementations of ECMAScript

oJavascript

oJScript

oActionScript

oEjscript

oJSCript 3.0

Page 5: Javascript session 01 - Introduction to Javascript

DOM

oAPI for XML & HTML documents

oHierarchy of Nodes

Page 6: Javascript session 01 - Introduction to Javascript

<html><head>

<title>DOM Example</title></head><body>

<p>Welcome to the DOM</p></body>

</html>

HTML Document

Page 7: Javascript session 01 - Introduction to Javascript

HTMLHEAD

TITLEDOM Example

BODYP

Welcome to the DOM

DOM Hierarchy Representation

Page 8: Javascript session 01 - Introduction to Javascript

DOM

oControl of Content & Structure

oAdd, remove and modify nodes

oStandards

oLevels

oDOM Level 0

oDOM Level 1

oDOM Level 2

oDOM Level 3

Page 9: Javascript session 01 - Introduction to Javascript

DOM

oLevel 0

oNetscape Navigator 3 & IE 3

oPrimitive

oLevel 1

oDOM Core

oDOM HTML

Page 10: Javascript session 01 - Introduction to Javascript

DOM

oLevel 2

oViews

oEvents

oStyles

oTraversal

oRange

Page 11: Javascript session 01 - Introduction to Javascript

DOM

oLevel 3

oDOM Load & Save

oDOM Validation

oXpath

oXML Base

Page 12: Javascript session 01 - Introduction to Javascript

DOM

oOther DOMs

oScalable Vector Graphics (SVG)

oMathematical Markup Language (MathML)

oSynchronized Multimedia Integration Language (SMIL)

Page 13: Javascript session 01 - Introduction to Javascript

DOM

oBrowser Support

oLevel 0

oNetscape Navigator 4

oInternet Explorer 4

oOpera 1 – 6

oLevel 1

oNetscape Navigator 6+

oInternet Explorer 5+

oOpera 7+

oSafari

Page 14: Javascript session 01 - Introduction to Javascript

DOMoBrowser Support Cont..

oLevel 2

oInternet Explorer 8

oSafari 2+

oChrome

oOpera 7+

oLevel 3

oSafari 3+

oChrome 2+

oFirefox 1+

oOpera 9+

Page 15: Javascript session 01 - Introduction to Javascript

BOM

oInternet Explorer 3

oInteract with the Browser

oNo Standards

Page 16: Javascript session 01 - Introduction to Javascript

BOM

oOpening windows – window.open

oMove, resize & close windows

oNavigator object

olocation object

oscreen object

oCookie

oXMLHttpRequest

Page 17: Javascript session 01 - Introduction to Javascript

Browser Engines

oTrident

oGecko

oWebKit

oKHTML

oPresto

Page 18: Javascript session 01 - Introduction to Javascript

Javascript Language

oECMAScript 3rd Edition

oC, Perl Syntax

oCase Sensitive

Page 19: Javascript session 01 - Introduction to Javascript

oIdentifiers

oA-Z, a-z, 0-9, $, _

oCannot use Keywords and reserved words

oComments

o//single-line comments

o/* */ multi-line comments

Page 20: Javascript session 01 - Introduction to Javascript

Statements

oEnds with ;

ois optional

obut recommended

var sum = a + bvar difference = a – b;

Page 21: Javascript session 01 - Introduction to Javascript

Statements

oMultiple statements wrap in { }

if (true === true) {var msg = “hello”;alert(msg + “world”);

}

Page 22: Javascript session 01 - Introduction to Javascript

break else new varcase finally return voidcatch for switch whilecontinue function this

withdefault if throwdelete in trydo instanceof typeof

Keywords

Page 23: Javascript session 01 - Introduction to Javascript

abstract enum intshortboolean export interface

staticbyte extends long superchar final nativesynchronizedclass float packagethrowsconst goto private transientdebugger implements protected

volatiledouble import public

Reserved Words

Page 24: Javascript session 01 - Introduction to Javascript

Variables

oLoosely typed

oCan hold any data

oCan be modified and contain different type of value

o‘var’

oscope

Page 25: Javascript session 01 - Introduction to Javascript

function myFunction () {var myVariables = ‘some string’;

}

alert(myVariables); //undefined

var a = 1, b = ‘hello’, myArray = {};

Page 26: Javascript session 01 - Introduction to Javascript

Datatypes

oFive primitive datatypes

oUndefined

oNull

oBoolean

oNumber

oString

o‘typeof’ operator

o‘objects’

Page 27: Javascript session 01 - Introduction to Javascript

Undefined

var temp;alert(temp); //undefined

alert(typeof temp === ‘undefined’) //true

Page 28: Javascript session 01 - Introduction to Javascript

Null

var temp = null;

alert(null == undefined) //true

alert(null === undefined) //false

oEmpty object pointer

Page 29: Javascript session 01 - Introduction to Javascript

Boolean

true false

String non-empty string empty stringNumber non-zero 0Object any object

Undefined – falseNull - false

oBoolean()

Page 30: Javascript session 01 - Introduction to Javascript

Number

var intNum = 100; //integervar octNum = 070; //Octal for 56var hexNum = 0xA; //Hex for 10var floatNum1 = 1.1; //floatvar floatNum2 = 1.; //1 integervar floatNum3 = 0.1; //1 integervar lrgFloat = 3.125e7; //31250000

//3.125 * 10^7

oIntegers & floating point values

Page 31: Javascript session 01 - Introduction to Javascript

Number

isNaN(NaN); //trueisNaN(10); //falseisNaN(’10’); //falseisNaN(‘cool’); //trueisNaN(true); //false

oNaN – not a number

oisNaN()

oNaN === NaN

Page 32: Javascript session 01 - Introduction to Javascript

NumberoNumber()

oNumber.MIN_VALUE

oNUMBER.MAX_VALUE

oInfinity

oisFinite()

Page 33: Javascript session 01 - Introduction to Javascript

String

Object


Recommended