Насколько корректно писать код в подобном стиле?

Question

[Михаил Р.]

Приветствую!

Пару дней назад изучал js код и заметил написание кода в подобном стиле:

let element = document.querySelector('selector').innerHTML = 'modified text';

В большинстве остальных случаев, встречал подобного рода стиль написания кода:

let element = document.querySelector('selector');
element.innerHTML = 'modified text';

Вопрос: насколько "профессионально" писать код в подобном стиле?
Спасибо!

Comments

[RAX7]

В первом случае в element будет строка 'modified text', во втором HTMLElement. Это не равнозначные варианты.

Answer 1

[Владимир Проскурин]

Плохо писать текст в элемент через innerHTML.
Второй вариант короче (на одну строку), и подходит тогда, когда потом нужно снова использовать element. Мне кажется, он предпочтительнее.
UPD: ой, я и не заметил (читая вопрос через смартфон), что в первом коде используется два раза равенство. Такой код работать будет, но он не явный, а неявные штуки - зло. Новичков он может поставить в ступор, т.к. не сразу ясно, что будет содержаться в переменной. И этот код также похож на опечатку, типа вероятно нужно было использовать сравнение (в данном случае, по названию переменной все понятно, но все же).

Comments

[Михаил Р.]

Владимир Проскурин

Плохо писать текст в элемент через innerHTML.

Лучше использовать textContent?

[kova1ev]

Владимир Проскурин, а первый вариант вообще работающий? просто никогда не слышал, чтобы в js можно было так выполнять присваивание let perem = <какой-то объект> = <еще что-нибудь>;

[Владимир Проскурин]

kova1ev, будет. Присваивание будет происходить справа на лево.
Легко проверить

let obj = {
   set a(val) { console.warn('set a:', val) },
   set b(val) { console.warn('set b:', val) }
}
obj.a = obj.b = 10;

выведет
set b: 10
set a: 10
т.е. сначала obj.b = 10, потом obj.a = obj.b

[kova1ev]

Владимир Проскурин, да, действительно работает. Просто помню что то подобное пытался писать и мне выпадала ошибка, что-то вроде invalid left-side assignment, не помню точно

Answer 2

[Анатолий]

А если перед innerHTML вам что-то нужно сделать с "девственным" объектом?
Второй вариант лучше и читабельнее.
Не мешайте объявление переменной и работу с ней.