Pre Angular JS

DZone 's Guide to

Pre Angular JS

· ·
Free Resource

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 js  based on following important concepts

  • Using function expression instead of function declaration
  • Functions for  encapsulation
  • Using modules for functions
  • Avoiding global variables

Function expressions VS function declaration

Function declaration

  • As variable declaration starts with var function declaration starts with function.
  • JS object created same as function name. in following case object with name myFunction created.
  • function declaration  parsed and executed before any other expressions.

function myFunction(){console.log(“i am in myFunction”);}

Function expression

assign function to variable.
by doing this one can dynamically change call to function.
Used inside function to make encapsulation and code more and more modular

var myWork=function myWorkFunction(){
console.log(“myWork Invoked”);

function expressions are of two types
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 following 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

//Invoke Function
var process =myProcess();

when this code executed it give following output.


Avoid creating Global variables

By looking at above example we can see that myProcess is global variable. these type 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

angular js, javascript

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}