CODEWITHSUNDEEP
javascriptdateconstructorthis
Ivy Chen
Ivy Chen

Reputation: 35

Constructor returns undefined in JS

I am trying to get the current date to show up on HTML but it is showing up as undefined. The console does return the date in the right form though and there are no errors that popped up in the console. I'm not sure what I'm doing wrong.

// get date
var today = new Date();
var date = (today.getMonth()+1)+'-'+today.getDate()+'-'+today.getFullYear();
document.getElementsByClassName('date').innerHTML = date;
console.log(date);

// think there is something wrong with this constructor because right now the selected HTML element returns undefined 
class Note {
  constructor(title, body, date){
    this.title = title;
    this.body = body;
    this.date = date;
    this.id = Math.random();
  }
}

Here is the HTML

<h3 class = "date">${note.date}</h3>

Upvotes: 1

Views: 1290

Answers (2)

MK.
MK.

Reputation: 832

You should have something like this:

class Note {
    constructor(title, body, date){
        this.title = title;
        this.body = body;
        this.date = date;
        this.id = Math.random();
    }
}

const today = new Date();
const date = `${today.getMonth() + 1}-${today.getDate()}-${today.getFullYear()}`;
const note = new Note("Some Title", "Some Body", date);
document.querySelector("span").innerText = note.date;
<span></span>

Or something like this:

class Note {

    id = -1;

    constructor(title, body) {
        this.title = title;
        this.body = body;
        this.date = new Date().toDateString();
        this.id ++;
    }
}

const { title, body, date, id } = new Note("Some Title", "Some Body");
document.querySelector("div").innerHTML = `
    <h1>${title}</h1>
    <p>${body}</p>
    <small>${date}</small>
    <br />
    <b>ID: ${id}</b>
`;
<div></div>

Hopefully you can get the idea here

Upvotes: 1

Sanmeet
Sanmeet

Reputation: 1410

let note = new Note("title" , "body" , date);

console.log(note.date , note.body , note.title)

Upvotes: 0

Related Questions