DEV Community

Cover image for 10 ADVANCED JAVASCRIPT TRICKS YOU SHOULD KNOW !!
Sahil Upadhyay
Sahil Upadhyay

Posted on

10 ADVANCED JAVASCRIPT TRICKS YOU SHOULD KNOW !!

Welcome to the wonderful world of JavaScript, where coding meets enchantment! If you’ve ever felt the thrill of creating content on the web but wondered about the hidden strategies behind it, then you’re at the right place.✨🚀

In this blog, we journey through the realm of JavaScript, demystify the complex and embrace the simple. No confusing terminology – just plain English explanations and step-by-step instructions. Whether you're a coding newbie or a seasoned developer, join us as we discover 10 advanced JavaScript tips that will get you going "Aha!"

1.DESTRUCTURING ASSIGNMENT :--

Assignment destructuring is a concise way to extract
values from arrays or objects and assign them to
variables.
It simplifies your code and improves readability. For
arrays, you can use bracket notation, and you can use
braces for objects.

DESTRUCTRUING


2.SPREAD SYNTAX :--

You can use the spread syntax to extend the elements of
an array or the properties of an object into another
array or object.
This is useful for making copies, merging objects, and
passing multiple arguments to functions.

Spread Syntax


3.CURRYING :--

Currying is a functional programming technique in which
a function that takes multiple arguments is transformed
into a sequence of functions, each taking a single
argument.
This allows for better reuse and composition of the
code.

Currying


4.MEMOIZATION :--

It's a caching technique used to store the results of
expensive function calls and avoid unnecessary
recalculations.
It can significantly slow the performance of long-term
recursive or consuming functions.

Memoization


5.PROMISES AND ASYNC/AWAIT :--

Promises and Async/Await are essential to handle
asynchronous operations more gracefully and make code
more readable and maintainable.
They help avoid callbacks hellish and improve error
handling.

Promises-Async/Await


6.CLOSURES :--

Closures are functions that remember the environment in
which they were created, even if that environment is no
longer accessible.
They are useful for creating private variables and for
behavior encapsulation.

Closures


7.FUNCTION COMPOSITION :--

Function composition is the process of combining two or
more functions to create a new function.
It encourages code reuse and helps create
transformations complex step by step.

Function-Composition


8.PROXY :--

The proxy object allows you to create custom behavior
for basic object operations. It allows you to intercept
and modify object operations. 'object, such as
accessing properties, assigning, and calling methods.

Proxy


9.EVENT DELEGATION :--

Event delegation is a technique in which you attach a
single event listener to a parent rather than multiple
listeners to each child. memory usage and improves
performance, especially for large lists or dynamically
generated content.

Event-Delegation


10.WEB WORKERS :--

Web Workers allow you to run JavaScript code in the
background, alongside the main thread.
They are useful for offloading CPU- intensive tasks,
Avoid UI hangs and improve performance Responsiveness.

Web-Workers


CONCLUSION

And there you have it, fellow legal researchers!😊 Together, we traversed the JavaScript galaxy, revealing 10 techniques that seemed magical at first. But now, armed with a sprinkling of understanding and enthusiasm, you’re ready to apply these coding mantras with confidence.

If you enjoyed this magical tour, don't forget to hit the follow button for more coding adventures. And, of course, your comments are the secret sauce that keeps this community thriving. Share your thoughts, questions, or your own JavaScript tricks below. Let's keep the conversation alive!

Thank you for joining this adventure. Until next time, happy coding! 🚀💻✨

Top comments (34)

Collapse
 
sreno77 profile image
Scott Reno

This is very informative but please post text instead of images for the code next time!

Collapse
 
big_smoke profile image
Sahil Upadhyay

Sure, from next time would write code in simple code text format. Sorry for the inconvenience.

Collapse
 
oculus42 profile image
Samuel Rouse

The code examples are images directly ripped from @frontendcharm on Instagram.

Collapse
 
benherbst profile image
Ben Herbst

