Возвращая объекты в JavaScript по-разному, один работает, другой нет

Question

Код ниже работает

return {
  getinput:function(){
    return{
      type:document.querySelector(domStrings.inputType).value,
      description:document.querySelector(domStrings.inputDescription).value,
      value:document.querySelector(domStrings.inputValue).value
    };
  }
}

, а код ниже

var klop={
  type:document.querySelector(domStrings.inputType).value,
  description:document.querySelector(domStrings.inputDescription).value,
  value:document.querySelector(domStrings.inputValue).value
};

return {
  getinput:function(){
    return klop;
  }
}

Answer 1

Рабочая версия:

return {
  getinput:function(){
    return{
      type:document.querySelector(domStrings.inputType).value,
      description:document.querySelector(domStrings.inputDescription).value,
      value:document.querySelector(domStrings.inputValue).value
    };
  }
}

Каждый раз, когда вы вызываете функцию getinput(), она получает все значения и создает новый объект, содержащий их, поэтому вы получаете текущие значения входных данных.

Не работающая версия:

var klop={
  type:document.querySelector(domStrings.inputType).value,
  description:document.querySelector(domStrings.inputDescription).value,
  value:document.querySelector(domStrings.inputValue).value
};

return {
  getinput:function(){
    return klop;
  }
}

Получает значения входных данных только один раз, когда вы создаете объект с функцией, частью которой он является. Каждый раз, когда вы вызываете getinput(), он возвращает один и тот же klop объект, он не получает текущие значения входных данных.