title
16.5: Higher Order Functions in JavaScript - Topics of JavaScript/ES6

description
In this video, I discuss "higher order functions" in JavaScript. 🎥 Next Video: https://youtu.be/EnYlhbpzhU4 🎥 Topics of JavaScript/ES6: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6YgpA3Oht-7B4NBQwFVe3pr 🎥 ES6 Arrow Function: https://youtu.be/mrYMzpbFz18 🎥 Closures in JavaScript: https://youtu.be/-jysK0nlz7A 🚂 The Coding Train website: http://thecodingtrain.com/ 💖 Support this channel on Patreon: https://patreon.com/codingtrain 🛒 To buy Coding Train merchandise: https://www.designbyhumans.com/shop/codingtrain/ 📚 Book recommendations: https://www.amazon.com/shop/thecodingtrain 💻 https://github.com/CodingTrain/Rainbow-Code 🎥 For an Introduction to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA 🎥 For More Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH 🔗 https://p5js.org/ 🔗 https://processing.org 📄 Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

detail
{'title': '16.5: Higher Order Functions in JavaScript - Topics of JavaScript/ES6', 'heatmap': [{'end': 402.551, 'start': 369.355, 'weight': 0.81}, {'end': 611.941, 'start': 584.107, 'weight': 0.738}, {'end': 735.704, 'start': 697.898, 'weight': 0.809}, {'end': 929.571, 'start': 911.773, 'weight': 0.91}], 'summary': 'Covers higher order functions in javascript, including comparisons between object-oriented and functional programming, es6 function declaration, and practical use cases of higher order functions like map, sort, reduce, and filter for javascript arrays. it also explores javascript function callbacks, error handling, passing anonymous functions as arguments, transitioning to arrow functions, and introduces the concept of a function factory. additionally, it demonstrates the concept of higher order functions using a multiplier function example and emphasizes the use of closure and arrow functions.', 'chapters': [{'end': 256.286, 'segs': [{'end': 167.266, 'src': 'embed', 'start': 39.894, 'weight': 0, 'content': [{'end': 44.757, 'text': 'But there is this thing called functional programming, which is very popular and interesting.', 'start': 39.894, 'duration': 4.863}, {'end': 47.038, 'text': 'And I want to dip my toe a little bit.', 'start': 45.137, 'duration': 1.901}, {'end': 53.001, 'text': 'And JavaScript is a language where functions are the sort of primary building block of the language.', 'start': 47.098, 'duration': 5.903}, {'end': 53.821, 'text': "And there's lots of things.", 'start': 53.021, 'duration': 0.8}, {'end': 62.164, 'text': 'And of course, you can do this, I know, in Java now with Java 72, whatever version is now 100,051.', 'start': 53.841, 'duration': 8.323}, {'end': 67.908, 'text': 'But I want to look at this idea of a higher order function and kind of wade into this idea of functional programming a bit more.', 'start': 62.165, 'duration': 5.743}, {'end': 76.17, 'text': "Now, this video is appearing in my ES6 playlist, even though some of the stuff that I'm going to use is not ES6 specific.", 'start': 68.208, 'duration': 7.962}, {'end': 77.41, 'text': "But I think it's useful to have it here,", 'start': 76.39, 'duration': 1.02}, {'end': 84.832, 'text': "because I'm going to use in these tutorials also this particular syntax known as the arrow syntax or the arrow function.", 'start': 77.41, 'duration': 7.422}, {'end': 85.973, 'text': "And I'm going to use that.", 'start': 85.172, 'duration': 0.801}, {'end': 88.193, 'text': "And that's only available in JavaScript ES6.", 'start': 85.993, 'duration': 2.2}, {'end': 95.191, 'text': 'And if you are confused about what the arrow function is, magical tutorial about that in a separate video.', 'start': 88.233, 'duration': 6.958}, {'end': 98.733, 'text': 'And I think I talk about ES6 versus ES5, which are different versions of JavaScript there.', 'start': 95.591, 'duration': 3.142}, {'end': 104.598, 'text': "Okay, so what is, I'm going to attempt to define what a higher order function is.", 'start': 98.774, 'duration': 5.824}, {'end': 108.08, 'text': "And the way I like to think about it is like, well, there's a function.", 'start': 104.978, 'duration': 3.102}, {'end': 110.422, 'text': 'I could define a function like this.', 'start': 109.001, 'duration': 1.421}, {'end': 113.104, 'text': 'Function, hello.', 'start': 111.142, 'duration': 1.962}, {'end': 118.17, 'text': 'And then I could write console log hello in there.', 'start': 115.748, 'duration': 2.422}, {'end': 119.011, 'text': "And that's a function.", 'start': 118.19, 'duration': 0.821}, {'end': 124.975, 'text': "It's a named block of code that I can execute by calling the name of the function.", 'start': 119.171, 'duration': 5.804}, {'end': 129.478, 'text': "And there's lots of ways to declare functions in JavaScript and with ES6 syntax.", 'start': 125.856, 'duration': 3.622}, {'end': 133.542, 'text': 'And I could say var hello equals or let hello equals or const hello equals.', 'start': 129.538, 'duration': 4.004}, {'end': 134.582, 'text': 'So many possibilities.', 'start': 133.762, 'duration': 0.82}, {'end': 141.227, 'text': 'This is not a higher order function because it is just a function on its own on the level playing field of functions.', 'start': 135.303, 'duration': 5.924}, {'end': 149.253, 'text': 'A higher order function is a function that kind of has two levels of functions to it, or more than two.', 'start': 142.168, 'duration': 7.085}, {'end': 158.78, 'text': "In other words, what if this function expects as its argument another function? So you're calling this function and sending it a function.", 'start': 149.613, 'duration': 9.167}, {'end': 160.361, 'text': "That's a higher order function.", 'start': 158.82, 'duration': 1.541}, {'end': 167.266, 'text': 'Or what if this function actually makes a function? or returns one back to you somehow.', 'start': 160.641, 'duration': 6.625}], 'summary': 'Introduction to functional programming in javascript, focusing on higher order functions and es6 syntax.', 'duration': 127.372, 'max_score': 39.894, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS039894.jpg'}, {'end': 234.632, 'src': 'embed', 'start': 185.521, 'weight': 5, 'content': [{'end': 192.246, 'text': "So one of the reasons why I'm doing this is there are a lot of higher order functions available for JavaScript arrays.", 'start': 185.521, 'duration': 6.725}, {'end': 194.368, 'text': 'And those are really useful.', 'start': 193.027, 'duration': 1.341}, {'end': 195.488, 'text': 'Let me name a few of them.', 'start': 194.408, 'duration': 1.08}, {'end': 202.072, 'text': 'Map, sort, reduce, filter.', 'start': 196.329, 'duration': 5.743}, {'end': 208.215, 'text': "So in the subsequent videos that are following this one, I'm going to start going through these functions.", 'start': 202.732, 'duration': 5.483}, {'end': 214.239, 'text': "And it's my goal to actually then tie these functions into a particle system example.", 'start': 208.576, 'duration': 5.663}, {'end': 217.044, 'text': 'Because I want to look at.', 'start': 216.004, 'duration': 1.04}, {'end': 220.126, 'text': 'well, I can look at how these stuff works and just put numbers in it,', 'start': 217.044, 'duration': 3.082}, {'end': 225.208, 'text': 'but what might be an actual real life scenario in the sort of creative coding graphics world that I might use them in?', 'start': 220.126, 'duration': 5.082}, {'end': 227.049, 'text': 'So this is the whole landscape here.', 'start': 225.468, 'duration': 1.581}, {'end': 230.79, 'text': "I'm going to start with just basic higher order functions.", 'start': 227.329, 'duration': 3.461}, {'end': 233.271, 'text': "I'm going to write a couple goofy, trivial examples.", 'start': 230.81, 'duration': 2.461}, {'end': 234.632, 'text': "I'm going to stop.", 'start': 233.852, 'duration': 0.78}], 'summary': 'Exploring javascript higher order functions and their application in a particle system example.', 'duration': 49.111, 'max_score': 185.521, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0185521.jpg'}], 'start': 0.643, 'title': 'Higher order functions in javascript', 'summary': 'Introduces, defines, and explains higher order functions in javascript, comparing object-oriented programming with functional programming, exploring various ways to declare functions in es6, and showcasing useful higher order functions for javascript arrays such as map, sort, reduce, and filter.', 'chapters': [{'end': 98.733, 'start': 0.643, 'title': 'Introduction to higher order functions', 'summary': 'Introduces the concept of higher order functions, compares object-oriented programming with functional programming, and discusses the use of arrow functions in javascript es6.', 'duration': 98.09, 'highlights': ["The video discusses the concept of higher order functions and the speaker's interest in exploring functional programming in JavaScript.", 'The speaker contrasts his experience with object-oriented programming in Java with the popular and interesting functional programming.', 'The tutorial also covers the use of arrow functions in JavaScript ES6 and their availability in different versions of JavaScript.']}, {'end': 141.227, 'start': 98.774, 'title': 'Defining higher order functions', 'summary': 'Delves into defining higher order functions in javascript, emphasizing the distinction between regular functions and higher order functions, and exploring the various ways to declare functions in es6.', 'duration': 42.453, 'highlights': ['Explaining the concept of higher order functions The speaker attempts to define what a higher order function is, emphasizing that it involves more than just a standalone function, and provides an example of a basic function declaration in JavaScript.', 'Emphasizing the distinction between regular functions and higher order functions The distinction between regular functions and higher order functions is highlighted, with the example of a basic function declaration being used to illustrate the concept.', 'Exploring various ways to declare functions in ES6 The speaker mentions the different ways to declare functions in ES6, including var, let, and const, indicating the numerous possibilities available in JavaScript for function declaration.']}, {'end': 256.286, 'start': 142.168, 'title': 'Understanding higher order functions', 'summary': 'Introduces the concept of higher order functions in javascript, explaining that they involve either taking a function as input or sending a function as output. it also mentions some useful higher order functions for javascript arrays, such as map, sort, reduce, and filter, and outlines the plan to tie these functions into a particle system example.', 'duration': 114.118, 'highlights': ['Higher order functions involve either taking a function as input or sending a function as output. The concept of higher order functions is defined as functions that take a function as input or send a function as output.', 'Useful higher order functions for JavaScript arrays include Map, Sort, Reduce, and Filter. The transcript mentions the usefulness of higher order functions such as Map, Sort, Reduce, and Filter for JavaScript arrays.', 'Plan to tie higher order functions into a particle system example. The speaker outlines the plan to integrate higher order functions into a particle system example, aiming to simulate a real-life scenario in creative coding and graphics.']}], 'duration': 255.643, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0643.jpg', 'highlights': ['The tutorial covers the use of arrow functions in JavaScript ES6 and their availability in different versions of JavaScript.', 'The speaker contrasts his experience with object-oriented programming in Java with the popular and interesting functional programming.', "The video discusses the concept of higher order functions and the speaker's interest in exploring functional programming in JavaScript.", 'Exploring various ways to declare functions in ES6, including var, let, and const, indicating the numerous possibilities available in JavaScript for function declaration.', 'The concept of higher order functions is defined as functions that take a function as input or send a function as output.', 'Useful higher order functions for JavaScript arrays include Map, Sort, Reduce, and Filter.', 'The speaker outlines the plan to integrate higher order functions into a particle system example, aiming to simulate a real-life scenario in creative coding and graphics.', 'The distinction between regular functions and higher order functions is highlighted, with the example of a basic function declaration being used to illustrate the concept.']}, {'end': 529.361, 'segs': [{'end': 356.571, 'src': 'embed', 'start': 329.451, 'weight': 0, 'content': [{'end': 333.294, 'text': "But it's code that's happening all the time in JavaScript libraries that you use.", 'start': 329.451, 'duration': 3.843}, {'end': 336.937, 'text': "Because a lot of times you say, hey, load this JSON, and here's a callback.", 'start': 333.634, 'duration': 3.303}, {'end': 339.438, 'text': 'Or do this, but apply it with this function.', 'start': 337.237, 'duration': 2.201}, {'end': 345.603, 'text': "So this is the idea of if you could send in a function, the parentheses aren't here.", 'start': 339.759, 'duration': 5.844}, {'end': 349.626, 'text': 'Because this is actually the name of a variable, the name of the function.', 'start': 346.163, 'duration': 3.463}, {'end': 353.189, 'text': "It's the parameter to sing is callback.", 'start': 349.666, 'duration': 3.523}, {'end': 356.571, 'text': 'And if that is a function, I can execute that function here.', 'start': 353.429, 'duration': 3.142}], 'summary': 'Javascript libraries often use callbacks for executing functions with json data.', 'duration': 27.12, 'max_score': 329.451, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0329451.jpg'}, {'end': 402.551, 'src': 'heatmap', 'start': 369.355, 'weight': 0.81, 'content': [{'end': 373.037, 'text': "And I'm going to say console.log meow meow.", 'start': 369.355, 'duration': 3.682}, {'end': 376.778, 'text': "And then I'm going to say sing meow.", 'start': 374.277, 'duration': 2.501}, {'end': 382.28, 'text': "And actually let's just, let's do this all on the, I'm going to put this here.", 'start': 378.559, 'duration': 3.721}, {'end': 386.461, 'text': 'And then in here right one thing.', 'start': 382.3, 'duration': 4.161}, {'end': 387.682, 'text': 'now what happens if I call sing?', 'start': 386.461, 'duration': 1.221}, {'end': 395.524, 'text': "It says callback is not a function, so I didn't pass that parameter, so I have to now say sing meow.", 'start': 388.638, 'duration': 6.886}, {'end': 402.551, 'text': "Then I'm giving it the meow function, so sing la la la's, and then it executes that meow function.", 'start': 396.866, 'duration': 5.685}], 'summary': "Demonstrating console.log and sing functions with meow and la la la's.", 'duration': 33.196, 'max_score': 369.355, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0369355.jpg'}, {'end': 427.633, 'src': 'embed', 'start': 403.191, 'weight': 1, 'content': [{'end': 412.16, 'text': 'Now I could be sort of thoughtful about this, and I could say like, oh, only call the callback if it exists.', 'start': 403.191, 'duration': 8.969}, {'end': 415.875, 'text': 'What did I get wrong here? Whoops.', 'start': 414.973, 'duration': 0.902}, {'end': 419.082, 'text': 'So now I could do some error checking in my function.', 'start': 416.878, 'duration': 2.204}, {'end': 422.51, 'text': "So I could do this, and it's OK for me to say sing.", 'start': 419.969, 'duration': 2.541}, {'end': 423.611, 'text': 'It just does la la la.', 'start': 422.57, 'duration': 1.041}, {'end': 427.633, 'text': "Or I could say sing, and then when you're done, execute meow.", 'start': 423.831, 'duration': 3.802}], 'summary': 'Discussion on implementing error checking and conditional callbacks in a function.', 'duration': 24.442, 'max_score': 403.191, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0403191.jpg'}, {'end': 486.493, 'src': 'embed', 'start': 462.028, 'weight': 2, 'content': [{'end': 468.834, 'text': 'So for example, just to make this case clear, probably another way that I might do this is say, oh, I want to call sing.', 'start': 462.028, 'duration': 6.806}, {'end': 472.257, 'text': 'And then I just want to add pass in.', 'start': 469.214, 'duration': 3.043}, {'end': 476.142, 'text': 'another function to it.', 'start': 474.901, 'duration': 1.241}, {'end': 483.17, 'text': 'So you can see here this is me calling the function sing and giving it an argument, which is all this code,', 'start': 476.383, 'duration': 6.787}, {'end': 486.493, 'text': 'which is a function definition with no name, an anonymous function.', 'start': 483.17, 'duration': 3.323}], 'summary': 'Demonstrating calling a function with an anonymous function as an argument.', 'duration': 24.465, 'max_score': 462.028, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0462028.jpg'}, {'end': 538.443, 'src': 'embed', 'start': 508.823, 'weight': 3, 'content': [{'end': 510.585, 'text': "I'm going to come back to the arrow function later.", 'start': 508.823, 'duration': 1.762}, {'end': 512.767, 'text': "OK So one more thing let's try.", 'start': 510.745, 'duration': 2.022}, {'end': 515.308, 'text': "So this is a function that you're passing a function.", 'start': 512.807, 'duration': 2.501}, {'end': 518.972, 'text': 'Another thing you could do is I could have a function return a function.', 'start': 515.589, 'duration': 3.383}, {'end': 522.076, 'text': 'Some might even call that like a function factory.', 'start': 519.053, 'duration': 3.023}, {'end': 526.38, 'text': "If you're a Java programmer or something, you love factories.", 'start': 522.096, 'duration': 4.284}, {'end': 529.361, 'text': "Okay, so let's get rid of this.", 'start': 526.92, 'duration': 2.441}, {'end': 531.681, 'text': "And I'm going to use a pretty standard example.", 'start': 529.881, 'duration': 1.8}, {'end': 534.122, 'text': "It's probably one that you would find in countless other tutorials.", 'start': 531.721, 'duration': 2.401}, {'end': 536.783, 'text': "And I'm going to write a function called multiplier.", 'start': 534.782, 'duration': 2.001}, {'end': 538.443, 'text': "I'm going to show you why this is useful.", 'start': 536.803, 'duration': 1.64}], 'summary': 'Demonstrating function use and returning a function in javascript.', 'duration': 29.62, 'max_score': 508.823, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0508823.jpg'}], 'start': 256.307, 'title': 'Javascript function callbacks', 'summary': 'Covers javascript functions, including setup functions and defining functions with callbacks. it also discusses function callbacks, error handling, passing anonymous functions as arguments, and the transition to using arrow functions, emphasizing error checking and introducing the concept of a function factory.', 'chapters': [{'end': 349.626, 'start': 256.307, 'title': 'Javascript functions and callbacks', 'summary': 'Discusses the concept of javascript functions, demonstrating the use of setup functions and defining a function with a callback, illustrating the relevance of callbacks in javascript libraries.', 'duration': 93.319, 'highlights': ['The chapter discusses the concept of JavaScript functions, demonstrating the use of setup functions and defining a function with a callback, illustrating the relevance of callbacks in JavaScript libraries.', "The speaker demonstrates defining a function called 'sing' and executing it, emphasizing the global space requirement for calling it from the console.", "The speaker explains the concept of passing a function as an argument, referring to it as a 'callback' and highlighting its common usage in JavaScript libraries for tasks like loading JSON and applying functions."]}, {'end': 529.361, 'start': 349.666, 'title': 'Function callbacks and error handling', 'summary': 'Covers the concept of function callbacks, error handling, and passing anonymous functions as arguments in javascript, emphasizing the importance of error checking and the eventual transition to using arrow functions. it also discusses the concept of a function factory.', 'duration': 179.695, 'highlights': ["The chapter discusses the concept of function callbacks and demonstrates passing a function as a parameter in JavaScript. It explains how a function can be passed as an argument to another function, demonstrated by the example of defining a function 'sing' and passing another function 'meow' as a parameter to 'sing'.", 'The importance of error checking in function callbacks is emphasized, with the example of checking if the callback function exists before execution. The transcript highlights the importance of error checking in function callbacks and demonstrates checking if the callback function exists before executing it, ensuring smooth execution and preventing errors.', "The concept of passing anonymous functions as arguments is explained, with an example of passing an anonymous function to the 'sing' function. It explains the concept of passing anonymous functions as arguments, illustrated by passing an anonymous function as an argument to the 'sing' function, demonstrating a common practice in JavaScript programming.", "The idea of a function factory, where a function returns another function, is introduced. The concept of a function factory is introduced, describing how a function can return another function, akin to a 'function factory', providing a different approach to organizing and using functions in JavaScript."]}], 'duration': 273.054, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0256307.jpg', 'highlights': ['The chapter covers the concept of JavaScript functions, including setup functions and defining functions with callbacks, emphasizing their relevance in JavaScript libraries.', 'The importance of error checking in function callbacks is emphasized, ensuring smooth execution and preventing errors.', 'The concept of passing anonymous functions as arguments is explained, demonstrating a common practice in JavaScript programming.', 'The concept of a function factory is introduced, providing a different approach to organizing and using functions in JavaScript.']}, {'end': 970.425, 'segs': [{'end': 611.941, 'src': 'heatmap', 'start': 578.062, 'weight': 0, 'content': [{'end': 583.867, 'text': 'But what if I want to actually create different functions that multiply by different factors?', 'start': 578.062, 'duration': 5.805}, {'end': 594.955, 'text': 'So instead of having x here, what if I just said return a function that receives x and multiplies it by some factor?', 'start': 584.107, 'duration': 10.848}, {'end': 595.715, 'text': 'Look at this.', 'start': 595.295, 'duration': 0.42}, {'end': 602.298, 'text': 'the multiplier returns a new function that uses the factor that was passed in.', 'start': 596.616, 'duration': 5.682}, {'end': 611.941, 'text': "Whoa So in other words, what do I mean by this? I can now say, whoops, I'm just using the console here, so let me give it more space here.", 'start': 602.478, 'duration': 9.463}], 'summary': 'Creating functions to multiply by different factors and returning new functions based on the factor passed in.', 'duration': 24.236, 'max_score': 578.062, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0578062.jpg'}, {'end': 742.388, 'src': 'heatmap', 'start': 697.898, 'weight': 1, 'content': [{'end': 709.888, 'text': 'create a function with a factor of two and let tripler create a function with a factor of three, now I can say doubler four and I get eight,', 'start': 697.898, 'duration': 11.99}, {'end': 713.19, 'text': 'or I can say tripler four and I get 12..', 'start': 709.888, 'duration': 3.302}, {'end': 717.273, 'text': 'Okay, so this is this idea of higher order functions.', 'start': 713.19, 'duration': 4.083}, {'end': 719.815, 'text': 'Oh! All right, actually, two things that I forgot.', 'start': 717.614, 'duration': 2.201}, {'end': 720.815, 'text': 'Number one is.', 'start': 719.835, 'duration': 0.98}, {'end': 727.76, 'text': 'this is also an example of a closure, meaning that when you create this function by passing in factor,', 'start': 720.815, 'duration': 6.945}, {'end': 735.704, 'text': "this kind of closure bubble lives on and the value of factor is retained, even though it's sort of technically a local variable just to this function,", 'start': 727.76, 'duration': 7.944}, {'end': 736.204, 'text': 'multiplier.', 'start': 735.704, 'duration': 0.5}, {'end': 740.467, 'text': 'So I have another video all about JavaScript closures, and this is an example of that as well.', 'start': 736.425, 'duration': 4.042}, {'end': 742.388, 'text': 'And then I forgot.', 'start': 740.727, 'duration': 1.661}], 'summary': 'Higher order functions with factors 2 and 3, demonstrating closures.', 'duration': 21.573, 'max_score': 697.898, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0697898.jpg'}, {'end': 780.095, 'src': 'embed', 'start': 758.735, 'weight': 2, 'content': [{'end': 769.332, 'text': "So what does the arrow function do? This is actually, if I just rewrite this function down here, this is what I've written.", 'start': 758.735, 'duration': 10.597}, {'end': 770.872, 'text': 'So the arrow function.', 'start': 769.932, 'duration': 0.94}, {'end': 776.534, 'text': 'you can watch my arrow function tutorial allows me to first of all, instead of saying the word function,', 'start': 770.872, 'duration': 5.662}, {'end': 780.095, 'text': 'I can delete the word function and I can put the arrow here.', 'start': 776.534, 'duration': 3.561}], 'summary': "Arrow function allows replacing 'function' with an arrow.", 'duration': 21.36, 'max_score': 758.735, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0758735.jpg'}, {'end': 941.216, 'src': 'heatmap', 'start': 911.773, 'weight': 0.91, 'content': [{'end': 914.404, 'text': 'Refresh Double or four, I get eight.', 'start': 911.773, 'duration': 2.631}, {'end': 916.184, 'text': 'And triple or four, I get 12.', 'start': 914.844, 'duration': 1.34}, {'end': 916.825, 'text': 'So wonderful.', 'start': 916.184, 'duration': 0.641}, {'end': 920.426, 'text': 'Look at that lovely use of the arrow functions and higher order functions.', 'start': 916.985, 'duration': 3.441}, {'end': 922.487, 'text': "So I'm done now with this video.", 'start': 920.446, 'duration': 2.041}, {'end': 929.571, 'text': "What I've really just covered here basically is that a higher order function is a function that either receives a function as a callback.", 'start': 922.747, 'duration': 6.824}, {'end': 934.693, 'text': "And if you're writing a JavaScript library and you're asking people to call functions that happen asynchronously,", 'start': 929.611, 'duration': 5.082}, {'end': 936.394, 'text': 'this might be something you provide as an option.', 'start': 934.693, 'duration': 1.701}, {'end': 938.895, 'text': "Oh, if you send me a function, I'm the library.", 'start': 936.454, 'duration': 2.441}, {'end': 941.216, 'text': "I will execute that function for you to let you know when I'm done.", 'start': 938.915, 'duration': 2.301}], 'summary': 'Higher order functions explained with examples in javascript.', 'duration': 29.443, 'max_score': 911.773, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0911773.jpg'}], 'start': 529.881, 'title': 'Higher order functions', 'summary': 'Introduces the concept of higher order functions using the example of a multiplier function, demonstrating how it returns a new function that multiplies a given number by a specified factor, allowing for the creation of custom functions to multiply by different factors, and also highlighting the use of closure and arrow functions.', 'chapters': [{'end': 970.425, 'start': 529.881, 'title': 'Understanding higher order functions', 'summary': 'Introduces the concept of higher order functions using the example of a multiplier function, demonstrating how it returns a new function that multiplies a given number by a specified factor, allowing for the creation of custom functions to multiply by different factors, and also highlighting the use of closure and arrow functions.', 'duration': 440.544, 'highlights': ["By using the example of a multiplier function, the video demonstrates the concept of higher order functions that return a new function based on the factor passed in, enabling the creation of custom functions to multiply by different factors, exemplifying the multiplier function's ability to create a function that retains the value of the factor passed in, functioning as a closure.", "The tutorial also showcases the use of arrow functions to simplify function definitions, highlighting the ability to write concise code by eliminating the 'function' keyword, parentheses for single arguments, and return statement for single-line functions, while acknowledging the potential for confusion due to the new syntax, but emphasizing its intuitive qualities with increasing usage."]}], 'duration': 440.544, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/H4awPsyugS0/pics/H4awPsyugS0529881.jpg', 'highlights': ['The video demonstrates higher order functions creating custom functions to multiply by different factors.', 'The multiplier function retains the value of the factor passed in, functioning as a closure.', "Arrow functions simplify function definitions, eliminating 'function' keyword and parentheses for single arguments."]}], 'highlights': ['The tutorial covers the use of arrow functions in JavaScript ES6 and their availability in different versions of JavaScript.', 'The speaker contrasts his experience with object-oriented programming in Java with the popular and interesting functional programming.', "The video discusses the concept of higher order functions and the speaker's interest in exploring functional programming in JavaScript.", 'Exploring various ways to declare functions in ES6, including var, let, and const, indicating the numerous possibilities available in JavaScript for function declaration.', 'The concept of higher order functions is defined as functions that take a function as input or send a function as output.', 'Useful higher order functions for JavaScript arrays include Map, Sort, Reduce, and Filter.', 'The speaker outlines the plan to integrate higher order functions into a particle system example, aiming to simulate a real-life scenario in creative coding and graphics.', 'The distinction between regular functions and higher order functions is highlighted, with the example of a basic function declaration being used to illustrate the concept.', 'The chapter covers the concept of JavaScript functions, including setup functions and defining functions with callbacks, emphasizing their relevance in JavaScript libraries.', 'The importance of error checking in function callbacks is emphasized, ensuring smooth execution and preventing errors.', 'The concept of passing anonymous functions as arguments is explained, demonstrating a common practice in JavaScript programming.', 'The concept of a function factory is introduced, providing a different approach to organizing and using functions in JavaScript.', 'The video demonstrates higher order functions creating custom functions to multiply by different factors.', 'The multiplier function retains the value of the factor passed in, functioning as a closure.', "Arrow functions simplify function definitions, eliminating 'function' keyword and parentheses for single arguments."]}