JavaScript 101André Odendaal

Background

Netscape NavigatorDesigned by Brendon Eich in 1995Built to replace Java for the web and be “easy to use”Principles from Java (syntax), Self (prototypes) & Scheme (functional)Rushed to market with good, bad & questionable design choicesMicrosoft created Jscript, a compatible dialect to avoid trademark issues

ECMAStandardized by ECMA (European Computer Manufacturers Association)Called ECMAScript between Netscape & MicrosoftLatest version 5 includes “strict mode” for more thorough error checking

Basic Types

numberOnly 64-bit floating pointNo integers, longs, doubles, signed or unsigned to complicate mattersAssociative Law does not hold for some values

(a + b) + c === a + (b + c)

string0 or more 16-bit Unicode (UCS-2) characters. No character type

booleantrue & false

Objects

Object LiteralsDynamic (not based on pre-defined class) collection of propertiesProperty names must be a unique string within the object

Basic Operations – Get, Set & Deleteobject.name | object[name]object.name = value | object[name] = valuedelete object.name | delete object[name]

PropertyNamed collection of attributesES5 added functionality to define properties and added Get, Set functionsAttributes: value, writable, configurable, enumerable, get, set

Demo – Objects

Object Types

ArraysSpecial object with index as property names (not associative)Has properties like: length, sort(), filter()

RegExRegular expression object2 primary methods exec() returns a match and test() returns boolean

FunctionsAn object which can be invoked with parentheses ()

Demo – Objects Revisited

Other Types

nullNothing

undefinedLess than nothing

Functions

CompositionMade up of 4 parts: function, name (optional), parameters, set of statements2 additional parameters: arguments object & this (invocation context)

InvocationMethod – this is the local objectFunction – this is the global objectApply – this is passed as a parameterConstructor – this is the new object

CallingAssigning less parameters will make them undefined

Demo – Invoking Functions

Inheritance with Prototypes

Prototype with functionsAll functions have a property prototype as a base objectUse new keyword with function invocation to create new objectsConstructor functions should start with a capital letter

InheritanceIf object doesn’t have a property look in base object

Demo - Prototyping

Questions?