DEV Community

Michael-Lee-1994
Michael-Lee-1994

Posted on

More Random JavaScript Tips

Intro

We are back again, with some more random JavaScript tips. Don't want to be that guy to link his own blog, but I do have a previous tips blog, you can check it out but I wont link it here cause it feels a little cringe to do so. Since this is part two I'm going to try and make this one a bit more straight to the point, and more showing off the cool tips, rather than explaining everything they do and etc. But let's get started.

Array.fill()

This is a simple built in function for arrays that can be useful in various situations, where you need "dummy" data or like data that you want to be generated for you.

const numbers = Array(10)
//this makes an array with a size 10
Enter fullscreen mode Exit fullscreen mode

Now if you wanted to manually fill in this array with data you could type in the same code but with data filled in it, but a quick easy way to do it is to use the fill method like so.

const numbers = Array(10).fill(1)
//what ever you put between the () fill up the array. So if numbers was console.log you would get
console.log(numbers)
//[1,1,1,1,1,1,1,1,1,1]
Enter fullscreen mode Exit fullscreen mode

Though there are different parameters for the fill method, the first being what you want to use to fill, the 2nd and 3rd being the start and end positions of when to fill. But I wont go in depth about those, here's a link that can explain more though if you want.

A unique way to find unique array items

Everyone knows about how they can use the looping method of .filter to map through and array in order to filter out the unique values of an array. But that method of selecting the unique values is highly dependent on your logic to make sense and work for it to be useful. However if all you want to do is to get all unique values of an array, you can use this method.

const numbers = [1,2,1,3,4,2,1,3,5]
const newNumbers = Array.from(new Set(numbers));

console.log(newNumbers)
//this will return [1,2,3,4,5]
Enter fullscreen mode Exit fullscreen mode

Nullish coalescing ??

So this is a pretty cool tool, that works similarly to the logical OR or || syntax. The double ?? however works in a slightly different way, the || syntax is used when you are comparing 2 values and you want to get a return based on whether the comparison returns either a truthy comparison or a falsey one. However, one down side to || is that this doesn't completely work when the comparison happens with values that are null or undefined. This is where the ?? comes into play, so for the ?? if the comparison returns a null or undefined you will get the right-side return otherwise you get the left side return like so:

const something = null ?? 'default string';
console.log(something);
// expected output: "default string"
//if you used || instead you would get undefined as your console.log

const hmm = 0 ?? 4253;
console.log(hmm);
// expected output: 0
Enter fullscreen mode Exit fullscreen mode

This can be better explained on the docs but it does have various use cases that can be helpful when trying to check if a value you define is null or undefined, or you can use it in other creative ways.

Conclusion

There are many more unique and cool tricks you can use in JavaScript that I haven't gone over, and since Javascript is always getting updates and changing more tricks and stuff are being added and created daily so, keep posted, while i browse around and look for more cool tips for you to use. Nullish coalescing has like a lot of different variations too that I didn't go over, mostly because I am still semi learning about it and am not comfortable explaining them but, maybe soon I will. Thanks for stopping by!

Top comments (0)