Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

217
Views
Javascript Constructor and appending the results into a table in HTML

I am relatively new to coding. I am attempting to push the results I get from a random generator function which will have calculated the results from the min and max numbers of customers manually inputted.

The issue I have run into is that, though I have made it so that the results gets pushed into the empty arrays. When I console log, the object created from the constructor. There is no data being being pushed.


const hour = ["6am","7am","8am","9am","10am","11am","12pm","1pm","2pm","3pm","4pm","5pm","6pm","7pm",];
//NOTE: Constructor
function Location(city,minmax, averageConversionRate_cookieValue) {
  this.name = city;
  this.customerRange = [minmax[0], minmax[1]];
  this.averageConversionRate_cookieValue = averageConversionRate_cookieValue;
  this.customerEachRange = [];
  this.cookiesSoldEachHour = [];
  this.totalDailyCookies = 0;
}

//NOTE: Prototype
Location.prototype = {
  constructor: Location,
  estimatedCustomer_perHour: function() {
    for (let a = 0; a < hour.length; a++) {
      this.customersEachHour.push(
        random(this.customerRange[0], this.customerRange[1])
      );
    }
  },
  cookiesPurchased_oneHour: function () {
    for (let a = 0; a < this.customersEachHour.length; a++) {
      this.cookiesSoldEachHour.push(
        Math.floor(
          this.customersEachHour[a] * this.averageConversionRate_cookieValue
        )
      );
    }
  },
  changeCusRange: function (min, max) {
    return (this.customerRange = [min, max]);
  },
  render() {
    this.estimatedCustomer_perHour();
    this.cookiesPurchased_oneHour();
    const unorderedList = document.getElementById("seattle");
    for (let a = 0; a < this.customersEachHour.length; a++) {
      const listTable = document.createElement("tr");
      listItem.textContent = `${hour[a]}: ${this.customersEachHour[a]} cookies`;
      unorderedList.appendChild(listItem);
      this.totalDailyCookies =
        this.totalDailyCookies + this.customersEachHour[a];
    }
    const listTable = document.createElement("tr");
    listTable.textContent = `Total: ${this.totalDailyCookies} cookies`;
    unorderedList.appendChild(listItem);
  },
}

//NOTE: Random fn()
function random(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}

//NOTE: Object creation
const seattle = new Location('Seattle', [23,65], 6.3);
const tokyo = new Location('tokyo',[3,24],1.2);
const dubai = new Location('dubai',[11,38],3.7);
const paris = new Location('paris',[20,38],2.3);
const lima = new Location('lima',[2,16],4.6)

console.log(seattle)
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I have spotted numerous problems with your code... listItem and this.customersEachHour are both undefined. You have hardcoded the value seattle as an id in render (which you never even call). You create a <tr> element for some reason but never use it. Also, you should simply wrap all of this into a class.

const hour = ["6am","7am","8am","9am","10am","11am","12pm","1pm","2pm","3pm","4pm","5pm","6pm","7pm"];

function random(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}

class Location {
  constructor(city, minmax, averageConversionRate_cookieValue) {
    this.name = city;
    this.list = document.getElementById(this.name);
    this.customerRange = [minmax[0], minmax[1]];
    this.averageConversionRate_cookieValue = averageConversionRate_cookieValue;
    this.customersEachHour = [];
    this.cookiesSoldEachHour = [];
    this.totalDailyCookies = 0;
    this.render();
  }
  
  estimatedCustomer_perHour() {
    for (let a = 0; a < hour.length; a++) {
      this.customersEachHour.push(
        random(this.customerRange[0], this.customerRange[1])
      );
    }
  }
  
  cookiesPurchased_oneHour() {
    for (let a = 0; a < this.customersEachHour.length; a++) {
      this.cookiesSoldEachHour.push(
        Math.floor(
          this.customersEachHour[a] * this.averageConversionRate_cookieValue
        )
      );
    }
  }
  
  changeCusRange(min, max) {
    return (this.customerRange = [min, max]);
  }
  
  render() {
    this.estimatedCustomer_perHour();
    this.cookiesPurchased_oneHour();
    for (let a = 0; a < this.customersEachHour.length; a++) {
      let item = document.createElement("li");
      item.textContent = `${hour[a]}: ${this.customersEachHour[a]} cookies`;
      this.list.append(item);
      this.totalDailyCookies = this.totalDailyCookies + this.customersEachHour[a];
    }
    let total = document.createElement("li");
    total.textContent = `Total: ${this.totalDailyCookies} cookies`;
    this.list.append(total);
  }
}

const seattle = new Location('Seattle', [23,65], 6.3);

console.log(seattle);
<ul id="Seattle"></ul>

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!