DEV Community

Cover image for 9 cool tips/tricks for Web Developers
Mehul Lakhanpal
Mehul Lakhanpal

Posted on

9 cool tips/tricks for Web Developers

1. Search for files on GitHub repository

Press t in the repo to enter search mode for the project's file structure

Alt Text

2. Highlight/Reply shortcut in Github

  • When in an issue, Highlight the line which needs a reply.

Alt Text

  • Then press r to reply to that from the comment

Alt Text

3. Shortcut to use Lodash

  • Go to the Lodash homepage
  • Open devtools
  • Lodash library is available for use from _ variable

Alt Text

4. Nullish coalescing operator

const height = 0;
console.log(height || 100); // 100
console.log(height ?? 100); // 0
Enter fullscreen mode Exit fullscreen mode

Nullish coalescing operator (??) returns the right-hand side value only if the left-hand side value is undefined or null

5. Convert a number from decimal to binary

toString() can be used to convert numbers to different bases. It takes a param, which specifies the base to convert to.
To convert a number to binary, the base would be 2.

const decimal = 5;
const binary = decimal.toString(2);
console.log(binary); // 101
Enter fullscreen mode Exit fullscreen mode

6. Add Properties to functions

function greetings() {
  console.log("hello world");
  greetings.counter++;
}
greetings.counter = 0;

greetings();
greetings();

console.log(`Called ${greetings.counter} times`); // Called 2 times
Enter fullscreen mode Exit fullscreen mode

7. Change array size using the length property

const arr = [1, 2, 3, 4, 5];
arr.length = 2;
console.log(arr); // [1, 2]
Enter fullscreen mode Exit fullscreen mode

8. Prevent an object's properties value from updating

const obj = {name: 'Codedrops'};
console.log(obj.name); // Codedrops

/* Set the 'writable' descriptor to false for the 'name' key  */
Object.defineProperty(obj, 'name', {
        writable: false
});

obj.name = 'ABC';
console.log(obj.name); // Codedrops
Enter fullscreen mode Exit fullscreen mode

9. Maps can store any type of key

const myMap = new Map([]);

const numberKey = 1;
const stringKey = "str";
const arrayKey = [1, 2, 3];
const objectKey = { name: "abc" };

myMap.set(numberKey, "Number Key");
myMap.set(stringKey, "String Key");
myMap.set(arrayKey, "Array Key");
myMap.set(objectKey, "Object Key");

myMap.forEach((value, key) => console.log(`${key} : ${value}`));

/*
Output:
1 : Number Key
str : String Key
1,2,3 : Array Key
[object Object] : Object Key
*/
Enter fullscreen mode Exit fullscreen mode

Thanks for reading 💙

Follow @codedrops.tech for daily posts.

InstagramTwitterFacebook

Micro-Learning ● Web Development ● Javascript ● MERN stack ● Javascript

codedrops.tech

Discussion (7)

Collapse
madza profile image
Madza

Didn't know about the first three 😉
Useful, thanks 👍

Collapse
bsknath profile image
Basu

That's cool.

Collapse
machineno15 profile image
Tanvir Shaikh

Mind blowing ..
tip 5,6,7 were new & really helpful ..
Thanks for sharing

Collapse
cwraytech profile image
Christopher Wray

Thank you!

Collapse
ronan696 profile image
Ronan D'Souza

Awesome!

Collapse
harshrathod50 profile image
Harsh Rathod

4, 7, 9 are new to me. Very helpful.

Collapse
huongnhd profile image
Jenny N

It actually useful, thank u so much 👍