DEV Community

Cover image for 6 Useful JavaScript Tips for Beginners
Hardik Gohil
Hardik Gohil

Posted on

2

6 Useful JavaScript Tips for Beginners

Hey Guys, Hope you all are doing well. Here are some of the useful tips that can improve productivity and overall performance of JavaScript code. These tips are for beginner and intermediate programmers as well. So without further ado let's jump in!

Ternary Operator

// Don't Do this
let port;
if(process.env.PORT) {
    port = process.env.PORT;
} else {
    port = 8080;
}

// Do This
const port = process.env.PORT || 8080;
Enter fullscreen mode Exit fullscreen mode

Template Literals

// Don't Do this
const greeting = 'Welcome Back ' + firstName + ' ' + lastName;
const successMessage = 'Your Product ' + productName + ' has been delivered on ' + orderDate + ' successfully!';

// Do This
const greeting = `Welcome Back ${firstName} ${lastName}`;
const successMessage = `Your Product ${productName} has been delivered on ${orderDate} successfully!`;
Enter fullscreen mode Exit fullscreen mode

Check if the value is undefined or null - Nullish coalescing

// Don't Do This
const userInfo = {};
let userName = '';

if(user.name === undefined || user.name === null) {
    userName = 'User not found!';
} else {
    userName = user.name;
}

// Do This
const userInfo = {};
let userName = user.name ?? 'User not found!';
Enter fullscreen mode Exit fullscreen mode

Read more about Nullish Coalescing Operator from Official Docs.

Converting string to number

// Don't Do This
const age = parseInt('22');
const qauntity = parseFloat('11.02');

// Do This
const age = +'22';
const qauntity  = +'11.02';
Enter fullscreen mode Exit fullscreen mode

Array/Object Destructuring

// Given
const project = {
    name: 'Dribble Shot Design',
    reporter: 'John Doe',
    dueDate: '2023-03-05',
    status: 'pending'
};

// Don't Do This
const projectName = project.name;
const projectReporter = project.reporter;
const projectDueDate = project.dueDate;
const projectStatus = project.status;

// Do This
const { name, reporter, dueDate, status } = project;
Enter fullscreen mode Exit fullscreen mode

Implicit Boolean Coercion

// Don't Do This
const orderInfo = {} ;
let isOrderInfoAvailable;

if(Object.keys(orderInfo).length) {
    isOrderInfoAvailable = true;
} else {
    isOrderInfoAvailable = false;
}

// Do This
const orderInfo = {};
const isOrderInfoAvailable = !!orderInfo;
console.log(isOrderInfoAvailable); // true
Enter fullscreen mode Exit fullscreen mode

Thanks for reading, If you liked the post please share it and leave suggestions.

Connect With Me

Website: Hardik Gohil

Github: https://github.com/HardikGohilHLR

Linkedin: https://www.linkedin.com/in/hardikgohilhlr

Thanks ❤️

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read full post →

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more