Using JavaScript Logic Inside EJS Templates

EJS allows us to write JavaScript code directly inside HTML using special tags. This makes it easy to iterate arrays, run loops, and apply conditions while rendering dynamic views.

In this tutorial, you will learn how to use forEach, for loop, while loop, and if-else statements inside EJS templates.

This example shows how to send an object from Express to EJS and iterate over an array using forEach().

 project-folder
  views
   home.ejs
  index.js
        

const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors());
app.set('view engine', 'ejs');

app.get('/', (req, res) => {
    let Employee = {
        name: 'Codings',
        surname: 'Points',
        year: 2025,
        hobbies: ['Reading', 'Dancing', 'Watching', 'Sleeping']
    }
    res.render('home', { emp: Employee });
});

app.listen(8080, () => {
    console.log("Server running at http://localhost:8080");
});

EJS allows us to use all JavaScript logical structures. Below is an example demonstrating for loop, while loop, and if-else inside EJS.

var express = require('express');
var app = express();

app.set('view engine', 'ejs');

app.get('/', (req, res) => {
    res.render('home');
});

app.listen(8080, () => {
    console.log("Server running at http://localhost:8080");
});

• 🔗 <%= %> is used to output dynamic data inside HTML.
• 🧠 <% %> is used for running JavaScript logic (loops, conditions, etc.).
• 🔁 The forEach() method is ideal for iterating arrays passed from Express.
• ⚙️ for and while loops work exactly as they do in JavaScript.
• 🚦 if-else helps in rendering dynamic UI based on conditions.
• 📄 All these logics run on the server when EJS creates the final HTML page.