Or just use DEVSFORDEVS it has code blocks automatically with syntax highlight

Collapse
 
moopet profile image
Ben Sinclair

The markdown here supports syntax highlighting out the box.

Collapse
 
jonrandy profile image
Jon Randy 🎖️

Closures are functions that remember the environment in which they were created...

Unfortunately, this is not correct. For two reasons:

  • Closures are not functions
  • ALL functions remember the environment in which they are created
Collapse
 
big_smoke profile image
Sahil Upadhyay

Appreciate the correction..

Collapse
 
manchicken profile image
Mike Stemle

I don’t mean to be a downer, but lists just like this one—most with significant overlap over this one—have been written on this platform so many times.

What would you like me to take away from yours which wasn’t in the others?

Collapse
 
big_smoke profile image
Sahil Upadhyay

Didn't knew these were there. Eventhough you would have taken away these concepts from others but for some it's relatively new. This post was for them.

Collapse
 
manchicken profile image
Mike Stemle

But it’s not, not really. Some of your points are incorrect, and the way you presented them lacks the context of when to use them, when not to use them, or why.

I love that you want to help newbies, but a list of code screenshots with limited context doesn’t help anybody.

Thread Thread
 
big_smoke profile image
Sahil Upadhyay

Yes would surely provide more code snippets for help in my future post and work on it. Well the truth is never thought while writing this post that i would gain such audience attention so , whatever i can remember while memorizing these topics just wrote that in simple english for better understanding.But It doesn't seems to me that the post here is not helping anybody. There are many positive reaction too. NeverMind Would Improve on my presentation skills and the context weightage . I accept my fault! Apologies.!

Thread Thread
 
manchicken profile image
Mike Stemle • Edited

No friend, I’m not saying you aren’t helpful. I’m saying that I believe you can do better, and I want to read more of what your skills and experience are.

I am, also, saying that there are far too many vague lists on DEV.to. I see them every day, and they’re always so flashy, and they have so many likes but there’s little-to-no substance.

When we start writing, we always have pieces that we wrote which can do better. It is because of the feedback we get that we can more quickly identify weaknesses and improve.

Write something you know, know really well, and go into depth. Add yourself and your experience to the piece you write.

This is the intent behind my comments: not to tear down but to share feedback so we can all grow.

Thread Thread
 
big_smoke profile image
Sahil Upadhyay

Appreciate your feedback. Would definitely keep these point in mind. The flashy thing its true have myself seen this here , looks like people want to learn in crisp and flashy way without spending much time well that makes some sense as these material are already there on web with lot of deeper context, so they want to understand the key definition of that particular topic.
But different people have different taste when it comes to learning. Some like crisp fancy some like detailed context. Respect to both. Would make sure in my further post to balance this ratio so everyone learns happily.

Collapse
 
madalitsonyemba profile image
Madalitso Nyemba

I came across memoization about a month ago doing my 30 Days of JS and used it to optimize my function calls and it really does make a huge difference. Thank you @big_smoke for sharing.

Collapse
 
ernanej profile image
Ernane Ferreira

This is very informative. Thanks for sharing!

Collapse
 
big_smoke profile image
Sahil Upadhyay

Thanks for the Appreciation.

Collapse
 
lnahrf profile image
Lev N. • Edited

Great! Super useful write up. Mastering all of these will get you through most webdev technical interviews.
Next time post code blocks instead of images ;) some of them are hard to read!

Collapse
 
big_smoke profile image
Sahil Upadhyay

Sure, from next time would write code in simple code text format. Sorry for the inconvenience

Collapse
 
fininhors profile image
Francisco Junior

Very useful, good job.

Collapse
 
k1nf profile image
Nikita

Thank you bro! Very useful and important information

Collapse
 
seena profile image
seenA

Fantastic

Collapse
 
gpt-prompt-coder profile image
Josh the Coder

Excellent post, Sahil!

Collapse
 
big_smoke profile image
Sahil Upadhyay

Thanks Gpt Prompt Coder.