SlideShare a Scribd company logo
1 of 9
Download to read offline
What is a Callback
Function?
By Roland D. San Nicolas
Functions in Javascript
Edited MDN definition = A “subprogram” that can be called by code externally or
internally to the function. A function is composed of a sequence of statements
called the function body. Values can be passed to a function, and the function will
return a value.
Functions are “First Class” objects which means functions have properties and
methods (a function), and can be passed as arguments to other functions, return
them as values from other functions, and can be assigned to variables.
Functional Programming: improve code composition
A function declaration
function helloWorld() {
console.log(“Hello World”);
}
helloWorld();
A function expression (anonymous)
function(x) {
return //some value
};
(x);
Callback Function Definition
Wikipedia - “A reference to executable code, or a piece of executable code, that is
passed as an argument to other code which is expected to call back (execute) the
argument at some convenient time.”
“Higher Order Function” = the hosting function
“Callback function” = the function within the Higher Order Function.
Javascript statements are performed sequentially (line by line). Callbacks are
useful in performing its code at a specified time as to not block subsequent lines of
code (Synchronous vs Asynchronous).
Asynchronous Programming
Asynchronous programming = writing a program where a function(s) happen at
some “later” point in time as to not “block” the rest of the code (improved end user
experience).
Common with jQuery and I/O programming (send/receive data from file systems
and databases) used in Node.js.
jQuery Callback Function Example
$(“btn1”).click(function(){
console.log(“Button 1 clicked”);
});
Asynchronous Callback Function example
request = prepare_the_request();
send_request_asynchronously(request, function (response){
display (response);
});
//this code block returns immediately allowing subsequent code to continue
(non-blocking). The function parameter will be called when the response is
available.
Resources
Javascriptissexy.com (Concise, good place to start)
Javascript the Good Parts by Douglas Crockford
Eloquent Javascript
You-Dont-Know-JS: “Async & Performance”
Mozilla Developer Network
Youtube: especially the funfunfunction channel - “Higher-order functions” and
“Learning Functional Programming with Javascript” by Anjana Vakil
stackoverflow

More Related Content

What's hot (20)

Basics of JavaScript
Basics of JavaScriptBasics of JavaScript
Basics of JavaScript
 
JavaScript Fetch API
JavaScript Fetch APIJavaScript Fetch API
JavaScript Fetch API
 
Introduction to Javascript
Introduction to JavascriptIntroduction to Javascript
Introduction to Javascript
 
JAVASCRIPT PPT [Autosaved].pptx
JAVASCRIPT PPT [Autosaved].pptxJAVASCRIPT PPT [Autosaved].pptx
JAVASCRIPT PPT [Autosaved].pptx
 
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
 
Jsp ppt
Jsp pptJsp ppt
Jsp ppt
 
Ajax
AjaxAjax
Ajax
 
JavaScript Promises
JavaScript PromisesJavaScript Promises
JavaScript Promises
 
JavaScript Promises
JavaScript PromisesJavaScript Promises
JavaScript Promises
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginners
 
Angular Lifecycle Hooks
Angular Lifecycle HooksAngular Lifecycle Hooks
Angular Lifecycle Hooks
 
JavaScript - An Introduction
JavaScript - An IntroductionJavaScript - An Introduction
JavaScript - An Introduction
 
Functions in javascript
Functions in javascriptFunctions in javascript
Functions in javascript
 
Java script
Java scriptJava script
Java script
 
Php string function
Php string function Php string function
Php string function
 
Introduction to Spring Framework
Introduction to Spring FrameworkIntroduction to Spring Framework
Introduction to Spring Framework
 
OOP java
OOP javaOOP java
OOP java
 
React state
React  stateReact  state
React state
 
Fragment
Fragment Fragment
Fragment
 
Javascript
JavascriptJavascript
Javascript
 

Viewers also liked

Wow! closure in_javascript
Wow! closure in_javascriptWow! closure in_javascript
Wow! closure in_javascriptcnlangzi
 
JavaScript closures
JavaScript closuresJavaScript closures
JavaScript closuresHorky Chen
 
Ambient Media Worldwide Ltd Jd Lr
Ambient Media Worldwide Ltd Jd LrAmbient Media Worldwide Ltd Jd Lr
Ambient Media Worldwide Ltd Jd LrJohnnboy75
 
javascript function & closure
javascript function & closurejavascript function & closure
javascript function & closureHika Maeng
 
Asynchronous JavaScript and Promises
Asynchronous JavaScript and Promises Asynchronous JavaScript and Promises
Asynchronous JavaScript and Promises Senthil Kumar
 
