Pre Angular JS
July 11, 2015 3 Comments
Target Audience: – Beginner
Angular JS is a Java script open source framework from Google and downloadable from https://angularjs.org/
Important concepts before start playing with Angular JS
Angular is based on following important concepts
- Using function expression instead of the function declaration
- Functions for encapsulation
- Using modules for functions
- Avoid using global variables
Function expressions VS function declaration
- As variable declaration starts with var function declaration starts with function.
- The JS object created same as a function name. In following case object with name myFunction created.
- Function declaration parsed and executed before any other expressions.
Function expression
Assign function to variable.
By doing this, one can dynamically change call to the function.
Used inside function to make encapsulation and code more and more modular
var myWork=function(){
console.log(“myWork Invoked”);
};
Function expressions are of two types
An anonymous function expression
var myWork=function(){
console.log(“myWork Invoked”);
};
Named function expression
var myWork=function myWorkFunction(){
console.log(“myWork Invoked”);
};
Functions for encapsulation
function expression offer better facility for encapsulation
Consider the following simple example
//Step 1: – concentrate on implementation logic: -Function expression with global variable myProcess
var myProcess=function myProcessF(){
var preProcess=function(){
console.log(“in preProcess”);
};
var postProcess=function(){
console.log(“in postProcess”);
};
var doProcess=function(){
console.log(“in process”);
};
// Some private function which used internally
var somePrivateFunction=function(){
console.log(“some internal function”);
}
//Expose functions and variable which used outside this function: Good example of encapsulation
return{
//Aliasing
preProcessing:preProcess,
postProcessing:postProcess,
doProcessing:doProcess
};
};
//Invoke Function
var process =myProcess();
process.preProcessing();
process.doProcessing();
process.postProcessing();
When this code executed it give the following output.
Avoid creating Global variables
By looking at above example, we can see that myProcess is a global variable. These types of variables are candidate for overriding hence one needs to avoid creating global variables with the help of IIFY
(function() {
// The code here executed once in its own scope
}());
Very good but they is no subscribe button
LikeLike
you can also follow my blogs via email
LikeLike
Pingback: Angular JS Controller | GANESH POL