Advanced JSThe World's Most Misunderstood Programming Language) Douglas Crockford(

Shimon Dahan

sdahan@jbh.co.il

• Basic JavaScript Overview• Closures• JavaScript Objects Model• Prototype• Inheritance• More OOP Concepts

Agenda

Variables

• Variable names are case-sensitive.• Variables can be implicitly declared• JavaScript is a loosely typed language• Variables types• Variables scope • === VS ==

Basic JavaScript

Functions • functions are objects

• special feature: invokable

• Can pass more argument (or less) that declared• arguments property

• The arguments of a function are maintained in an array-like object

• Functions always return something• this keyword – call & apply

Functions• Functions can be defined inside of other

functions.

• Primitive values• Undefined, Null, Boolean, Number, and String

• Reference values• Array or a user-defined object

• Parameters are always passed by value.• Note that if you pass an object, the address of the

object is passed by value, but changes we make affects the original object.

Reference & Value

• An inner function has access to the variables and parameters of functions that it is contained within.

• The scope that an inner function enjoys continues even after the parent functions have returned

Closure

• What’s an object?• a hash of key => value pairs• if a key (property) happens to be a function, we can call

it a method

• Object literal notation • { Wrapped in curly braces }• ,-delimited properties• key:value pairs

• The scope that an inner function enjoys continues even after the parent functions have returned

JavaScript Objects Model

• Constructors• When invoked with new, functions return an object

known as this• You have a chance of modifying this before it's

returned

JavaScript Objects Model

• A Public Method is a function that uses this to access its object

• This binding of this to an object happens at invocation time

• Use Closure for private fields

Encapsulation

• A property of the Function objects• A prototype is an object from which other

objects inherit properties• The prototype chain

Prototype

Inheritance via the prototype

var Dad = function () { this.family = “Levi"; }; var Kid = function () { }; Kid.prototype = new Dad(); var moti = new Kid();

Class-based (Java)Prototype-based (JavaScript)

Class and instance are distinct entities.All objects are instances.

Define a class with a class definition; instantiate a class with constructor methods.

Define and create a set of objects with constructor functions.

Create a single object with the new operator.Same.

Construct an object hierarchy by using class definitions to define subclasses of existing classes.

Construct an object hierarchy by assigning an object as the prototype associated with a constructor function.

Inherit properties by following the class chain.Inherit properties by following the prototype chain.

Class definition specifies all properties of all instances of a class. Cannot add properties dynamically at run time.

Constructor function or prototype specifies an initial set of properties. Can add or remove properties dynamically to individual objects or to the entire set of objects.

:(תודה