1. Piyush Katariya
corporate.piyush@gmail.com

2.  First appearance in Netscape Navigator 2.0 in Sept 1995
 Microsoft launched JScript as alternative in Aug 1996
 Request for Standardization in Nov 1996
 ECMA-262 specification in June 1997
 Third edition in Dec 1999
 Fifth edition in Dec 2009
 Sixth edition expected by mid 2015
 Today – Preferred programming language of the Web
 Not limited to Web Browsers – node.js, ringo.js

3.  Imperative, Object Oriented, Functional, and Prototypal
 Dynamic
 Single Threaded
 Asynchronous, Event Driven
 Sandboxed
 God created the earth in 7 days.
Brendan Eich created JavaScript in 10 days. 

4. UI Thread
Browser
DOM
Work Queue
JS Engine Layout Engine
Operating System
C P U G P U

5.  Never mind ! Everything is a var
 var stringVariable = “JavaScript”
 var booleanVariable = true
 var intVariable = 10
 var floatVariable = 10.5
 Numbers are treated as float
 null !== undefined
 Falsy values – 0 (zero), NaN, ‘’, false, null, undefined

6.  Object is collection of key–value pairs with optional hidden link to prototype object
 Instantiation
 var obj = new Object()
 var objShortHand = { }
 var objWithInitialValue = { “property” : “value”}
 var objTheUltimate = Object.create(parentObject)
 Access
 obj.property
 obj[“property”]
 obj.nestedObj.property
 obj[“nestedObj”].property
 Runtime Mutation
 obj.newProperty = “value”
 obj.nestedObj = { “property” : “value”}
 obj.nestedObj[“property”] = “different value”
 Deletion
 delete obj.property

7.  Callable first class citizen
 Linked to Function.prototype linked to Object.prototype
 Can be passed and return as object
 No Overloading
 Definitions
 var add = new Function(‘a’, ‘b’, ‘return a + b’);
 var add = function (a, b) { return a + b; };
 function add(a, b) { return a + b;}
 Blessed with
 this
 arguments

8. Function invocation (Direct Invocation)
 add(1, 2)
 isPalindrome(‘madam’)
 this bound to global object !!!

9. Method Invocation
 Method => a function stored as property of object
 this bound to method holder object
var obj = {
value : 0, //zero
increment : function (inc) {
this.value += typeof inc === ‘number’ ? inc : 1;
}
}
obj.increment(1) ; // 1
obj.increment(2); // 3

10. var someClass = function (property) {
this.publicProperty = property;
var privateVariable = “value”;
this.publicMethod = function () {
//code for method definition
};
var privateMethod = function () {
//code for method definition
};
// return this;
}

11. Constructor Invocation
 JS way of creating objects OO style
var EmployeeClass = function (firstName, designation) {
this.firstName = firstName;
this.designation = designation;
};
EmployeeClass.protoype.getFirstName = function () { return this.firstName;};
EmployeeClass.protoype.getDesignation = function () { return this.designation;};
var employee = new EmployeeClass(‘Piyush’, ‘Software Dev’)
employee.getFirstName(); // ‘Piyush’
employee.getDesignation(); // ‘Software Dev’

12. Apply Invocation (Reflective Invocation)
var argsArray = [2, 3];
var sum = add.apply( null, argsArray); // 3
//OR
var sum = add.call( null, 2, 3); //3
var firstName = EmployeeClass.getFirstName.apply(empObject);
//OR
var firstName = EmployeeClass.getFirstName.call(empObject);

13.  Facilitates late(runtime) binding
Function.prototype.bind = function (objToBind) {
var self = this;
return function () {
var argArr = Array.prototype.slice.call(arguments);
return self.apply(objToBind || null, argArr);
};
}

14.  Use when some of the inputs to function are always known
Function.prototype.curry = function () {
var initArgs = Array.prototype.slice.call(arguments);
var self = this;
return function () {
var args = Array.prototype.slice.call(arguments);
return self.apply(null, initArgs.concat(args))
}
};

15.  Never ever ever make use for loop again while operating on Arrays !
 var names = [‘Piyush’, ‘James’, ‘Shwetha’, ‘Kapil’, ‘Praveen’, ‘Matt’, ‘Nag’, ‘Shabina’]
 map => conversion function which get executed for every element
 names.map(function(name){ return name.substring(0, 3); })
 filter => logical condition function to consider only sub set of array
 names.filter(function(name){ return name.indexOf(‘i’) > 0; })
 reduce => compute result by considering each element with optional initial value
 names.reduce(function(name1, name2) { return name1 + ‘ , ’ + name2; })
 names.reduce(function(name1, name2) { return name1 + ‘ , ’ + name2; }, ‘ Madhu’)
 sort => comparison function to order the element in custom fashion
 names.sort()
 names.sort(function(name1, name2) { return name1 < name2; })
 forEach => alternative to for loop to just focus on operation
 names.forEach(function(name) { console.log(name); })
 every => does every element in array satisfies the logical condition
 some => does at least one element in array satisfies the logical condition
 reduceRight => same as reduce but iterates array from last to first index

16.  It’s a LIVE chain

17.  Avoid global variables and functions
 Use parseInt(obj, 10)
 eval function is evil !
 ‘===’ and ‘!== ’ for comparison
 Never use void, becoz its operator !
 Always prefix var with variable declaration
 Use semicolons everywhere at EOL
 Never augment built in objects
 Consider underscore.js as default choice
 Use JSLint for code inspection
 And of course above all, Do Meditate ! 

18. var clockOnce = setTimeout(fn, delay)
 Execute function <fn> after <delay> milliseconds
 Queue function <fn> to execute after <delay> milliseconds
 Used to divide highly computationally complex(CPU bound) tasks
 Cancellation => clearTimeout(clockOnce)
var timer = setInterval(fn, delay)
 Execute function <fn> after every <delay> milliseconds
 Queue function <fn> to execute after every <delay> milliseconds
 Cancellation => clearInterval(timer)

19. var counterModule = ( function( ) {
var privateCount = 0;
function changeBy(val) {
return privateCount += val;
}
return {
increment : function() {
changeBy(1);
},
decrement : function() {
changeBy(-1);
},
currentValue : function() {
return privateCount;
}
};
} ) ( );

20. var Singleton = ( function () {
var instance;
function createInstance() {
var object = new Object("I am the only instance");
return object;
}
return {
getInstance : function () {
if (! instance) {
instance = createInstance();
}
return instance;
}
};
})();

21.  Why ?
 Higher level abstraction and constructs
 Type safety
 Declarative - More focus on WHAT need to be done instead of HOW
 Stick to one worthy language for end to end application stack
 Usage
 Code in your own language
 Compile it into JS (either offline or in browser itself )
 Run in browser
 Support debugging for original language in browser using source maps
 Options
 CoffeeScript
 TypeScript
 Dart
 ScalaJS
 PythonJS
 ClojureScript
 More at this link

22.  Process of removing all unnecessary characters and
modifying source code spread over single or multiple
file without changing its functionality
 Advantages
 Single artifact for whole application
 Reduced size of code
 Obfuscated code
 Applicable for JS and CSS

23.  JavaScript : The Good Parts by Douglas Crockford
 JavaScript Pattern by Stoyan Stefanov
 Wikipedia.org

24.  jQuery - for DOM access and manipulation
 Node.js – server side JS
 Require.js - async module loader
 Backbone.js – client side MVC
 Angular.js – powerpack SPA framework

25. Thank You