Какой лучший способ выполнить построение строк/конкатенацию в JavaScript?

Поддерживает ли JavaScript подстановку/интерполяцию?

Обзор

Я работаю над проектом JS, и по мере того, как он становится больше, поддерживать форму в хорошем состоянии становится все сложнее. Мне интересно, какой самый простой и обычный способ создания или построения строк в JavaScript.

Мой опыт до сих пор:

Конкатенация строк начинает выглядеть уродливо и становится все труднее поддерживать по мере усложнения проекта.

На данный момент самое важное - это краткость и удобочитаемость, например, множество движущихся частей, а не только 2-3 переменных.

Также важно, чтобы он поддерживался основными браузерами на сегодняшний день (то есть, по крайней мере, поддерживается ES5).

Мне известно о сокращении конкатенации JS:

var x = 'Hello';
var y = 'world';
console.log(x + ', ' + y);

И функции String.concat.

Я ищу что-то более аккуратное.

Руби и Свифт делают это интересным образом.

Рубин

var x = 'Hello'
var y = 'world'
print "#{x}, #{y}"

Swift

var x = "Hello"
var y = "world"
println("\(x), \(y)")

Я думал, что в JavaScript может быть что-то подобное, возможно, что-то похожее на sprintf.js.

Вопрос

Можно ли это сделать без какой-либо сторонней библиотеки? Если нет, что я могу использовать?

Ответы

Ответ 1

С ES6 вы можете использовать

Шаблоны строк:

var username = 'craig';
console.log(`hello ${username}`);

ES5 и ниже:

используйте оператор +

var username = 'craig';
var joined = 'hello ' + username;

String concat(..)

var username = 'craig';
var joined = 'hello '.concat(username);

В качестве альтернативы используйте методы Array:

join(..):

var username = 'craig';
var joined = ['hello', username].join(' ');

Или даже fancier, reduce(..) в сочетании с любым из перечисленных выше:

var a = ['hello', 'world', 'and', 'the', 'milky', 'way'];
var b = a.reduce(function(pre, next) {
  return pre + ' ' + next;
});
console.log(b); // hello world and the milky way

Ответ 2

var descriptor = 'awesome';
console.log('ES6 is ${descriptor}!');

Подробнее: https://developers.google.com/web/updates/2015/01/ES6-Template-Strings?hl=en

Ответ 3

Я думаю, что replace() заслуживает упоминания здесь.

В некоторых условиях метод замены может хорошо служить вам при построении строк. В частности, очевидно, когда вы вставляете динамическую часть в статическую строку иначе. Пример:

var s = 'I am {0} today!';
var result = s.replace('{0}', 'hungry');
// result: 'I am hungry today!'

Заместителем, который заменить, может быть, очевидно, что угодно. Я использую "{0}", "{1}" и т.д. По привычке из С#. Он просто должен быть достаточно уникальным, чтобы не встречаться в строке, отличной от предполагаемой.

Итак, если мы немного поиграем со строковыми частями, пример OPs можно решить так же:

var x = 'Hello {0}';
var y = 'World';
var result = x.replace('{0}', y);
// result: 'Hello World'. -Oh the magic of computing!

Ссылка для "replace": https://www.w3schools.com/jsreF/jsref_replace.asp

Ответ 4

Вы можете использовать функцию concat.

var hello = "Hello ";
var world = "world!";
var res = hello.concat(world);

Ответ 5

Вы можете использовать Coffeescript, чтобы сделать код javascript более кратким. Для конкатенации строк вы можете сделать что-то вроде этого:

first_name = "Marty"
full_name = "#{first_name} McFly"
console.log full_name

Возможно, вы можете начать здесь, чтобы узнать, что предлагает coffescript..