I need to assign a temperature for each day in month of 30 days-CodePudding

Imagine a month of 30 days and randomly assign a temperature for each of these days, including the temperature each day between 7 and 16°C. Here is my code:

let arrMonth = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21,
    22, 23, 24, 25, 26, 27, 28, 29, 30
]

let temperature = Math.floor(Math.random() * (16 - 7   1))   7;


for (let i = 0; i < arrMont.length;   i) {
    arrMonth[i] = temperature
    console.log(arrMonth[i])
}

It only gives me the temperature for the last day. What I am doing wrong?

on the console:

30: 11

CodePudding user response：

One simple extension of your code is to turn your variable into an arrow function, like

const temperature = () => (Math.floor(Math.random() * (16 - 7   1))   7);

Then each time you ask for 'temperature()' you'll get a new value.

let arrMonth = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30
]

const temperature = () => (Math.floor(Math.random() * (16 - 7   1))   7);


for (let i = 0; i < arrMonth.length;   i) {
    arrMonth[i] = temperature()
    console.log(arrMonth[i])
}

CodePudding user response：

What the OP asks for is actually a mapping task.

But since the OP also wants to render the well tempered dates/days, an approach which follows the separation of concerns (loosely said ... "each task a single function") should be taken into consideration.

Thus the OP could play around with the different tasks and e.g. adapt them to the OP's needs ...

function getRandomValueFromTemperatureRange() {
  // returns random values in between 7 and 16 inclusively.
  return (Math.floor(Math.random() * 10)   7);
}

function createTemperedDateItem(date) {
  return {
    date,
    temperature: getRandomValueFromTemperatureRange(),
  };
}
function renderTemperedDateItems(dateList) {
  const listRootNode = document.createElement('dl');

  dateList.forEach(dateItem => {
    const { date, temperature } = dateItem;

    const dateNode = document.createElement('dt');
    const temperatureNode = document.createElement('dd');

    dateNode.title = 'Date within Month';
    temperatureNode.title = 'Temperature in °C';

    dateNode.textContent = date;
    temperatureNode.textContent = temperature;

    listRootNode.appendChild(dateNode);
    listRootNode.appendChild(temperatureNode);
  });
  document.body.appendChild(listRootNode);
}

const arrMonth = Array.from(
  { length: 30},
  (elm, idx) => (idx   1)
);
console.log({
  arrMonth,
  temperedDateList: arrMonth.map(createTemperedDateItem),
});

renderTemperedDateItems(
  arrMonth.map(createTemperedDateItem)
);

dl { margin: 0!important; }
dl::after { clear: both; display: block; content: ''; }
dt { float: left; }
dd::after { display: inline; content: ' °C'; }

body { margin: 0 0 100px 0!important; }
.as-console-wrapper { max-height: 100px!important; }

CodePudding user response：

Thank you for that. I tried with the code and it shows me the same value. however, I tried with inserting the math random inside the for loop and that worked out

var arrMois = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21,
    22, 23, 24, 25, 26, 27, 28, 29, 30
]

let temperature

for (let i = 0; i < arrMois.length;   i) {
    temperature = Math.floor(Math.random() * (16 - 7   1))   7;
    arrMois[i] = temperature
    document.write(arrMois[i])
    document.write("<br>")
}