JavaScript binding, function apply, function call
In JavaScript, binding is always explicit, and can be easily lost, so a method using “this” will not refer to the proper object in all situations, unless you force it to. JavaScript provides two options to do explicit binding “apply” and “call”.
Apply
Every JavaScript function is equipped with “apply” method that allows you to call the function with specific binding. I takes two arguments, the binding object and an array of arguments to be passed to the function.
fun.apply(thisArg[, argsArray])
Call
“Call” method is similar to “apply”, but it takes the arguments themselves not an array.
fun.call(thisArg[, arg1[, arg2[, ...]]])
References
- http://www.alistapart.com/articles/getoutbindingsituations
- https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/apply
- https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/call
- http://stackoverflow.com/questions/962033/what-underlies-this-javascript-idiom-var-self-this
JavaScript event delegation
JavaScript event delegation is a simple technique by which you add a single event handler to a parent element in order to avoid having to add event handlers to multiple child elements.
Event capturing
Netscape defined an approach called event capturing, where events occur on the highest object in the DOM tree and then work down to the deepest element affected by the event.
Event bubbling
IE defined event bubbling. The deepest element affected by the event should receive the event first , then its parent, etc., until the document object finally receives the event.
W3C DOM level 2 events specification defines both event bubbling and capturing. First the document receives the event, then the capturing phase commences to the most specific element affected by the event. Once the event is handled by the element, it bubbles back up to the document.
Advantages
- Less event handlers to setup and reside in memory.
- No need to re-attach handlers after a DOM update.
References:
JavaScript private public privileged access
Public
The members of an object are all public members. There are two ways for putting members in a new object.
In Constructor
function Container(param) {
this.member = param;
}
In the prototype
This technique is used to add public methods.
Container.prototype.stamp = function (string) {
return this.member + string;
}
Private
Private members are made by the constructor. Ordinary vars and parameters of the constructor become the private members.
function Container(param) {
this.member = param;
var secret = 3;
var that = this;
}
Privileged
A privileged method is able to access private methods, variables and is itself accessible to the public method and the outside. Privileged methods are assigned with “this” within the constructor.
function Container(param) {
this.member = param;
this.service = function () {
return this.member;
};
}
References:
JavaScript function declaration, function expression, Function constructor, Anonymous function
Function declaration
function name([param[, param[, ... param]]]) {
statements
}
Example
function sum(a, b)
{
return a + b;
}
name - The function name
param - The name of the argument to be passed to the function. A function can have up to 255 arguments.
statements - The body of the function
Function expression
function [name]([param] [, param] [..., param]) {
statements
}
Example
var sum = function(a, b) { return a + b; }
Anonymous function
The name can be omitted in which case it becomes anonymous function. Anonymous functions can help make code more concise when declaring a function that will only be used in one place.
Example
var ar = [1,2,3];
var newAr = ar.map(function(e) { return e * 2});
console.log(newAr); //[2,4,6]
Function constructor
Function objects can be created with new operator
new Function (arg1, arg2, ... argN, functionBody)
Example
var sum = new Function('a','b', 'return a + b;');
arg1, arg2, … argN - zero or more names to be used by the function as argument names
functionBody - A string containing JavaScript statements forming the function body.
References
Object Oriented Programming
Object
Object is an instance of a class. All objects have a state and behavior.
Class
Class is the blueprint from which individual objects are created
Inheritance
Object-oriented programming allows classes to inherit commonly used state and behavior from other classes. In Java programming language, each class is allowed to have one direct superclass, and each superclass has the potential for an unlimited number of subclasses.
Interface
Methods form the object’s interface with the outside world. An interface is a group of related methods with empty bodies. Interface separates implementation and defines the structure. It is useful when the implementation changes frequently. Interface forms a contract between the class and the outside world.
Abstract Class
Abstract classes cannot be instantiated. It can only be used as a super class for other classes that extend the abstract class. Abstract classes are declared with keyword abstract. Abstract class methods can have implementations. Abstract class’s methods can’t have implementation only when declared abstract.
Encapsulation
Encapsulation is inclusion within a program object of all the resources needed for the object to function. It allows class to change its internal implementation without hurting the overall functioning of the system.
Polymorphism
Polymorphism is the ability to request that the same operations be performed by a wide range of different types of things.
Method overloading
Ability to define several methods all with the same name
Method overridding
Subclass overrides a specific implementation of a method that is already provided by one of its super classes.