web-dev-qa-db-ja.com

JavaScriptで文字列の構築/連結を行う最良の方法は何ですか?

JavaScriptは置換/補間をサポートしていますか?

概要


私はJSプロジェクトに取り組んでおり、それが大きくなるにつれて、文字列を適切な状態に保つのがずっと難しくなっています。 JavaScriptで文字列を構築または構築する最も簡単で最も一般的な方法は何だろうと思っています。

これまでの私の経験:

文字列の連結は見栄えが悪くなり、プロジェクトが複雑になるにつれて維持が難しくなります。

この時点でこれが最も重要なのは、簡潔さと読みやすさです。2〜3個の変数だけでなく、一連の可動部分を考えてください。

また、今日の主要なブラウザでサポートされている(つまり、少なくともES5がサポートされている)ことも重要です。

私はJS連結の略記を知っています:

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

String.concat 関数の。

ちょっとすてきなものを探しています。

RubyとSwiftは興味深い方法でそれを行います。

ルビー

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

Swift

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

JavaScriptには sprintf.js に似た何かがあるかもしれないと思っていました。

質問


これは、サードパーティのライブラリなしで実行できますか?そうでない場合、何を使用できますか?

18
MrHaze

ES6では、次を使用できます

ES5以下:

  • _+_演算子を使用します

    _var username = 'craig';
    var joined = 'hello ' + username;
    _
  • 文字列の concat(..)

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

または、Arrayメソッドを使用します。

  • join(..)

    _var username = 'craig';
    var joined = ['hello', username].join(' ');
    _
  • または、より洗練された 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
    _
40
nishanths
var descriptor = 'awesome';
console.log(`ES6 is ${descriptor}!`);

詳細: https://developers.google.com/web/updates/2015/01/ES6-Template-Strings?hl=en

5
rrowland

replace()ここで言及するに値すると思います。

条件によっては、文字列を作成するときにreplaceメソッドが役立ちます。具体的には、明らかに、動的な部分を静的な文字列に挿入するとき。例:

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

置き換えるプレースホルダは、明らかに何でもかまいません。私は、C#の習慣から「{0}」、「{1}」などを使用しています。意図した場所以外の文字列で発生しないように、十分に一意である必要があります。

したがって、文字列部分を少しいじることができれば、OPの例も次のように解決できます。

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

「置換」のリファレンス: https://www.w3schools.com/jsreF/jsref_replace.asp

4
Culme

concat関数を使用できます。

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

Coffeescript を使用できます。これは、javascriptコードをより簡潔にするために作成されています。

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

here を起動して、coffescriptが提供するものを確認できます。

2
Bla...