Почему нас учат назначать document.getElementById("id") переменной, а затем использовать эту переменную со свойством?
Почему учебники учат нас получать свойство элемента в двух утверждениях, таких как это:
var sample = document.getElementById("sample");
var mySample = sample.value;
Вместо того, чтобы делать все это в одном утверждении, как это?
var mySample = document.getElementById("sample").value;
Я понимаю, что если бы вам нужно было получить доступ к нескольким различным свойствам одного и того же элемента, это привело бы к уменьшению кода и облегчило бы его чтение, но почему люди делают это, даже если к нему обращаются только к одному свойству?
2 ответа
Учебники делают это, потому что они (обычно) пытаются преподавать общий случай перед частным случаем; гораздо чаще случается так, что вам нужно получить доступ к нескольким свойствам, а не к одному свойству, и гораздо лучше усвоить общее правило (где наихудшее, что может случиться, это избыточная строка кода), чем исключение (где проблема не столько кода или читабельности, сколько большого количества ненужных вызовов функций (хотя с современными браузерами вы всегда можете надеяться, что они оптимизированы внутри).
Если вы выучили общее правило, вы всегда можете делать исключения для простых случаев (и если вы ничего не делаете, ничего плохого не происходит).
То, о чем вы действительно должны спросить, так это то, почему в этом веке современных браузеров учебные пособия учат getElementById при широкой поддержке document.queryselector.
Это зависит от того, сколько раз / свойств вам нужно манипулировать этим объектом. Вы правы - если вы просто получаете / устанавливаете значение, тогда обязательно используйте ваш второй пример. Зачастую необходимо манипулировать несколькими свойствами, поэтому установка локальной переменной немного улучшает производительность, а также помогает DRY - вам не нужно повторять текст идентификатора.