Logo
Книга для начинающих
ВходРегистрация
/
Программирование
/
Курс JavaScript
/

Конкатенация

JavaScript: Конкатенация

Часто строки нужно собирать из нескольких частей, например объединить имя и фамилию, добавить единицу измерения или составить текст из шаблона. Для этого используется операция конкатенации, то есть склеивания строк.

Как объединять строки

В JavaScript строки объединяются с помощью оператора +. Несмотря на то, что этот оператор используется и для сложения чисел, в случае строк он означает объединение, то есть склеивание содержимого.

console.log('Dragon' + 'stone');
// => Dragonstone

Порядок имеет значение. Сначала идёт левая часть ('Dragon'), потом правая ('stone'). Результат получается в том порядке, в котором указаны операнды.

Вот как работает объединение нескольких строк:

'Hello' + ', ' + 'World!'
└──┬──┘   └┬┘   └──┬───┘
   └────┬───┘       │
  'Hello, '    +  'World!'
     └──────┬───────┘
      'Hello, World!'

Примеры.

console.log('Kings' + 'wood');       // => Kingswood
console.log('Kings' + 'road');       // => Kingsroad
// Здесь снаружи двойные кавычки, потому что внутри есть одиночная
console.log("King's" + 'Landing');   // => King'sLanding

JavaScript позволяет объединять строки, даже если они записаны в разных кавычках. Главное, чтобы обе части были строками.

Пробел тоже является символом

При объединении JavaScript не вставляет пробелы автоматически. Если между частями должен быть пробел, его нужно указать вручную.

// Пробел в конце первой строки
console.log("King's " + 'Landing');  // => King's Landing

// Пробел в начале второй строки
console.log("King's" + ' Landing');  // => King's Landing

Результат будет одинаковый. Но если пробел не добавить, то слова склеятся.

Управляющие последовательности

В строках можно использовать управляющие последовательности, например \n для переноса строки или \t для табуляции. При конкатенации они работают так же, как и любые другие символы.

console.log('Hello,' + '\n' + 'World!');
// Hello,
// World!

Точно так же можно использовать табуляцию \t для выравнивания вывода.

console.log('A' + '\t' + 'B'); // => A	B

Заключение

Конкатенация представляет собой объединение строк через +, и строки можно объединять независимо от типа кавычек.

  • Склеивание происходит строго в порядке слева направо.
  • Пробелы не добавляются автоматически, их нужно включать в строки вручную.

Задание

Сайт автоматически формирует ссылки на страницы репозиториев, собирая их из отдельных частей. Соберите ссылку с помощью конкатенации и выведите на экран:

https://github.com/hexlet/exercises-javascript

Каждый компонент URL — отдельная строка: протокол, домен, имя владельца, имя репозитория.

Коммерческий опыт и Трудоустройство

Полезное

  • Если в редакторе есть запись // BEGIN и // END, то код нужно писать между этими строчками.

Команда проекта находится в телеграм-сообществе. Там можно задать любой вопрос и повлиять на проект

Нашли ошибку? Есть что добавить? Пулреквесты приветствуются
/
Программирование
/
Курс JavaScript
/

Конкатенация

JavaScript: Конкатенация

Часто строки нужно собирать из нескольких частей, например объединить имя и фамилию, добавить единицу измерения или составить текст из шаблона. Для этого используется операция конкатенации, то есть склеивания строк.

Как объединять строки

В JavaScript строки объединяются с помощью оператора +. Несмотря на то, что этот оператор используется и для сложения чисел, в случае строк он означает объединение, то есть склеивание содержимого.

console.log('Dragon' + 'stone');
// => Dragonstone

Порядок имеет значение. Сначала идёт левая часть ('Dragon'), потом правая ('stone'). Результат получается в том порядке, в котором указаны операнды.

Вот как работает объединение нескольких строк:

'Hello' + ', ' + 'World!'
└──┬──┘   └┬┘   └──┬───┘
   └────┬───┘       │
  'Hello, '    +  'World!'
     └──────┬───────┘
      'Hello, World!'

Примеры.

console.log('Kings' + 'wood');       // => Kingswood
console.log('Kings' + 'road');       // => Kingsroad
// Здесь снаружи двойные кавычки, потому что внутри есть одиночная
console.log("King's" + 'Landing');   // => King'sLanding

JavaScript позволяет объединять строки, даже если они записаны в разных кавычках. Главное, чтобы обе части были строками.

Пробел тоже является символом

При объединении JavaScript не вставляет пробелы автоматически. Если между частями должен быть пробел, его нужно указать вручную.

// Пробел в конце первой строки
console.log("King's " + 'Landing');  // => King's Landing

// Пробел в начале второй строки
console.log("King's" + ' Landing');  // => King's Landing

Результат будет одинаковый. Но если пробел не добавить, то слова склеятся.

Управляющие последовательности

В строках можно использовать управляющие последовательности, например \n для переноса строки или \t для табуляции. При конкатенации они работают так же, как и любые другие символы.

console.log('Hello,' + '\n' + 'World!');
// Hello,
// World!

Точно так же можно использовать табуляцию \t для выравнивания вывода.

console.log('A' + '\t' + 'B'); // => A	B

Заключение

Конкатенация представляет собой объединение строк через +, и строки можно объединять независимо от типа кавычек.

  • Склеивание происходит строго в порядке слева направо.
  • Пробелы не добавляются автоматически, их нужно включать в строки вручную.

Задание

Сайт автоматически формирует ссылки на страницы репозиториев, собирая их из отдельных частей. Соберите ссылку с помощью конкатенации и выведите на экран:

https://github.com/hexlet/exercises-javascript

Каждый компонент URL — отдельная строка: протокол, домен, имя владельца, имя репозитория.

Коммерческий опыт и Трудоустройство

Полезное

  • Если в редакторе есть запись // BEGIN и // END, то код нужно писать между этими строчками.

Команда проекта находится в телеграм-сообществе. Там можно задать любой вопрос и повлиять на проект

Нашли ошибку? Есть что добавить? Пулреквесты приветствуются
← ПредыдущийСледующий →
← ПредыдущийСледующий →
← ПредыдущийСледующий →

Ваше упражнение проверяется по этим тестам

// @ts-check

import { expect, test, vi } from 'vitest';

test('string concatenation', async () => {
  const consoleLogSpy = vi.spyOn(console, 'log');
  await import('./index.js');

  const firstArg = consoleLogSpy.mock.calls.join('\n');

  expect(firstArg).toBe('https://github.com/hexlet/exercises-javascript');
});
← ПредыдущийСледующий →

Решение учителя откроется через:

20:00

waiting_clock
← ПредыдущийСледующий →