Javascript Closures

Aug 17, 2012

A closure is a special kind of object that combines two things: a function, and the environment in which that function was created. The environment consists of any local variables that were in-scope at the time that the closure was created.

https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Closures

Categories : JavaScript

Javascript Module Pattern

Aug 8, 2012

Module Pattern - It stays out of the global namespace, provides publicly addressable API methods, and supports protected or “private” data and methods along the way.

var myFunc = (function() {
    var privateProperty = 10;

    return {
        print: function() {
            console.log(privateProperty);
        },
        assign: function(a) {
            privateProperty = a;
        }
    }
})();

myFunc.print(); //10
myFunc.assign(100);
myFunc.print(); //100

The private variables can only be accessed from within the anonymous function itself or from within a member of the returned object. This is through the power of closuers.

References

Categories : JavaScript

javascript void(0) for HTML link

May 27, 2012

To create a HTML link which does nothing when user clicks it,  use  like below

Click here to do nothing

When the user clicks the link,  void(0) evaluates to undefined, which has no effect in JavaScript.

References -

https://developer.mozilla.org/en/JavaScript/Guide/Expressions_and_Operators#void

Here is a stackoverflow.com link, which answers why   void(0)  is better than using

 for this requirement

http://stackoverflow.com/questions/134845/href-for-javascript-links-or-javascriptvoid0

Categories : JavaScript   HTML

Referencing variables in setTimeout function - Javascript Closures

May 26, 2012

Requirement

  • Reference For loop variable i  in setTimeout function

Wrong way

for(var i = 1 ; i <= 10; i++) {
    console.log('i in for :: ' + i);
    setTimeout(function() {
        console.log(' i in timeout :: ' + i);
    }, 2000);
}

Ouput

i in for :: 1
i in for :: 2
i in for :: 3
i in for :: 4
i in for :: 5
i in for :: 6
i in for :: 7
i in for :: 8
i in for :: 9
i in for :: 10
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11
i in timeout :: 11

Right way using Closures

for(var i = 1 ; i <= 10; i++) {
    console.log('i in for :: ' + i);
    setTimeout(function(j) {
        return function() {
        console.log(' j in timeout :: ' + j);
    }
    }(i), 2000);
}

Ouput

i in for :: 1
i in for :: 2
i in for :: 3
i in for :: 4
i in for :: 5
i in for :: 6
i in for :: 7
i in for :: 8
i in for :: 9
i in for :: 10
j in timeout :: 1
j in timeout :: 2
j in timeout :: 3
j in timeout :: 4
j in timeout :: 5
j in timeout :: 6
j in timeout :: 7
j in timeout :: 8
j in timeout :: 9
j in timeout :: 10

References:

Categories : JavaScript

javascript undefined, null, undefined property, 0, false, '', ==, ===, typeof

Mar 22, 2012

== Equals>If the two operands are not of the same type, JavaScript converts the operands then applies strict comparison.

=== Strict equal

Returns true if the operands are strictly equal  with no type conversion.

typeof

The  typeof operator returns a string indicating the type of the unevaluated operand.

typeof undefined === ’undefined’

undefined

A variable that has not been assigned a value is of type undefined.

false

Examples of expressions that can be converted to false are those that evaluate to null, 0, the empty string (“”), or undefined.

null

null is an object. It’s type is null. Null and Undefined types are  == (but not  ===)

Undeclared variable

/ var z*/

*z.x  // throws a ReferenceError

Check for undefined variable

*var x;

*if (x === undefined) {

*   // these statements execute

*}

*else {

*   // these statements do not execute

*} check for undeclared variable

*// x has not been defined before

*if (typeof x === ’undefined’) { // evaluates to true without errors

*   // these statements execute

*}

*

*if(x === undefined){ // throws a ReferenceError

*

*} check for object property

*var myobj = {‘a’:’a’};

*myobj.hasOwnProperty(‘a’) // true

*var myobj2 = Object.create(myobj);

*myobj2.hasOwnProperty(‘a’) //false

*‘a’ in myobj2 // true check for null

*var c = null

*if (c === null) { // true

*} References

http://saladwithsteve.com/2008/02/javascript-undefined-vs-null.html

http://constc.blogspot.com/2008/07/undeclared-undefined-null-in-javascript.html

http://www.mapbender.org/JavaScript_pitfalls:_null,_false,_undefined,_NaN

https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/undefined

https://developer.mozilla.org/en/JavaScript/Reference/Operators/Comparison_Operators

https://developer.mozilla.org/en/JavaScript/Reference/Operators/typeof

http://www.nczonline.net/blog/2010/07/27/determining-if-an-object-property-exists/

Categories : JavaScript