Hello Developers! In this tech article I will cover JavaScript Tips, Tricks and Best Practices. In daily coding many times we wrote a long lines of code, read this article I am going to cover best javascript practices, tips & tricks to reduce lines of code and minimize your works using JavaScript in-built functions. I will cover array of JavaScript function along with example right away, So Let’s Start!
Key Topic-
- Replace All
- Group By Array Of Objects
- Next — next()
- Map — map()
- Cast Values in array using — map()
- Filter — filter()
- Find Index — findIndex()
- Best Practice — Avoid If/Else | Switch
- Destructuring Assignment — Smart Tips!
- Numeric Separators
- Get Unique Elements || Remove Duplicate Objects From Array -
- Promise Any
- Logical Assignment Operators
1. Replace All — replaceAll(arg1, arg2)
replaceAll(‘arg1’, ‘arg2’) — Easily replace all the characters that you specify in a string without using a regex. It takes two arguments, arg1 — the character you want to replace and arg2 — the character you want to replace it by.
2. Group By Array Of Objects — reduce()
Very Important Tricks — Many times we need to group result from array, Let’s check how reduce() help us to achieve, over here I have sent two arguments: arg1 — arrCity (array), arg2 — region (key-name — on which you want to apply group)
3. Next — next()
Many times we are required to take a unique number for our business logic and we try random functions but it might chance it will repeat the same number again. Try next() will give you a unique number every time.
4. Map — map()
Map is widely used by developers in daily coding, Map offers various use cases depending upon your custom requirement. Let’s check in code,
Many times we required to add new key-pari within existing array, Let’s do that,
Let’s use another approach and add new key-pair value,
5. Cast Values in array using — map()
Awesome tricks — harness the power of map function you will convert an array of strings into an array of numbers.
6. Filter — filter()
Consider you have an array and you want to take only relevant data, use filter() and apply your criteria it will return you filter result.
7. Find Index — findIndex()
Very useful on daily coding — It’s simple trick to find index of object from array
8. Best Practice — Avoid If/Else | Switch
Many times we write conditional code, either we use if/else Or switch, I would suggest best code practice here and use smart trick, Let’s check how it is going with If/Else,
Let’s avoid If/Else OR Switch and use our TRICK here,
9. Destructuring Assignment — Smart Tips!
All you know about props extractor very well, its bit similar kind of syntax where you can give ALIAS_NAME which you extract from object which return you the smart result, Let’s Check,
10. Numeric Separators
Numeric separators are one of the useful features that have been introduced in ES2021. This makes it easier to read large numbers in JavaScript by providing separation between digits using underscores _.
11. Get Unique Elements || Remove Duplicate Objects From Array
What do you do to get unique elements from an array, manual iterate and check if an element exists or not? Let’s try Set function to get unique results -
12. Promise Any
Promise.any() takes an array of promises as an argument. If all the promises are resolved, then only it will return a result. It will wait until all promises complete their tasks, no matter whether it’s resolve, reject.
13. Logical Assignment Operators
ES2021 come out with three useful logical assignment operators: &&= , ||= , and ??= .
The logical assignment operator &&= is used between two values. If the first value is truthy, the second value will be assigned to it.
The logical assignment operator ||= is also used between two values. If the first value is not truthy(falsy), the second value will be assigned to it.
The logical assignment operator ??= checks if the first value is null or undefined. If it is, the second value is assigned to it.
Thanks for reading Article! || Read More Technical Articles
KPITENG | DIGITAL TRANSFORMATION
www.kpiteng.com || hello@kpiteng.com
