the last question can be done only using reduce Because when we chain multiple operators we increase the complexity. Thanks for the video, learned alot. let output =students.reduce((acc,curr,i,arr)=>{ if(curr.marks60 ){ acc=acc+curr.marks } return acc; },0) console.log(output);
Not completely true. The complexity would still be in the range of O(n). I do agree that it will 'increase', say, by a factor of k times n but it would still be linear. In real codebases, you prefer readability over over-optimizations.
Here's a more readable approach- const totalMarks = students .map(x => { if (x.marks < 60) x.marks = x.marks + 20; return x; }) .reduce((acc, curr) => { if (curr.marks > 60) return acc + curr.marks; return acc; }, 0); console.log(totalMarks); Once catch which is similar to your approach is that it modifies the original array
I think the best content on javascript ever on TH-cam because you just don't teach theory but also the potential questions to be asked related to them. Please complete this interview playlist of javascript and don't stop making videos . Waiting for your prototype and inheritance video
Thanks for the videos man, using them a lot to help prepare for interviews. One flaw I found with your reduce polyfill, though, is that you need to check if the accumulator has a value of 0 first. Normal reduce lets you pass in a value of 0 to start, but if you just check for truthiness 0 will evaluate to false. I discovered this when testing my own reduce method on your problem at 20:50 . It returned [object Object] because it was taking the this[i] value as one of the objects of the array. A minor detail though, thanks again!
Array.prototype.myReduce = function (cb, initialValue) { var accumulator = initialValue; for (var i = 0; i < this.length; i++) { if (accumulator !== undefined) { accumulator = cb(accumulator, this[i], i, this); } else { accumulator = this[i]; } } return accumulator; }; ACCORDING TO MEDIUM ARTICLE ON POLYFILLS
Good concept. Liked the way you broke down problem and showed approach to resolve it. Also, there is one more difference between forEach and map. If element is undefined then map will skip that iteration where as forEach won’t skip that. I found this issue when I ran new Array(3).map(cb) here map function didn’t work at all. That’s where I came across this issue. PS: fix for above issue is const res = new Array(3).fill(1).map(cb) 👻
arr.length is a hacky solution, I don't recommend it. Those are called sparce array(not sure of names). Basically all the HOC functions which are introduced for array prototypes avoid this type. Since they consider this as bad data formatting. I don't remember the exact source of this topic. You can give it a shot in MDN docs.
Better solution for last Question : - const result = students .map((stud) => (stud.mark < 60 ? { ...stud, mark: stud.mark + 20 } : stud)) .reduce( (accu, curStudent) => curStudent.mark > 60 ? accu + curStudent.mark : accu, 0 ); Reason why is this solution better : - 1st reason : you save using Filter method means more optimized . 2nd reason : The solution provided in video at 24:32 , he mutates the stu.mark += 20 which in result also mutates the original array(students) which is bad practice.
Awesome video, thank you for sharing your expertise on map, filter, and reduce polyfills. The explanations and examples were very clear and helpful. I appreciate the effort you put into creating such a valuable resource for JavaScript interview preparation. Keep up the great work!
in custom reduce function we can simply add default value to initialValue, it's cleaner and more understantable Great content though! Array.prototype.myReducer = function(callback, initialValue = this[0]) { let result = initialValue; for(let i = 0; i < this.length; i++) { result = callback(result, this[i], i, this) } return result }
Great video! Just that reduce prototype should not be checked against accumulator to assign initial value, instead should be checked for accumulator value being undefined or not . So that if you do console.log([0,2,3].myReduce((acc,curr)=>{return acc*curr},0)); you will get 0 not 6.
hey dude.first of all thanks for the all videos. i have just learned your redux concept video. your way of teaching is awesome. and one more thing please wear small size eyeglass
Firstly thank you for making these kinds of videos. These videos are super helpful.😍 And what kind of questions do interviewers ask in React? Please make a video of this. Also, Having problems in implementing useReducer. Please refer to some good resources☹
hey, this polyfill for reduce is not giving correct result when we have to find sum of square of array items. for that we gave initial value as 0 ,so in for loop when we are checking accumulator has value or not it takes zero is false value assigned the value of first index instead of square of it. to removed this Error we have to refactor our ternary operator checking by accumulator=(accumulator===undefined)?this[i] : cb(accumulator,this[i],i,this); so when initial value is given as zero that time it will not take this as falsy value and call the callback function instead assigning first index value.
i see on issue in the reduce method polyfill that if we send 0 as the initial value, this implementation breaks due to nullish coalescing since it takes 0 as a falsy value so we can update the check like acc = acc || acc== 0 ? cd(params): this[index]
Array.prototype.myReduce = function (cb, initialValue) { let acc = initialValue != undefined ? initialValue : this[0]; for (let i = 0; i < this.length; i++) { acc = cb(acc, this[i], i, this); } return acc; }; Brother even i had the same thought, you can try this i think this will solve the issue of initial value as 0. And thank you very much for the insightful interview questions @RoadsideCoder. They are incredibly helpful in preparing me for future opportunities.
For reduce polyfill, we should only check if accumulator is undefined when i=0. We should not use ? To check undefined. See the output by giving [-1, 1, 2, 3]
can you please tell what can be the output of the following code function sample(){ console.log(x) console.log(y) } var x = 10; let y = 11; sample(); and also explain
the output will be 10,11. Initially variables and function are stored in memory component of execution context. in code run phase once it reaches function call it access the global variables such as x and v and logs them to the console.
Excellent video, however last problem statement seemed fine to be executed via a single reduce function :) let students = [ {name:"a", marks:80}, {name:"b", marks:69}, {name:"a", marks:35}, {name:"a", marks:55}, ] const arr = students.reduce((acc,curr)=>{ if(curr.marks>60) return acc + curr.marks; else if(curr.marks+20>60) return acc + curr.marks+20; else return acc; },0) console.log(arr);
Final qn one other approach: const result = students.reduce((acc,current)=>{ let sum = (current.mark =60){ acc = acc + sum; } return acc; },0) console.log(result)
Hey, after seeing polyfill of map and filter i have created polyfills of reduce method by my own const arr = [1, 2, 3, 4]; Array.prototype.Reducer = function (fn, temp = this[0]) { let acc = temp; for (let i = 0; i < this.length; i++) { acc = fn(acc, this[i]); } return acc; }; console.log(arr.Reducer((sum, el) => sum + el, 0));
Hi, Piyush, first of all, thank you so much for this video, I'm just following every video.. I've one doubt, I copied exact code for reduce function polyfill,..... "return acc * curr" (Multiply) is not working if I put initialValue as 0, if I dont put it, its working.. in original reduce function its working. Not sure why, I'm not getting.. Can you please suggest where should I do any changes or look into to fix this. Please. :(
hi, just one correction for the polyfill of reduce method...in ternary operator we are providing initial value as 0 but still else part will be executed because 0 is a falsy value.please correc it...thanks
Hey i am curious to know the logic behind your channel name 'roadsidecoder'. How the idea came in your mind to take the name roadsidecoder also want to know the meaning of this?
You have made great videos but what made what u are explaining to be like magic is ur UNDERSTANDING of JAVASCRIPT LOGIC. NON of the videos on TH-cam explain LOGIC OF SYNTAX. No learner would understand POLYfill with understanding JS SYNTAX LOGIC
Bro in 20.42 u said only one student has rollnumber more than 15 but 2 of them are more than 15 u have used && operator and it gives only one student result
🔴 Get my Complete Frontend Interview Prep course - roadsidecoder.com/course-details
bhai 2/4 bot(twitter, telegram, discord) bala projects bhi karado na please!🙏🙏
the last question can be done only using reduce Because when we chain multiple operators we increase the complexity. Thanks for the video, learned alot.
let output =students.reduce((acc,curr,i,arr)=>{
if(curr.marks60 ){
acc=acc+curr.marks
}
return acc;
},0)
console.log(output);
Not completely true. The complexity would still be in the range of O(n). I do agree that it will 'increase', say, by a factor of k times n but it would still be linear. In real codebases, you prefer readability over over-optimizations.
Here's a more readable approach-
const totalMarks = students
.map(x => {
if (x.marks < 60) x.marks = x.marks + 20;
return x;
})
.reduce((acc, curr) => {
if (curr.marks > 60) return acc + curr.marks;
return acc;
}, 0);
console.log(totalMarks);
Once catch which is similar to your approach is that it modifies the original array
Want to thank you 😊 .. got selected at Paytm ( ur js interview questions helped a lot)
Bro aur kuch batao kaise apply kiya kya poocha gya kitna experience tha aur package bgera if you are comfortable
Is Paytm a good option in the current situation? have my last round tomorrow but am a bit skeptical about should I proceed or not.
guys did you attend for DSA rounds too?
Wow dude, congratulations! Message me on instagram @RoadsideCoder. I'd love to know more
This guy is roadside coder video editor😂😂
I think the best content on javascript ever on TH-cam because you just don't teach theory but also the potential questions to be asked related to them. Please complete this interview playlist of javascript and don't stop making videos . Waiting for your prototype and inheritance video
Thanks for making this video ❤😢
Glad you found it helpful! 💖
You are the most underrated JS content creator. Thanks for your awesome contents!
Thanks for the videos man, using them a lot to help prepare for interviews. One flaw I found with your reduce polyfill, though, is that you need to check if the accumulator has a value of 0 first. Normal reduce lets you pass in a value of 0 to start, but if you just check for truthiness 0 will evaluate to false. I discovered this when testing my own reduce method on your problem at 20:50 . It returned [object Object] because it was taking the this[i] value as one of the objects of the array. A minor detail though, thanks again!
Thanks for the feedback
Array.prototype.myReduce = function (cb, initialValue) {
var accumulator = initialValue;
for (var i = 0; i < this.length; i++) {
if (accumulator !== undefined) {
accumulator = cb(accumulator, this[i], i, this);
} else {
accumulator = this[i];
}
}
return accumulator;
};
ACCORDING TO MEDIUM ARTICLE ON POLYFILLS
very nicely explained the concepts with exercises....awesome!!!!keep sharing such content!!
Thanks, You can find full course here - roadsidecoder.com/course-details
Super bro fantastic ....
you could use "quokka extension" to log the values in vs code itself
your all videos are Praiseworthy💯. I Improved a lot after watching your tutorials 😍.. tons of thanks and respect🙏
Wow, Great to hear that!
U are making me stronger than my past. Love u brother..
🙏❤️
Good concept. Liked the way you broke down problem and showed approach to resolve it.
Also, there is one more difference between forEach and map. If element is undefined then map will skip that iteration where as forEach won’t skip that.
I found this issue when I ran new Array(3).map(cb) here map function didn’t work at all. That’s where I came across this issue.
PS: fix for above issue is
const res = new Array(3).fill(1).map(cb) 👻
This is not an issue, it just creates an empty array so map doesn't iterate over empty array.
Think of it as
let arr = []
arr.length = 3
arr.length is a hacky solution, I don't recommend it. Those are called sparce array(not sure of names). Basically all the HOC functions which are introduced for array prototypes avoid this type. Since they consider this as bad data formatting. I don't remember the exact source of this topic. You can give it a shot in MDN docs.
I was confused in this topic this video is life saver thanks.
Maja aagaya bhaiya thank you...
Awesome
Helped a lot. Thanks!
Awesome learning from you🎉
Better solution for last Question : -
const result = students
.map((stud) => (stud.mark < 60 ? { ...stud, mark: stud.mark + 20 } : stud))
.reduce(
(accu, curStudent) =>
curStudent.mark > 60 ? accu + curStudent.mark : accu,
0
);
Reason why is this solution better : -
1st reason : you save using Filter method means more optimized .
2nd reason : The solution provided in video at 24:32 , he mutates the stu.mark += 20 which in result also mutates the original array(students) which is bad practice.
Awesome video, thank you for sharing your expertise on map, filter, and reduce polyfills. The explanations and examples were very clear and helpful. I appreciate the effort you put into creating such a valuable resource for JavaScript interview preparation. Keep up the great work!
Its really amazing sir
Thanks for such good explanation!
Thanks for this 💚
Awesome Explanation
U're so funny and Ur teaching is so wonderful...I think u're among the best..No i don't think,i'm sure...
Yes sure, plz add more videos like this. Thank you
Thank you 🙂👍
Completed ✅
You are doing well ❤❤
Your video has made these confusing concepts much clearer. Thanks Alot man!
Glad to hear it!
thanks for helping to understand the concept brother
Very helpful👍🏻
Hello, you did a very good job posting these JS interview questions!
After following you on twitter,i get 100% hike,it works
I knew it works 😁
Hey ! Thanks for explaining so nice and marveless
in custom reduce function we can simply add default value to initialValue, it's cleaner and more understantable
Great content though!
Array.prototype.myReducer = function(callback, initialValue = this[0]) {
let result = initialValue;
for(let i = 0; i < this.length; i++) {
result = callback(result, this[i], i, this)
}
return result
}
keep coming these valuable videos
Thanks!!
Awesome content bro 🤜...
Great please keep uploading regularly
Trying my best, Unable to get time due to job 😕
Thank you For This.
PS: In last question, Inside map you modified the original students.
Nice content bro...thanx a lot very helpful for interviews.
Legend brother, One more amazing video❤️
🙏🔥
Great video! Just that reduce prototype should not be checked against accumulator to assign initial value, instead should be checked for accumulator value being undefined or not . So that if you do console.log([0,2,3].myReduce((acc,curr)=>{return acc*curr},0)); you will get 0 not 6.
Thankyou sir
Thanks a lot bro for your guidance, with your support I cracked React Js Frontend interview as a frasher.
Wow congratulations!
This was a really great video, thanks!
hey dude.first of all thanks for the all videos. i have just learned your redux concept video. your way of teaching is awesome. and one more thing please wear small size eyeglass
Love you from Pakistan 🇵🇰 I got a remote job in the US your videos helped me a lot
thank you bro thank you
What all vscode extension do u use , I like the one u use of auto spacing or identation. Which one is that?
Firstly thank you for making these kinds of videos. These videos are super helpful.😍 And what kind of questions do interviewers ask in React? Please make a video of this. Also, Having problems in implementing useReducer. Please refer to some good resources☹
Glad you liked it! Also for useReducer, you can watch my shopping cart video on my channel.
hey, this polyfill for reduce is not giving correct result when we have to find sum of square of array items. for that we gave initial value as 0 ,so in for loop when we are checking accumulator has value or not it takes zero is false value assigned the value of first index instead of square of it. to removed this Error we have to refactor our ternary operator checking by
accumulator=(accumulator===undefined)?this[i] : cb(accumulator,this[i],i,this);
so when initial value is given as zero that time it will not take this as falsy value and call the callback function instead assigning first index value.
i see on issue in the reduce method polyfill that if we send 0 as the initial value, this implementation breaks due to nullish coalescing since it takes 0 as a falsy value
so we can update the check like acc = acc || acc== 0 ? cd(params): this[index]
Array.prototype.myReduce = function (cb, initialValue) {
let acc = initialValue != undefined ? initialValue : this[0];
for (let i = 0; i < this.length; i++) {
acc = cb(acc, this[i], i, this);
}
return acc;
};
Brother even i had the same thought, you can try this i think this will solve the issue of initial value as 0.
And thank you very much for the insightful interview questions @RoadsideCoder. They are incredibly helpful in preparing me for future opportunities.
Bro your interview questions are very good, but please provide source code also it will be very helpful for us .
All the source code here - roadsidecoder.com/course-details
nice video, lot of insights for me (work exp under 2 years)
Great to hear!
For reduce polyfill, we should only check if accumulator is undefined when i=0. We should not use ? To check undefined. See the output by giving [-1, 1, 2, 3]
Array.prototype.myReduce = function (cb, initialValue) {
var accumulator = initialValue;
for (var i = 0; i < this.length; i++) {
if (accumulator !== undefined) {
accumulator = cb(accumulator, this[i], i, this);
} else {
accumulator = this[i];
}
}
return accumulator;
};
@@chhavimanichoubey9437 your solution will not work if we pass undefined as accumulator
can you please tell what can be the output of the following code
function sample(){
console.log(x)
console.log(y)
}
var x = 10;
let y = 11;
sample();
and also explain
the output will be 10,11. Initially variables and function are stored in memory component of execution context. in code run phase once it reaches function call it access the global variables such as x and v and logs them to the console.
your javascript knowledge is really great! can you make a video on topics like event loop and prototypal inheritance as well.
Thanks Avneet!
Excellent video, however last problem statement seemed fine to be executed via a single reduce function :)
let students = [
{name:"a", marks:80},
{name:"b", marks:69},
{name:"a", marks:35},
{name:"a", marks:55},
]
const arr = students.reduce((acc,curr)=>{
if(curr.marks>60) return acc + curr.marks;
else if(curr.marks+20>60) return acc + curr.marks+20;
else return acc;
},0)
console.log(arr);
It can be more simpler.
students.reduce((acc,curr,i)=>{
let val = curr.marks
Another solution to the last problem:
const op = users.filter((user) => (user.marks + 20) > 60).reduce((acc, user) => acc + user.marks, 0);
😀😀
Please make these video series regularly bro 🥺 🥺
Trying my best, Unable to get time due to job 😕
Awesome content bro 🤜...
Which documentation you refer to for preparing ur content? Can you suggest one?
MDN Docs
Final qn one other approach:
const result = students.reduce((acc,current)=>{
let sum = (current.mark =60){
acc = acc + sum;
}
return acc;
},0)
console.log(result)
graat I like it
Thank you sir.. please cover callback and promise in Javascript .
Sure
What extensions in VSCode are best for day to day UI coding?
Why did you use Var( instead of Let ) in Reduce polyfill ?
Var accumulator = initialValue;
same ques
Bro in redux reducer get actions from dispatch function?
Would you make a video on nested json . Like Filtering nested json array .
Please start the e-commerce series with Geo location api to filters the nearest shops
Please make a video for Array.flat() prototype
Sir please make a video on prototype prototyipal inheritance
Definitely
when we dont give any initial value for reduce in last task, it will take whole object as initial value right? so we need to give initial value?
it will take 1st element of array as an initial value
@@RoadsideCoder but then we have to do something like this acc.marks right?
Make video on interview question on css. Basics
Sure!
Hey, after seeing polyfill of map and filter i have created polyfills of reduce method by my own
const arr = [1, 2, 3, 4];
Array.prototype.Reducer = function (fn, temp = this[0]) {
let acc = temp;
for (let i = 0; i < this.length; i++) {
acc = fn(acc, this[i]);
}
return acc;
};
console.log(arr.Reducer((sum, el) => sum + el, 0));
Pls make a video on react location and react query any time soon
16:9 This works for both map and forEach so that is not actually a difference.
Yes bjri😊
BHAIYA PLZZ INCREASE VIDEO FREQUENCY AND ALSO CAN YOU HELP ME TO GET AN INTERNSHIP AS FRONT END DEVELOPER?
@Roadside Coder PR review and code changes kaise krte he please make detailed video on that
ok i will
@@RoadsideCoder thankss bro..please make asap as I am giving interviews..big thanks for your reluctant efforts 🎉🍷🍷
why are we pushing the callback into the temp array can you please explain, why could not we just push this[index], instead we push callback?
so this inside the filter method points to the original array and the filter should return a new array which is temp in our case
Hi, Piyush, first of all, thank you so much for this video, I'm just following every video..
I've one doubt, I copied exact code for reduce function polyfill,..... "return acc * curr" (Multiply) is not working if I put initialValue as 0, if I dont put it, its working.. in original reduce function its working. Not sure why, I'm not getting..
Can you please suggest where should I do any changes or look into to fix this. Please. :(
hi, just one correction for the polyfill of reduce method...in ternary operator we are providing initial value as 0 but still else part will be executed because 0 is a falsy value.please correc it...thanks
Wont make a difference
How do you prepare for interviews?
I watch Roadside Coder On TH-cam
@@RoadsideCoder 😀. Can you share the roadmap for JS interview preparation?
# Hi, If I follow this series only then am I ready for an interview as frontend dev?
I'm a fresher..
Yes, for js interviews
Will this reduce polyfill work for cases like: initialValue = 0 and callback = (acc, curr, i, arr ) => return acc * curr
We might have to check whether the acc is actually passed or not i.e. checking if it is undefined or not
Obviously it will!
I called the reduce polifill in students object but it seems like initial value parameter is not configured and doesn't work
Bhai, I just want to ask whether they inquire about (DSA) or (OOP) during front-end or MERN-Stack interviews.
both
@@RoadsideCoder dsa and oop just like cpp??
Hey i am curious to know the logic behind your channel name 'roadsidecoder'. How the idea came in your mind to take the name roadsidecoder also want to know the meaning of this?
Haha, is there something wrong with it?
You have made great videos but what made what u are explaining to be like magic is ur UNDERSTANDING of JAVASCRIPT LOGIC. NON of the videos on TH-cam explain LOGIC OF SYNTAX.
No learner would understand POLYfill with understanding JS SYNTAX LOGIC
💚🧡
where is video on protypes?
Make a pdf of this questions and answers
Map filter find reduce
Dynamic Clock Javascript Project : github.com/ProgramarWe/Project/tree/main
Bro in 20.42 u said only one student has rollnumber more than 15 but 2 of them are more than 15 u have used && operator and it gives only one student result
Sir , please tickets booking system ka project banaiye MERN Stack me
I personally request you sir please
Sure
const totalMarks = students.reduce((acc, cur, i, arr) => {
if(cur.marks < 60) {
cur.marks += 20
}
return (cur.marks >= 60) ? (acc + cur.marks) : acc
}, 0)
console.log(totalMarks);
hindi
go slow , reading book or what