DEV Community

Shubham Athawane
Shubham Athawane

Posted on • Updated on

JavaScript 8 Tips and Tricks To write less JavaScript 🙂

1. Declaring Variables

Longhand

let firstName;
let lastName;
let surName = "beast";
Enter fullscreen mode Exit fullscreen mode

Shorthand

let firstName, lastName, surName = "beast";
Enter fullscreen mode Exit fullscreen mode

2. Ternary Operators

Longhand

let answer, value = 15;

if(value%2 = 0)
{
    answer = "Number is even";
}else{
    answer = "Number is not even";
}
Enter fullscreen mode Exit fullscreen mode

Shorthand

let answer = value&2 = 0 ? "Number is even" : "Number is not even"
Enter fullscreen mode Exit fullscreen mode

3. Ternary Short For-Loop

Longhand

const languages = ["html","css","js"];

for(let i = 0;i < language.length;i++){
    const languages = languages[i];
    console.log(languages);
}
Enter fullscreen mode Exit fullscreen mode

Shorthand

for(let languages of languages)console.log(languages);
Enter fullscreen mode Exit fullscreen mode

4. Template Literals

Longhand

const fullName = "codingBeast";
const timeOfDay = "afternoon";

const greeting = "Hello" + fullName + ", I wish you a good" + timeOfDay + "!";
Enter fullscreen mode Exit fullscreen mode

Shorthand

const greeting = `Hello ${fullName}, I wish you a good ${timeOfDay}`;
Enter fullscreen mode Exit fullscreen mode

5. Assignment Operator

Longhand

a = a+b;
a = a-b;
Enter fullscreen mode Exit fullscreen mode

Shorthand

a += b;
a -= b;
Enter fullscreen mode Exit fullscreen mode

6. Object Array Notation

Longhand

let arr = new Array();
arr[0] = "html"
arr[1] = "css";
arr[2] = "js";
Enter fullscreen mode Exit fullscreen mode

Shorthand

let arr = ["html","css","js"];
Enter fullscreen mode Exit fullscreen mode

7. Arrow Function

Longhand

function addition(a,b){
    console.log("addition",a + b);
}
Enter fullscreen mode Exit fullscreen mode

Shorthand

addition = (a,b) => console.log("addition", a + b);
Enter fullscreen mode Exit fullscreen mode

8. Identical key and Values

Longhand

const userDetails = {
    name: name,     // key:value
    email: email,
    age: age,
    location: location,
};
Enter fullscreen mode Exit fullscreen mode

Shorthand

Top comments (0)