Patterns in JavaScript @debug_mode

Agenda

Start with Object

Functions

Constructor Pattern

Prototype Pattern

Invocation Patterns

Revealing Prototype Pattern

Revealing Module Pattern

Dhananjay Kumar– Evangelist , Telerik– Microsoft MVP – Mindcracker MVP– @debug_mode – http://debugmode.net– http://telerikhelper.net – Dhananjay.kumar@telerik.com

Your Presenter

JavaScript Objects

Using Literals Using New Operator

Using Object.create()

Object as Literal Object literal is an expression

It creates new object each time it appears in the code

A single object literal can create many objects in loop

Object using new operator new operator creates a new object

new operator initialize created object also

new operator invokes a function as give in above code snippet.

Function invoked after new operator is Constructor

Object.create()

It is a static function

It always has two parameters

• Prototype• Properties

JavaScript Functions

Anonymous functions should be assigned to a variable

Nested Functions

Nested function can access variable of parent function

Parent function cannot access variable of nested function

You cannot call nestedfunction from anywhere but the function it is nested within.

Passing Variables in Functions

Invocations Patterns

Function Invocation

Pattern

Method Invocation

Pattern

Constructor Invocation

Pattern

InDirect Invocation

Pattern

Function Invocation Pattern

When you call a function as an expression then it is known as Function Invocation Pattern

First each parameter gets evaluated and then being passed as argument to function

Function return either value or undefined to LHS variable .If called function does not have any return value then it returns undefined

Method Invocation Pattern

Function which is part of an object is known as Method

Invocation of method is known as Method Invocation Pattern

A method can access its parent object with this operator

Binding of method to object happens on execution of method

Indirect Invocation Pattern

Call() method

Apply () method

Direct method

Revealing Prototype Pattern

It is hard to maintain when functionality grows

It is hard to debug

It is hard to test

This is normally we implement it ,

Revealing Prototype Pattern

Code is reusable

Functions can be overridden by prototyping

There are no variables or functions in global namespace

Functions are loaded into memory

only once

Revealing Prototype Pattern : Overriding

Revealing Module Pattern

To Achieve Private/Public

To Achieve Singleton

To remove singleton , remove self-executable code

Questions?