Skip to main content

Javascript: Callback and High Order Function

CALLBACK

A callback is a function that gets invoked after an asynchronous result appears. a callback function is an async function argument.
- Asynchronous code result handle using callback and promises.

// callback 

  • function
  • function with argument  // ---argument :// if a function pass-through function as an argument, it is higher-order function. function needs to be called in order to execute. a callback is used when calling a function asynchronous 
What is a Callback or Higher-order Function?
  • A callback function, also known as a higher-order function, is a function that is passed to another function (let’s call this other function “otherFunction”) as a parameter, and the callback function is called (or executed) inside the otherFunction. A callback function is essentially a pattern (an established solution to a common problem), and therefore, the use of a callback function is also known as a callback pattern.
  • High-order function is a function that takes a function as an argument, or returns a function. Callback function also known as high order function. Functions are actually first class object. pass object into two function : arg and callback. 
  • Callback Hell:  is when people try to write JavaScript in a way where execution happens visually from top to bottom. Callback hell is any code where the use of function callbacks in async code becomes obscure or difficult to follow.

Async Example:

function lendMoney(){
     return 100;
}


function payCollegeFee(fee, cb){
     console.log('Fee received in college');
     setTimeout(function(){
     console.log('It takes 5 sec to prepare admit card');
     cb('admit cart');
}, 5000);
}
console.log('Lend money result', lendMoney());


function payFee(cb){
console.log('My son asked for fee but papa dont have money'); setTimeout(function(){
console.log('papa received salary');
console.log('papa was requested for fee pay');
console.log('papa must pay fee now');

cb(4000);
}, 8000);
}

console.log('Ask papa for free')

//payFee call back
payFee(function (fee){
      console.log('I received money from papa');      var myMoney = fee - 1000;
      payCollegeFee(myMoney, function(admitCard){
      console.log('admission card received>>', admitCard); });
});
console.log('I go to school');
console.log('I play guitar in school');


Note:
Run in nodejs: node module.js
Output: Lend money result 100
Ask papa for free
My son asked for fee but papa dont have money
I go to school
I play guitar in school

Callback Example 1: 

Callback Example 2:

Output: "Starting my math homework."
"Finished my homework."

Callback Example 3: 







Comments

Popular posts from this blog

Javascript: Object to Array and Array to Object

Output: Final Array [ { mango: 1 }, { apple: 2 }, { banana: 3 }, { orange: 1 }, { watermelon: 1 }, { papaya: 1 } ] Output: Final Object { mango: 1, apple: 2, banana: 3, orange: 1, watermelon: 1, papaya: 1 }

Javascript: Frontend - AngularJS

# FrontEnd Technologies: # Web (Internet) - Html, css framework (bootstrap, material design-> component based) Angular 2 - Single page application (fast). - Web application or website that interacts with the user by dynamically rewritting the current page rather than loading entire new pages from a server. - Can do asynchronous jobs. # Tools: - Typescript - VS code # MVVW (Model View ViewModel Pattern) -> two-way data binding - In angular, the controller (the C in MVC) is replaced by ViewModel (the VM in MVVM). # Typescript Programming Language Typescript (.ts) is imp in angular 2. - supersetup js - strictly typed program - can do class based oop - future programming language. - security maintain (TS code compile and run in js) - JS with additional features. # Data Binding - Controller and Views synchronize. Types: 1. Event -  eg: click, onClick, change 2. Property - eg: hide, show 3. 2-way binding - Reflect in view if changes in model- c...