Zusammenfassung der hochfrequenten Nutzung von ES6-String-Erweiterungen

ES6 fügt eine Traverser-Schnittstelle für Strings hinzu, sodass Strings von for...of-Schleifen durchlaufen werden können.

for (let codePoint of 'foo') {

  console.log(codePoint)}

// "f"// "o"// "o"

　

1.1 Beispiel: Durchqueren eines JSONDaten

 function lettest()

        {

              var jsongs = {

                    "result": [

                        { "YDFLAG": "1", "YXS": "0", "DPMC": "专属好评率", "MTYDL": "100", "SPFLMC": "蔬菜", "SPMC": "萝卜丝包", "YDRQ": "[2,1]", "PIC_ID": "12918", "SPDJ": "5", "YDBID": "12919", "NUM": "1", "SPJBXX_ID": "12913" },

                        { "YDFLAG": "2", "YXS": "0", "DPMC": "专属好评率", "MTYDL": "100", "SPFLMC": "蔬菜", "SPMC": "肉包", "YDRQ": "[5]", "PIC_ID": "12911", "SPDJ": "5", "YDBID": "12912", "NUM": "2", "SPJBXX_ID": "12907" },

                        { "YDFLAG": "3", "YXS": "0", "DPMC": "专属好评率", "MTYDL": "100", "SPFLMC": "蔬菜", "SPMC": "馒头", "YDRQ": "[4]", "PIC_ID": "12905", "SPDJ": "3", "YDBID": "12906", "NUM": "3", "SPJBXX_ID": "12900" },

                        { "YDFLAG": "4", "YXS": "0", "DPMC": "专属好评率", "MTYDL": "100", "SPFLMC": "蔬菜", "SPMC": "菜包", "YDRQ": "[2,3]", "PIC_ID": "12889", "SPDJ": "4", "YDBID": "12890", "NUM": "4", "SPJBXX_ID": "12884" }

                    ], "signToken": "/v1VqtzUE01JnOFJlHwnXu/IMKsjHL820hMdDHobFJPaE4R8D/VY3Q==", "allNum": "4"

                };

            for (var i of jsongs.result) {

              console.log(i.SPMC);

            }

        //商品名称：萝卜丝包,YDFLAG:1

// 商品名称：肉包,YDFLAG:2

// 商品名称：馒头,YDFLAG:3

// 商品名称：菜包,YDFLAG:4

　

}

Das obige Beispiel verwenden wir oft. Früher haben wir Schleifen wie for i++ verwendet, um Daten zu erhalten, aber jetzt können wir for of direkt verwenden Um die Arbeitsbelastung zu reduzieren und die Arbeitseffizienz zu verbessern

1.2>includes(), getsWith(), endWith( )

Traditionell verfügt JavaScript nur über die Methode indexOf, mit der ermittelt werden kann, ob eine Zeichenfolge in einer anderen Zeichenfolge enthalten ist. ES6 bietet drei neue Methoden.

• includes(): Gibt einen booleschen Wert zurück, der angibt, ob die Parameterzeichenfolge gefunden wurde.

• startsWith(): Gibt einen booleschen Wert zurück, der angibt, ob sich die Parameterzeichenfolge am Anfang der Quellzeichenfolge befindet.

• endsWith(): Gibt einen booleschen Wert zurück, der angibt, ob sich die Parameterzeichenfolge am Ende der Quellzeichenfolge befindet.

var s = 'Hello world!';

s.startsWith('Hello') // true

s.endsWith('!') // true

s.includes('o') // true

　

Diese drei Methoden unterstützen alle einen zweiten Parameter, der die Startposition der Suche angibt.

var s = 'Hello world!';

s.startsWith('world', 6) // true

s.endsWith('Hello', 5) // true

s.includes('Hello', 6) // false

Der obige Code gibt an, dass bei Verwendung des zweiten Parameters n endsWith verhält sich anders als die anderen beiden Methoden. Es zielt auf die ersten n Zeichen ab, während die anderen beiden Methoden von der nten Position bis zum Ende der Zeichenfolge zielen. 1.3.

padStart()

, padEnd() ES2017

strings Funktion eingeführt Vervollständigen Sie die Länge. Wenn eine Zeichenfolge nicht lang genug ist, wird sie am Anfang oder am Ende vervollständigt.

padStart() wird für die Kopfvervollständigung und padEnd() für die Schwanzvervollständigung verwendet.

'x'.padStart(5, 'ab') 

// 'ababx'

'x'.padStart(4, 'ab') // 'abax'

'x'.padEnd(5, 'ab') // 'xabab'

'x'.padEnd(4, 'ab') // 'xaba'

　

Eine häufige Verwendung von

padStart

besteht darin, die Anzahl der Ziffern für die numerische Vervollständigung anzugeben. Der folgende Code generiert eine numerische Zeichenfolge mit

10 Ziffern.

'1'.padStart(10, '0') 

// "0000000001"

'12'.padStart(10, '0') // "0000000012"

'123456'.padStart(10, '0') // "0000123456"

另一个用途

　

ist das Eingabeaufforderungszeichenfolgenformat.

'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"

'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"

　

1.4.

Vorlagenzeichenfolge

In In der traditionellen

JavaScript-Sprache wird die Ausgabevorlage normalerweise so geschrieben.

$('#result').append(

  &#39;There are <b>&#39; + basket.count + &#39;</b> &#39; +

  &#39;items in your basket, &#39; +

  &#39;<em>&#39; + basket.onSale +

  &#39;</em> are on sale!&#39;);

Die obige Schreibmethode ist ziemlich umständlich und unpraktisch.

ES6 führt Vorlagenzeichenfolgen ein, um dieses Problem zu lösen Problemfrage.

function resulttemplate()

        {

            var basket = { "supplies": [{ "name": "张三" }, { "name": "李四" }, { "name": "lili" }] }

            var mess = `<table>`;

            for (var i = 0; i < basket.supplies.length; i++)

            {

                mess += `<tr><td> 姓名</td>

                    <td> ${basket.supplies[i].name}</td></tr>`;

            }

            mess += `</table>`;

            $(&#39;#result&#39;).append(mess);

var ddd=`<table>`;

for(let j of basket.supplies)

{

     ddd+=`<tr><td>${j.name}</td></tr>`;

}

ddd+=`</table>`;

console.log(ddd);

        }

　

Vorlagenzeichenfolge (

Vorlagenzeichenfolge) ist eine erweiterte Version von Zeichenfolge, Verwenden Sie Backticks (`), um zu identifizieren. Es kann als gewöhnliche Zeichenfolge verwendet werden oder zum Definieren mehrzeiliger Zeichenfolgen oder zum Einbetten von Variablen in Zeichenfolgen.

Alle Leerzeichen und Zeilenumbrüche in der Vorlagenzeichenfolge bleiben erhalten. Wenn Sie diesen Zeilenumbruch nicht möchten, können Sie ihn mit der Methode

trim entfernen.

Das obige ist der detaillierte Inhalt vonZusammenfassung der hochfrequenten Nutzung von ES6-String-Erweiterungen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!