Callbacks, promises, generators - asynchronous javascript
Callbacks, promises, generators - asynchronous javascriptCallbacks, promises, generators - asynchronous javascript
Callbacks, promises, generators - asynchronous javascriptŁukasz Kużyński
 
Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...
Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...
Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...Domenic Denicola
 
JavaScript tips - Unnest callbacks and method declarations
JavaScript tips - Unnest callbacks and method declarationsJavaScript tips - Unnest callbacks and method declarations
JavaScript tips - Unnest callbacks and method declarationsexponential_io
 
The Top Skills That Can Get You Hired in 2017
The Top Skills That Can Get You Hired in 2017The Top Skills That Can Get You Hired in 2017
The Top Skills That Can Get You Hired in 2017LinkedIn
 

Viewers also liked (11)

Wow! closure in_javascript
Wow! closure in_javascriptWow! closure in_javascript
Wow! closure in_javascript
 
JavaScript closures
JavaScript closuresJavaScript closures
JavaScript closures
 
Ambient Media Worldwide Ltd Jd Lr
Ambient Media Worldwide Ltd Jd LrAmbient Media Worldwide Ltd Jd Lr
Ambient Media Worldwide Ltd Jd Lr
 
javascript function & closure
javascript function & closurejavascript function & closure
javascript function & closure
 
JavaScript closures
JavaScript closuresJavaScript closures
JavaScript closures
 
Asynchronous JavaScript and Promises
Asynchronous JavaScript and Promises Asynchronous JavaScript and Promises
Asynchronous JavaScript and Promises
 
Closure
ClosureClosure
Closure
 
Callbacks, promises, generators - asynchronous javascript
Callbacks, promises, generators - asynchronous javascriptCallbacks, promises, generators - asynchronous javascript
Callbacks, promises, generators - asynchronous javascript
 
Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...
Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...
Callbacks, Promises, and Coroutines (oh my!): Asynchronous Programming Patter...
 
JavaScript tips - Unnest callbacks and method declarations
JavaScript tips - Unnest callbacks and method declarationsJavaScript tips - Unnest callbacks and method declarations
JavaScript tips - Unnest callbacks and method declarations
 
The Top Skills That Can Get You Hired in 2017
The Top Skills That Can Get You Hired in 2017The Top Skills That Can Get You Hired in 2017
The Top Skills That Can Get You Hired in 2017
 

Similar to Callback Function

JavaScript Interview Questions 2023
JavaScript Interview Questions 2023JavaScript Interview Questions 2023
JavaScript Interview Questions 2023Laurence Svekis ✔
 
predefined and user defined functions
predefined and user defined functionspredefined and user defined functions
predefined and user defined functionsSwapnil Yadav
 
Clojure Fundamentals Course For Beginners
Clojure Fundamentals Course For Beginners Clojure Fundamentals Course For Beginners
Clojure Fundamentals Course For Beginners Paddy Lock
 
Effective JavaFX architecture with FxObjects
Effective JavaFX architecture with FxObjectsEffective JavaFX architecture with FxObjects
Effective JavaFX architecture with FxObjectsSrikanth Shenoy
 
Clojure and The Robot Apocalypse
Clojure and The Robot ApocalypseClojure and The Robot Apocalypse
Clojure and The Robot Apocalypseelliando dias
 
Function & procedure
Function & procedureFunction & procedure
Function & procedureatishupadhyay
 
Asynchronous development in JavaScript
Asynchronous development  in JavaScriptAsynchronous development  in JavaScript
Asynchronous development in JavaScriptAmitai Barnea
 
Asynchronous programming done right - Node.js
Asynchronous programming done right - Node.jsAsynchronous programming done right - Node.js
Asynchronous programming done right - Node.jsPiotr Pelczar
 
Module design pattern i.e. express js
Module design pattern i.e. express jsModule design pattern i.e. express js
Module design pattern i.e. express jsAhmed Assaf
 
Introduction to clojure
Introduction to clojureIntroduction to clojure
Introduction to clojureAbbas Raza
 
function of C.pptx
function of C.pptxfunction of C.pptx
function of C.pptxshivas379526
 
Functional patterns and techniques in C#
Functional patterns and techniques in C#Functional patterns and techniques in C#
Functional patterns and techniques in C#Péter Takács
 
React JS & Functional Programming Principles
React JS & Functional Programming PrinciplesReact JS & Functional Programming Principles
React JS & Functional Programming PrinciplesAndrii Lundiak
 
Fuel Up JavaScript with Functional Programming
Fuel Up JavaScript with Functional ProgrammingFuel Up JavaScript with Functional Programming
Fuel Up JavaScript with Functional ProgrammingShine Xavier
 

