# Преимущества и недостатки цепочек в JavaScript

Не смотря на то, что цепочки сокращают код, в большинстве случаев введение переменной все-таки удобнее. Сравните два примера - сейчас я ввел переменную `elem` и могу записывать любое количество атрибутов, при этом `querySelector` вызывается только один раз:

`let elem = document.querySelector('#elem'); elem.value = 'www'; elem.type = 'submit';`

А сейчас я не ввожу новую переменную и поэтому мне приходится вызывать `querySelector` два раза:

`document.querySelector('#elem').value = 'www'; document.querySelector('#elem').type = 'submit';`

На мой взгляд, этот код стал сложнее, хотя и занимает на одну строчку меньше. Кроме того, если я захочу сменить значение `id` с `'elem'` на какое-то другое, мне придется делать это во многих местах, что не очень удобно.

Есть и еще проблема - нагрузка на браузер. Поиск элементов по странице, который делает метод `querySelector`, является довольно медленной операцией (и вообще любая работа с элементами страницы - это медленная операция - запомните это).

В нашем случае, если мы каждый раз используем `querySelector`, то браузер каждый раз будет обрабатывать HTML страницу и искать элемент с заданным `id` несколько раз (не важно, что `id` одинаковые - браузер проделает все действия несколько раз), совершая бесполезные операции, которые могут замедлить работу браузера.

Если же мы используем переменную `elem` - никакого поиска по странице не происходит (элемент уже найден и ссылка на него лежит в переменной).

Дан следующий код:

`<img id="image" src="avatar.png" width="300" height="500">` `console.log(document.querySelector('#image').src); console.log(document.querySelector('#image').width); console.log(document.querySelector('#image').height);`

Укажите на недостатки данного кода. Исправьте их.

←→
↑
en ru