JavaScript Currying function ( method ) explained Tutorial
Вставка
- Опубліковано 21 лют 2016
- How to build a curry function in javascript that takes function as an argument.
IN this tutorial we will understand what currying means,
- We will build a simple curry function to add two number
- We will also build a generic curry method that takes function as an argument.
- We will also look the use cases and benefits of using currying
currying in javascript, curry function, curry method, currying arguments, curry partials, lesson , javascript pattern, techsith, techsithtube ,
#javaScript #currying #Pattern
*My Udemy Courses
www.udemy.com/js-masterclass/
www.udemy.com/course/react-ho...
Follow me for technology updates
* / techsith
* / techsith
* / techsith1
* / 13677140
* / patelhemil
Help me translate this video.
* ua-cam.com/users/timedtext_cs_...
Note: use translate.google.com/ to translate this video to your language. Let me know once you do that so i can give you credit. Thank you in advance. - Наука та технологія
Thank you so much Hemil! Another great video. Please keep it up, you are so good at this!
Array.prototype.avarage=function(){
var total=0;
for(var i=0;i
Keep on learning Anu!
My favorite javascript tutorial channel. Thanks ^^
Simp
hey @techsith, really love the videos.
Would appreciate if you could leave the links to jsfiddle or whatever external sources you want viewers to visit in the video description. Thanks and keep up the awesome work!!
Thanks for the videos!
I have learned a lot in this video. And the explanation is great.
Thank you, this is really helpful.
you accent is really good man! great lecture too!!
Thanks for the comment Wagner, Some people complained about the accent . So feels good when i get comments like this
Fake accent 😅
@@Techsithtube Your accent makes me hot under the collar.
classic techsith! Thanks
Nice tutorial. Had one suggestion at 5.56. Since you are using ES6 feature, you could have used to reduce function here to avoid confusion. :)
Finally i understand. Thank you!
Adith, I am glad you got it. Keep it up.
i like curry, especially with pasta. but to use with js is much more tastier :)
The video thumbnails on this channel are unmatched
:)
You are the man. Thank you.
Hi Sir , could you please one example and use case for partial function in javascript , this question was asked in one interview.
I'm just so glad I'm not the only one that thought of this pun 😅
:) Thanks for watching!
This is good, really good
I like your most of video even Udemy also
Hi Patel,
Good to see all of your videos and they are very helpful. Your way of explaining is great!.
I am a wordpress / drupal developer wanted to shift to UI developer job as there is no much scope in my current domain.
I need some guidance to how to prepare javascript( it is like very big ocean).
If you are starting out .
-> Start to learn JavaScript without mixing html and css.
-> Use Jsfiddle to practice. use Github to upload what you learn .
-> Use the latest version of JS ( ES2016) , there are lots of example out here, where they are teaching old js.
-> learn follwoing topics in this order
-> variables definition using ( Let, Const)
-> variable scope
-> functions ( Immediately Invoked function, Function expression, arrow functions, method chaining)
-> closures
-> call, apply bind
-> Object Oriented JS ( I have started a series on it you can follow that. )
-> Ajax, Promises, setTimeout
-> Once you learn above, I would suggest learning React Framework
( Overall i think it would take two to three months to learn all of this)
techsith thank you for the valuable suggestion. I will follow up with that accordingly.
appreciate your quick response.
It was actually invented by Moses Schönfinkel, but Shonfinkelling doesn't have the same ring to it eh? Haskell Curry actually credits Schonfinkel for what is now known as Currying. :)
Yes you are right Mark. Curry brought it to the main stream.
Very good explanation, I am getting laughing for every Js topic you are comparing it with real world scenario s😆😆😆😆😆😆, it's easy to understand we never forget the syntax and topic
Please add links in video description - that would be so much easier :P
Your video is really helpful and much easier to understand and thanks for that. Can you please let me know if this is also called a nested function. :)
yes its similar to nested function in other programming languages.
9:47 can anyone explain why we need to call fn.bind.apply in line 11? as far as I see, in function avg (which will later be passed as 'fn' in line9), there's no use of 'this' keyword. So what's the point of 'apply'?
So fn can accept an array as an argument. He could've used 'null' instead of 'this'.
developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
n.concat(m) returns an array. If he didn't use apply, (...n) in avg function will get an array instead of a series of arguments (1,2,3) which will result to NaN.
Good stuff. On your first example at 2:34 just so I can wrap my head around it. After the "add" execution context if popped off the stack the addToFive variable would be more like.
var addToFive = function(b) {
return a + b;
}
But the 5 is sitting in the "add" execution context variable environment. Basically a closure. I'm I right?
var addToFive = add(5);
+Job Barrs addToFIve would be
var addToFive = function(b){
return 5 +b;
}
where 5 is a closure from the execution of the addTo(5) ;
Make sense?
Very useful one .let me know if you have some real world example of usage .The examples you have taken are very simple and easy to understood.Thanks for the simple examples.It would be very useful if you would make some real world examples where we can make use of them ,because we have been practicing to write different functions and used to call one in another which causes odd results in ajax calling and some parallel programming guides.and finally does these functions wait if they depends on the normal functions while doing parallel programming ..Thanks a lot for the video
+Codesigns Map function in js is a curry function which iterates through arrays . in the folowing example i can finde sqare root
var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
console.log(roots)
or if i want to fide sins of all these number all i have to do is change the function i pass in
var numbers = [1, 4, 9];
var sins = numbers.map(Math.sin);
console.log(sins)
look at he underscore.js source code they are using it heavily. as following
var optimizeCb = function(func, context, argCount) {
if (context === void 0) return func;
switch (argCount == null ? 3 : argCount) {
case 1: return function(value) {
return func.call(context, value);
};
case 2: return function(value, other) {
return func.call(context, value, other);
};
case 3: return function(value, index, collection) {
return func.call(context, value, index, collection);
};
case 4: return function(accumulator, value, index, collection) {
return func.call(context, accumulator, value, index, collection);
};
}
return function() {
return func.apply(context, arguments);
};
};
Thanks
Thanks for the information
Nice
Nice video. I don't know why you show advanced techniques, then use a crappy for loop when you could use forEach.. :)
Thanks for pointing it out. I used loop so that people who dont know forEach can also learn!
best lecture
I get the idea but just for clarification, when you explain the advantage of currying in 8:50, you said that the first AVG will be holded as closure but that is not really the case in your example right?
I thought that somenthing like this will do:
var spiceUp = function(fn, ...n){
var r = fn.apply(this, n);
return function(...m){
m.push(r);
return fn.apply(this, m);
}
}
Please correct me if I'm wrong.
Loved this playlist of advanced JavaScript; You are an excellent teacher!
Rapael , there is an issue with this approch. it works with 1,2,3 and 2
but lets say if you try 1,2,3 and 4 it would give you wrong results.
here var r = fn.apply(this, n); where r would be 2 if you pass 1,2,3
then in the next part if you pass 4, this would get an average of 2 and 4 which is 3 instead of the 1+2+3+4 /4 which would be 2.5
Hi can you please provide a tutorial for writing js array coding technique like reversing given string , metrics , sorting with basic for loop instead of inbuilt methods something more like this ..
I have watched many of your videos really helpful. Have a question on the usage of apply. Why do you have to use fn.apply(this, n.concat(m)). The same thing can be achieved by just using fn(n.concat(m)). What difference apply makes in this case?
fn.apply(this, n.concat(m)) is needed as the first function fn.apply binds that object do the calculation.. if you try fn(n.concat(m)) it wont work . I have a tutorial on call apply and bind . see it to understand
You are right, It didn't work. Watched your video as well, I made a small change and it worked, here it is repl.it/CnHW/1. (BTW, this tool is good, has code and console side by side). Thanks for your response, appreciate it.
you got it. m gets converted to an arry if you use apply. or u can convert it using ...m. BTW, nice tool .I like the fonts. and the helper.
same question even I have.. I didn't get exactly why we have used .apply(). We could have directly tried fn(n.concat(m)) . Though it doesn't work but wanted to know why it doesn't work. I have already gone through the call, apply, bind tutorial.
I can't believe there wasn't any curry here. No tikka masala, no vindaloo, no rogan josh.
It makes me so sad I may have to give up programming for a couple of weeks :(
:) Sorry to disappoint you . hopefully you can cook up some JavaScript with curry function .
Try ShowMeTheCurry.com :)
Merci :)
"You just use two numbers' average and it is very useful" - you said at 9:17 during this clip. What I don't understand about it is, we are never taking the average of the numbers that we already have. What we are doing is just concatenating arrays and make a big array and sending it to the function. How does it actually improve the performance. According to what I understood, it will run for the same time as you will run it by calling the function directly and passing on all the numbers. We are just holding the numbers in the closure and not the average of those. If we would have utilized the average from the numbers we have, it would have improved the performance. Am I stating it right? Can you help me understand?
If we have average in closure and utilize it, will it be better way of doing it.
You are right, inside it holds all the numbers. So it takes the same time as normal avg function. However, the power of this function is exactly in that, becase of the closure it holds values inside for future use. and it wont really calculate avg until you call doAvg() function. so situations where you want to persist as the data is coming in and dont want to calculate until everything is ready.
techsith Thank you so much for your response. I got your point.
Also I forgot to mention, love the way you teach by simplifying everything.
Thank you so much for the tutorial series.
Hi,
I can't see how this is storing/holding the average inside a closure. The actual average is calculated only when you execute the doAvg variable ( function ) and not when you create it using spiceUp(avg,1.2,3).
So everytime you execute doAvg, m+n number of elements are used to calculate average. Can you please explain this in detail?
var spiceUp = function(fn, ...n){
var avg = fn.apply(this, n);
return function(...m){
return fn.apply(this, m.concat([avg]));
}
};
var doAvg = spiceUp(avg, 1,2,3);
console.log(doAvg(7,8,10,12));
console.log(doAvg(15,18));
very helpful tutorial ...can we make like map functionality using currying ??
Can you give little bit more info on how you want this map function to be?
In the spiceUp function , you used fn.apply(this, n.concat(m)). Why can not we directly return fn(n.concat(m)) ? By the way it gives me the wrong result, but I don't know how ? Could you explain me that ?
Thanks.
Thanks for watching seenuvasan!
i'm a little bit confusing here. can you explain why you use "this" as a context in fn.apply() in spiceUp function?
apply() method basically takes a function which is fn here and sets to its own this. hense the this. I do have a tutorial on call, apply and bind. if you like to check it out.
Hows apply necessary here?
Hi,
What is difference between closure and currying ?
newbie here: as I understand closure gets values that seems unaccesible because of the private scope
and currying adds more functionalities to functions
(well that's not exactly how I understand it, but how I can try to explain it)
How is this different from function chaining?
Currying is a concept that uses function chaining and closure.
Even if you don't use apply, I think it will work
Which example are you referring to ?
@@Techsithtube I think he means 2nd one.
You can just return fn(n.concat(m)) and result should be the same.
How to call super in an instance of sub constructor and an instance of sub constructor cannot access method declared inside main parent constructor, please see below
let Mammal = function (name, legs) {
this.name = name;
this.legs = legs;
this.getDetails = function () {
return `${this.name} walks with ${this.legs} legs`;
};
};
let Human = function (name, legs) {
Mammal.call(name, legs);
};
Human.prototype = Object.create(Mammal.prototype);
let ravi = new Human("Ravi", 2);
console.log(ravi.getDetails())
// here it is giving error and I want to call super in ravi instance.
how can I do that, please suggest
Sir, How many years of experience do u have in js sir
10 years of experience.
@@Techsithtube 🙏🙏🙏🙏 that to will be Js only greatttt
Is
var a = new b()
same as
var a = b(); ?thanks
+Eason王 they are not the same .
when you do var a = new b(); you are creating a new object .
where var a = b(); means if a = "what ever you are returning from the execution of function b():
var curryIt = function(uncurried) {
var parameters = Array.prototype.slice.call(arguments, 1);
return function() {
return uncurried.apply(this, parameters.concat(
Array.prototype.slice.call(arguments, 0)
));
};
};
i didnt understand how it will get arguments
every function has a variable call argument which is an array like object. Basically, it takes all the arguments and put itn this special object name arguments. what that your question?
The second example is too complicated.
it's quite confusing
which part is confusing?
Too bad you had to use 'apply'. You made the lesson harder and confusing at that point. A lesson should be only about the subject you are trying to clarify, otherwise you break the flow of learning.
AVG(4,5,6) is 5, and NOT 3.5 ...
Aha,
((1+2+3) + (3+4+5)) / 6 = 18 / 6 = 3 and Not 3.5.
AVG (AVG(1,2,3) + AVG(3,4,5)) = AVG(2 + 4) = 6/2 = 3 and Not 3.5.
;-)
distributive? algebraic? holistic? "Blücher" ? ^^
Please, show me the way !
AVG(1,2,3,4,5) = 15 = (n·(n+1)) / 2
;-)
Thorsten Brüning AVG(1,2,3,4,5,6) ...