Similar to Callback Function (20)

JavaScript Interview Questions 2023
JavaScript Interview Questions 2023JavaScript Interview Questions 2023
JavaScript Interview Questions 2023
 
predefined and user defined functions
predefined and user defined functionspredefined and user defined functions
predefined and user defined functions
 
Clojure Fundamentals Course For Beginners
Clojure Fundamentals Course For Beginners Clojure Fundamentals Course For Beginners
Clojure Fundamentals Course For Beginners
 
Effective JavaFX architecture with FxObjects
Effective JavaFX architecture with FxObjectsEffective JavaFX architecture with FxObjects
Effective JavaFX architecture with FxObjects
 
Clojure and The Robot Apocalypse
Clojure and The Robot ApocalypseClojure and The Robot Apocalypse
Clojure and The Robot Apocalypse
 
Closures
ClosuresClosures
Closures
 
Function & procedure
Function & procedureFunction & procedure
Function & procedure
 
Asynchronous development in JavaScript
Asynchronous development  in JavaScriptAsynchronous development  in JavaScript
Asynchronous development in JavaScript
 
React native
React nativeReact native
React native
 
Asynchronous programming done right - Node.js
Asynchronous programming done right - Node.jsAsynchronous programming done right - Node.js
Asynchronous programming done right - Node.js
 
JavaScript Looping Statements
JavaScript Looping StatementsJavaScript Looping Statements
JavaScript Looping Statements
 
[2015/2016] JavaScript
[2015/2016] JavaScript[2015/2016] JavaScript
[2015/2016] JavaScript
 
Module design pattern i.e. express js
Module design pattern i.e. express jsModule design pattern i.e. express js
Module design pattern i.e. express js
 
Introduction to clojure
Introduction to clojureIntroduction to clojure
Introduction to clojure
 
Functions in C
Functions in CFunctions in C
Functions in C
 
function of C.pptx
function of C.pptxfunction of C.pptx
function of C.pptx
 
Functional patterns and techniques in C#
Functional patterns and techniques in C#Functional patterns and techniques in C#
Functional patterns and techniques in C#
 
Javascript
JavascriptJavascript
Javascript
 
React JS & Functional Programming Principles
React JS & Functional Programming PrinciplesReact JS & Functional Programming Principles
React JS & Functional Programming Principles
 
Fuel Up JavaScript with Functional Programming
Fuel Up JavaScript with Functional ProgrammingFuel Up JavaScript with Functional Programming
Fuel Up JavaScript with Functional Programming
 

Callback Function

  • 1. What is a Callback Function? By Roland D. San Nicolas
  • 2. Functions in Javascript Edited MDN definition = A “subprogram” that can be called by code externally or internally to the function. A function is composed of a sequence of statements called the function body. Values can be passed to a function, and the function will return a value. Functions are “First Class” objects which means functions have properties and methods (a function), and can be passed as arguments to other functions, return them as values from other functions, and can be assigned to variables. Functional Programming: improve code composition
  • 3. A function declaration function helloWorld() { console.log(“Hello World”); } helloWorld();
  • 4. A function expression (anonymous) function(x) { return //some value }; (x);
  • 5. Callback Function Definition Wikipedia - “A reference to executable code, or a piece of executable code, that is passed as an argument to other code which is expected to call back (execute) the argument at some convenient time.” “Higher Order Function” = the hosting function “Callback function” = the function within the Higher Order Function. Javascript statements are performed sequentially (line by line). Callbacks are useful in performing its code at a specified time as to not block subsequent lines of code (Synchronous vs Asynchronous).
  • 6. Asynchronous Programming Asynchronous programming = writing a program where a function(s) happen at some “later” point in time as to not “block” the rest of the code (improved end user experience). Common with jQuery and I/O programming (send/receive data from file systems and databases) used in Node.js.
  • 7. jQuery Callback Function Example $(“btn1”).click(function(){ console.log(“Button 1 clicked”); });
  • 8. Asynchronous Callback Function example request = prepare_the_request(); send_request_asynchronously(request, function (response){ display (response); }); //this code block returns immediately allowing subsequent code to continue (non-blocking). The function parameter will be called when the response is available.
  • 9. Resources Javascriptissexy.com (Concise, good place to start) Javascript the Good Parts by Douglas Crockford Eloquent Javascript You-Dont-Know-JS: “Async & Performance” Mozilla Developer Network Youtube: especially the funfunfunction channel - “Higher-order functions” and “Learning Functional Programming with Javascript” by Anjana Vakil stackoverflow