Сложение переменных в Javascript
Конкатенация – это процесс, подразумевающий соединения вещей между собой. Чаще всего конкатенация в JavaScript применяется для соединения значений переменных или строк со строками, чтобы образовались более длинные строки. Базовый оператор контактенации в JavaScript такой же как и оператор сложения, а именно — оператор +. Приведем несколько примеров:
Базовая конкатенация
| 1 2 | vartitle=»Wewish «+»tobefriends»; console.log(title); |
Результат в консоли:
| 1 | >We wish to be friends |
Важно! Обратите внимание на дополнительный пробел, который был добавлен к первой строке; во время конкатенации JavaScript не будет автоматически добавлять. Приведем альтернативный вариант:
| 1 2 3 4 | varwelcome=»Comesit»; vardirection=»bythehearth»; console.log(welcome+» «+direction); >Comesitbythehearth |
Конкатенация с помощью оператора присваивания
Часто мы заносим строку в переменную, после чего хотим добавить другую строку к уже существующей информации. Это можно сделать посредством оператора присваивания со сложением +=:
| 1 2 3 4 5 | varwelcome=»Good «; vartime=»evening»; welcome+=evening; console.log(welcome); >Goodevening |
В процессе выполнения операций значение переменной welcome будет изменено.
Различные приемы: concat
Метод concat тоже соединяет строки между собой:
| 1 2 3 4 | varoneDay=»Oneday I met «; varriddle=oneDay.concat(«a man «,»goingtoSt. Ives.»); console.log(riddle); >OnedayImetamangoingtoSt.Ives. |
Здесь тоже нужно вставлять дополнительные пробелы, чтобы они появились в конечном результате. Также вы можете применить метод .concat к пустой строке, добавляя к ней новые строки:
| 1 | varriddle=»».concat(«Themanhad «,»sevenwives»); |
По возможности следует избегать метода concat, поскольку он работает гораздо медленнее, чем операторы + или +=.
join
Метод join соединяет все элементы массива в строку. К примеру, у вас есть массив cats:
| 1 2 3 4 | varcats=[‘Artemis’,’Catbus’,’Duchess’,’Figaro’,’Kuroneko-sama’,’Scratchy’]; varjoinedNames=cats.join(); console.log(joinedNames); >»Artemis,Catbus,Duchess,Figaro,Kuroneko-sama,Scratchy» |
Метод .join автоматически использует в качестве разделителя запятую, с помощью которой в самом массиве разделяются элементы. Это поведение может быть изменено, используя любой разделитель, в том числе пробелы:
| 1 2 | varjoinedNames=cats.join(‘ ‘); >»ArtemisCatbusDuchessFigaroKuroneko-samaScratchy» |
И снова, метод .join работает намного медленнее, чем стандартный оператор +, и по возможности его стоит избегать.
Путаница с конкатенацией
Часто новички, пишущие код на JavaScript, допускают распространенную ошибку при конкатенации. Приведем пример:
| 1 2 3 | vara=10; varb=20; console.log(‘Totalis ‘+a+b); |
В качестве результата вы могли бы ожидать 30. Однако результат будет таким:
| 1 | >Totalis1020 |
Это объясняется тем, что JavaScript в первую очередь производит конкатенацию текста с переменной, а не сложение переменных.
Числа, соединенные со строкой, превращаются не в число, а в строку. Так происходит, потому что JavaScript выполняет код слева направо. То есть, если бы мы могли замедлить работу JavaScript интерпретатора, то мы бы увидели такой порядок выполнения операций:
| 1 2 | >Totalis10 >Totalis1020 |
Но можно определить, что должно выполнятся первым, заключив необходимые части выражения в круглые скобки.
| 1 | console.log(‘Totalis ‘+(a+b)); |
Теперь мы получим вот такой результат:
| 1 | >Totalis30 |
