7
Fundamentals

JS Fundamentals

Embed Size (px)

Citation preview

Page 1: JS Fundamentals

Fundamentals

Page 2: JS Fundamentals

Fundamentals

How to improve Consistence

Anonymous Function

Module Pattern

Advanced Module Pattern

Fundamentals

Page 3: JS Fundamentals

How to improve Consistence

Use JSLint / JSHint to get in touch with Best Practices

How to turn around the famous use strict/* anonymous function begin statement */

‘use strict’;

/* your code */

/* anonymous function end statement */

Let’s try it on JsFiddle.net http://jsfiddle.net/5DC2K/41/ Fundamentals

Page 4: JS Fundamentals

Anonymous Function

Use anonymous function to preserve global namespacing

(function() {

var __myVariable;

/* your code */

})();

/* __myVariable is invisible to your code here */

Fundamentals

Page 5: JS Fundamentals

Module Pattern

Use module pattern to be more consistent(function(namespace) {

var __myVariable;

/* your pseudo private code here */

namespace.Class = function() {

foo: getVariable () {

return __myVariable;

},

foo2: function() {

}

}

})(namespace = namespace || {});

Fundamentals

Page 6: JS Fundamentals

Advanced Module Pattern Use it when your module pattern might have more than one instance

Add Following snippet code to make your module more flexible with instance optionthis.options = {

option1 : true,

option2 : 0.5

}

for (var key in options) {

this.options[key] = options[key];

}

Share your code in memory by using Prototypevar members = {

foo: function() {

}

}

for (var key in members) {

Class.prototype[key] = members[key];

}

Fundamentals

Page 7: JS Fundamentals

Let’s go

Decide to break your code and applymodule pattern for always

Use pattern as consistent solution

Have Fun !

To be continue… Advanced JS

Fundamentals