Feedback on Silly story generator?

MDN Learn
#1

If anyone has any feedback for me, I would appreciate it - esp with regards to how i handled the "name" variable. Thanks!

var customName = document.getElementById('customname');
var randomize = document.querySelector('.randomize');
var story = document.querySelector('.story');

function randomValueFromArray(array){
  return array[Math.floor(Math.random()*array.length)];
}

var storyText =
"It was 94 farenheit outside, so " + insertX +
" went for a walk. When they got to " + insertY +
", they stared in horror for a few moments, then " + insertZ +  ". " +
name + " saw the whole thing, but was not surprised — " + insertX +
" weighs 300 pounds, and it was a hot day.";

 var name = "Bob";

 var insertX = ["Willy the Goblin","Big Daddy","Father Christmas"];

 var insertY = ["the soup kitchen","Disneyland","the White House"];

 var insertZ = ["spontaneously combusted", "melted into a puddle on the sidewalk", "turned into a slug and crawled away"];


 randomize.addEventListener('click', result);

function result() {

  var newStory = storyText;


  if(customName.value != '') {
    var newName = customName.value;
    var newStory = newStory.replace(name, newName);
  }


  var xItem = randomValueFromArray(insertX);
  var yItem = randomValueFromArray(insertY);
  var zItem = randomValueFromArray(insertZ);


  var newStory = newStory.replace(undefined, xItem);
  var newStory = newStory.replace(undefined, yItem);
  var newStory = newStory.replace(undefined, zItem);
  var newStory = newStory.replace(undefined, xItem);


  if(document.getElementById("uk").checked) {
    var weight = Math.round(300 * 0.0714286) + " stone";
    var temperature =  Math.round((94-32)*0.5556 ) + " centigrade";
    var newStory = newStory.replace("94 farenheit", temperature);
    var newStory = newStory.replace("300 pounds", weight);
  }

  story.textContent = newStory;
  story.style.visibility = 'visible';
}
#2

Hi there @sabbyiqbal — thanks for sending us a message!

Your code works, and does what is expected; well done!

I’ve got a few bits of feedback:

  1. != '' — for comparison, you should always use stricy equality/inequality operators, i.e. !== and ===, not != and ==. Strict equality check that the value AND the datatype is the same, whereas non-strict checks only the value, possibly leading to some tricky bugs if you’re not careful. There is no reason not to use the strict versions.

  2. Inside the result() function, you redeclare the newStory variable every time you use it, i.e. you put var at the start of each instance. You only need to use var when you define it, i.e. the first instance, and that creates the variable ready for use further down the code. If you redeclare a variable every time you use it, it can lead to errors.

I think that was about it. You can check your code against our version here: https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/assessment-finished/main.js

Let me know if you have any further questions.