Unterstützt JavaScript Substitution/Interpolation?

Überblick

Ich arbeite an einem JS-Projekt, und je größer es wird, desto schwieriger wird es, die Saiten in gutem Zustand zu halten. Ich frage mich, was der einfachste und konventionellste Weg ist, Zeichenfolgen in JavaScript zu konstruieren oder zu erstellen.

Meine Erfahrung bisher:

Die Verkettung von Zeichenfolgen sieht hässlich aus und wird schwieriger zu warten, wenn das Projekt komplexer wird.

Das Wichtigste an diesem Punkt ist Prägnanz und Lesbarkeit, denken Sie an eine Reihe beweglicher Teile, nicht nur an 2-3 Variablen.

Es ist auch wichtig, dass es ab heute von den wichtigsten Browsern unterstützt wird (dh mindestens ES5 wird unterstützt).

Ich kenne die JS-Verkettungskurzschrift:

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

Und von der String.concat Funktion.

Ich suche etwas ordentlicheres.

Ruby und Swift tun dies auf interessante Weise.

Rubin

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

Schnell

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

Ich dachte, dass es so etwas in JavaScript geben könnte, vielleicht etwas Ähnliches sprintf.js.

Frage

Kann dies ohne Bibliothek von Drittanbietern durchgeführt werden? Wenn nicht, was kann ich verwenden?

Mit ES6 können Sie verwenden

• Vorlagenzeichenfolgen:

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

ES5 und darunter:

• benutze die + Operator

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

• Streicher concat(..)

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

Verwenden Sie alternativ Array-Methoden:

• join(..):

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

• Oder noch schicker, reduce(..) kombiniert mit einem der oben genannten:

  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
  

Ich bin enttäuscht, dass niemand in den anderen Antworten “bester Weg” als “schnellster Weg” interpretiert hat …

Ich zog die 2 Beispiele aus hier und hinzugefügt str.join() und str.reduce() aus der Antwort von Nishanths oben. Hier sind meine Ergebnisse zu Firefox 77.0.1 unter Linux.

Notiz: Ich habe beim Testen dieser festgestellt, dass wenn ich platziere str = str.concat() und str += direkt vor oder nacheinander, der zweite schneidet immer etwas besser ab… Also habe ich diese Tests einzeln durchlaufen lassen und die anderen für die Ergebnisse auskommentiert…

Sogar nochsie variierten weit in der Geschwindigkeit, wenn ich sie erneut durchlaufe, also habe ich jeweils 3 Mal gemessen.

1 Zeichen auf einmal:

• str = str.concat(): 841, 439, 956 ms / 1e7 concat()'s
• ............str +=: 949, 1130, 664 ms / 1e7 +='s
• .........[].join(): 3350, 2911, 3522 ms / 1e7 characters in []
• .......[].reduce(): 3954, 4228, 4547 ms / 1e7 characters in []

26 Zeichenkette auf einmal:

• str = str.concat(): 444, 744, 479 ms / 1e7 concat()'s
• ............str +=: 1037, 473, 875 ms / 1e7 +='s
• .........[].join(): 2693, 3394, 3457 ms / 1e7 strings in []
• .......[].reduce(): 2782, 2770, 4520 ms / 1e7 strings in []

Unabhängig davon, ob Sie jeweils 1 Zeichen oder eine Zeichenfolge von 26 gleichzeitig anhängen:

• Klarer Gewinner: im Grunde ein Unentschieden zwischen str = str.concat() und str +=
• Klarer Verlierer: [].reduce()gefolgt von [].join()

Mein Code, einfach in einer Browserkonsole auszuführen:

{
  console.clear();

  let concatMe="a";
  //let concatMe="abcdefghijklmnopqrstuvwxyz";

  //[].join()
  {
    s = performance.now();
    let str="", sArr = [];
    for (let i = 1e7; i > 0; --i) {
      sArr[i] = concatMe;
    }
    str = sArr.join('');
    e = performance.now();
    console.log(e - s);
    console.log('[].join(): ' + str);
  }

  //str +=
  {
    s = performance.now();
    let str="";
    for (let i = 1e7; i > 0; --i) {
      str += concatMe;
    }
    e = performance.now();
    console.log(e - s);
    console.log('str +=: ' + str);
  }

  //[].reduce()
  {
    s = performance.now();
    let str="", sArr = [];
    for (let i = 1e7; i > 0; --i) {
      sArr[i] = concatMe;
    }
    str = sArr.reduce(function(pre, next) {
      return pre + next;
    });
    e = performance.now();
    console.log(e - s);
    console.log('[].reduce(): ' + str);
  }

  //str = str.concat()
  {
    s = performance.now();
    let str="";
    for (let i = 1e7; i > 0; --i) {
      str = str.concat(concatMe);
    }
    e = performance.now();
    console.log(e - s);
    console.log('str = str.concat(): ' + str);
  }

  'Done';
}

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

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

Du könntest die verwenden concat Funktion.

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

Du könntest benutzen Kaffeescriptes wurde entwickelt, um den Javascript-Code prägnanter zu machen.. Für die Verkettung von Zeichenfolgen könnten Sie Folgendes tun:

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

Vielleicht kannst du anfangen hier um zu sehen, was von coffescript angeboten wird..

**Top 3 Practical Ways to Perform Javascript String Concatenation**

1) Using the concat() method

let list = ['JavaScript',' ', 'String',' ', 'Concatenation'];
let result="".concat(...list);

console.log(result);

Output:
JavaScript String Concatenation

2) Using the + and += operators

    enter code here

The operator + allows you to concatenate two strings. 
For example:
let lang = 'JavaScript';
let result = lang + ' String';


console.log(result);
Output: JavaScript String


3) Using template literals`enter code here`

ES6 introduces the template literals that allow you to perform string interpolation.
The following example shows how to concatenate three strings:

let navbarClass="navbar";
let primaryColor="primary-color";
let stickyClass="sticky-bar";

let className = `${navbarClass} ${primaryColor} ${stickyClass}`;

console.log(className);

Output: navbar primary-color stickyBar