JavaSkriptsträngsformat: Metoder med EXEMPEL

Vad är JavaSkriptsträngsformat?

JavaSkriptsträngsformat hänvisar till de metoder som kan användas för att manipulera och formatera strängar i en definierad form. Det är en avgörande egenskap hos alla programmeringsspråk som tillåter dig att ha kontroll över texten som visas i din ansökan.

I din JavaSkriptkod, strängformatering kan transformera komplexa data på ett enkelt sätt. Det förbättrar också utdataläsbarheten och gör koden mer underhållbar. Dessutom korrekt formaterad JavaSkriptsträngar kan också spela en roll för att förbättra användarupplevelsen av applikationen.

Hur man formaterar strängar i JavaManus?

För att formatera en sträng i JavaScript, följ de medföljande stegen:

Steg 1) Först måste du bestämma vilken data du vill inkludera i strängen.

Steg 2) Välj sedan en metod för att formatera sträng i JS.

Steg 3) Skriv koden för dess implementering i enlighet med detta.

Steg 4) Testa koden för att säkerställa att den genererar den förväntade utdata.

Steg 5) Uppdatera eller ändra koden för att möta ytterligare formateringsbehov eller krav.

Steg 6) Refaktorera koden för underhåll och läsbarhet.

Olika strängformateringsmetoder i JavaScript

Det finns flera sätt att formatera strängar i JavaSkript, inklusive sammanlänkningsoperatorer, bokstavsmallar, reguljära uttryck och mer.

I nästa avsnitt kommer du att utforska följande tillvägagångssätt:

  • {} Brackets med backticks
  • "+" Operator
  • Anpassad funktion Strängformatering
  • Sammankopplingsoperatör
  • Mallar bokstavliga
  • Vanligt uttryck
  • Anpassad funktion
  • Ternary operatör

Metod 1: Använd {} Brackets med backticks för att formatera sträng i JavaScript

I denna metod kan du använda mall bokstavliga genom att lägga till backar (`) för att omsluta en sträng. Infoga sedan variabler för strängargumenten inom parentes {} föregås av ett dollartecken "$". Dessa mallar gör att du kan bädda in uttryck i en bokstavlig sträng.

Denna operation hjälper till att sammanfoga variabler som kallas platshållare och andra definierade värden. Som ett resultat erhålls den slutliga formaterade strängen genom att interpolera värdena för platshållare.

Till exempel har vi skapat två variabler, "namn"Och"id” och omslöt dem sedan i backticks för att generera den formaterade utdata. Observera att "${}” syntax används för att bädda in uttrycken med strängen.

Koda:

const name = "Jenny";
const id = 1;
console.log (`Welcome ${name}, your ID is ${id}`);

Det kan observeras att värdena för platshållarens "namn" och "id" har visats, vilket betyder att stränginterpolation har utförts framgångsrikt.

Produktion:

Welcome Jenny, your ID is 1

Metod 2: Använd + Operator att formatera sträng i JavaScript

Det andra tillvägagångssättet är att använda Sammankopplingsoperatör "+” för grundläggande formateringssträngar i JavaManus. Det här sättet innebär att de enskilda variablerna och strängarna sammanfogas för att generera önskad utdata.

Till exempel har vi nu använt operatorn "+" för att sammanfoga samma variabelvärden, och metoden "console.log()" returnerar en formaterad sträng på konsolen.

Koda:

const name = "Jenny";
const id = 1;
console.log("Welcome " + name + ", your ID is " + id);

Produktion:

Welcome Jenny, your ID is 1

Metod 3: Anpassad funktion Strängformatering i JavaScript

I din JavaSkriptprogram, kan du också använda den anpassade strängformateringsmetoden. I den här tekniken accepterar funktionen de önskade variablerna och returnerar den formaterade strängen. Denna formatfunktion erbjuder också mycket flexibilitet. Du kan också använda den för att uppfylla anpassade eller komplexa formateringskrav.

Här har vi skapat en anpassad formatfunktion som heter "välkommenMsg()" som accepterar två variabler "namn"Och"id” som argument och matar ut formaterade strängar genom att använda mallsträngens bokstaver.

Efter det definierade vi de önskade variablerna och skickade dem i formatet anpassad formation funktionsanrop.

Koda:

function welcomeMsg(name, id) {
  return `Welcome ${name}, your ID is ${id}`;
}
const name = "Jenny";
const id = 1;
const msg = welcomeMsg(name, id);
console.log(msg);

Produktion:

Welcome Jenny, your ID is 1

Metod 4: Använd konkatenering för att formatera sträng i JavaScript

sammanlänkning är en enkel metod som används för att formatera strängar i JavaManus. Detta tillvägagångssätt innebär att kombinera strängvariabler eller flera strängar tillsammans med sammanlänkningsoperatorn "+”. Du kan också använda den här tekniken för enkla strängsammansättningsuppgifter.

I det angivna exemplet är variablerna "förnamn"Och"efternamn" kommer att sammanfogas med hjälp av "+"-operatorn för att bilda "fullständiga namn” sträng enligt följande.

Koda:

var firstName = "Alex";
var lastName = "Edward";
var fullName = firstName + " " + lastName;
console.log(fullName);

Produktion:

Alex Edward

Metod 5: Använd mallliterals för att formatera sträng i JavaScript

Mallsträngar som också kallas Mallar bokstavliga erbjuda ett mer uttrycksfullt och avancerat sätt att formatera strängar i JavaManus. De tillåter direkt inbäddning av uttryck och variabler inom strängen med platshållaren "${expression}".

Dessutom ger mall literal också stöd för flerradiga strängar.

Koda:

var name = "Alex";
var age = 30;
var msg = `Hi, ${name}! You are ${age} years old.`;
console.log(msg);

I exemplet ovan har vi direkt interpolerat variabeln "namn"Och"ålder" i strängen genom att använda platshållarna "${}” inom bakåtmarkeringarna (`) av mallbokstavarna.

Produktion:

Hi, Alex! You are 30 years old.

Metod 6: Använd reguljära uttryck för att formatera strängen JavaScript

In JavaSkriptkod, Vanliga uttryck är det robusta verktyget som används för strängmanipulation och mönstermatchning. Dessutom används de också för att hitta det givna mönstret och ersätta dem med definierade värden. Denna operation kan göras med hjälp av "byta ut ()”Metod.

Kolla in programmet nedan, metoden replace () används med två reguljära uttryck som kommer att ersätta platshållarna "[namn]"Och"[id]” med respektive värde.

Koda:

let name = "Jenny";
let id = 1;
let message = "Welcome [name], your ID is [id]".replace(/\[name\]/g, name).replace(/\[id\]/g, id);
console.log(message);

Detta resulterar i ett nytt strängobjekt som kommer att lagras i "meddelande” variabel loggas på konsolen som utdata.

Produktion:

Welcome Jenny. Your ID is 1

Metod 7: Använda en anpassad funktion för Format String in JavaScript

Du kan också skapa ett mer återanvändbart och anpassat strängformat i JavaManus. För att göra det, definiera en ny anpassad funktion som accepterar en sträng och andra parametrar. Du kan kalla det för att ersätta platshållare eller tillämpa anpassade formateringsregler. Den här tekniken stöder även anpassad formatering i komplexa formateringsscenarier.

Här har vi skapat ett nytt anpassat funktionsformat som heter "formatString" som accepterar en "sträng"Och"params"(array av parametrar) som argument.

Inom funktionskroppen har vi åberopat "byta ut ()" metod med ett reguljärt uttryck för att ersätta platshållare "0 {}, 1 {}” med sina respektive värden från parametermatrisen.

Koda:

function formatString(string, params) {
  return string.replace(/{(\d+)}/g, (match, index) => {
    return typeof params[index] !== 'undefined' ? params[index] : match;
  });
}
var name = "Alex";
var age = 30;
var formattedMsg = formatString("Hi, {0}! You are {1} years old.", [name, age]);
console.log(formattedMsg); 

Produktion:

Hi, Alex! You are 30 years old.

Metod 8: Använda Ternary Operator att formatera sträng i JavaScript

JavaScript Ternary operatör är ett stenografiskt sätt att skriva villkorliga uttryck på strängar. Det kan dock också användas för strängformatering genom att villkorligt välja ett av två värden enligt det angivna booleska uttrycket och returnera strängen.

Syntax:

condition ? expressionIfTrue : expressionIfFalse

Ta en titt på den här exempelkoden för att använda en ternär operator för att formatera till ett strängobjekt.

Koda:

let name = "Jenny";
let isAdmin = true;
let msg = `Welcome ${name}${isAdmin ? ", you are an admin" : ""}`;
console.log(msg);

Produktion:

Welcome Jenny, you are an admin

Här har vi definierat två variabler "namn"Och"är Admin" med värdena "Jenny"Och"sann”, respektive.

Efter det använde vi den ternära operatorn för att villkorligt lägga till strängen ", du är en administratör” till meddelandesträngen om värdet för den valfria parametern “isAdmin” är sant, som nämnts ovan.

Jämförelse av JavaMetoder för skriptsträngsformat

Här har vi tagit till oss fördelarna och nackdelarna med de ovan diskuterade JavaMetoder för skriptsträngsformat:

Metod Fördelar Nackdelar
Brackets {} med backticks (`) • Lätt att använda.
• Kortfattad och läsbar kod.
Det kanske inte är lämpligt för mer komplexa formateringskrav.
"+" operatör Lätt att förstå. Kan vara ineffektivt för mer komplexa formateringskrav.
Anpassad funktion för strängformatering Ger mycket flexibilitet. Behöver mer kodningsinsats.
sammanlänkning Operator Enkelt och brett stöd. Besvärligt för komplex strängformatering.
Malllitteratur • Stöder flerradiga strängar.
• Readable och intuitiv syntax.
Begränsad kontroll över formateringsalternativ.
Vanliga uttryck Ge mycket flexibilitet. Olika implementering och underhåll jämfört med andra metoder.
Anpassad funktion Ger mycket flexibilitet. Behöver ytterligare kodning för att skapa och underhålla en anpassad funktion.
Ternary operatör Kortfattat sätt att hantera noll- eller odefinierade värden. Det kanske inte är lämpligt för mer komplexa formateringskrav.

Observera att valet av metod i hög grad beror på det specifika användningsfallet och de relevanta kraven hos din JavaSkriptkod.

Slutsats

In JavaScript, kan du använda malllitterals, den ternära operatorn, "+”-operator, reguljära uttryck och den anpassade funktionen för att formatera strängar. Dessa strängformatmetoder tillåter utvecklare att manipulera och presentera textdata på ett effektivt sätt.

Välj därför rätt metod baserat på läsbarhet, prestanda och webbläsarkompatibilitet. Det ger utvecklare möjlighet att förbättra användarupplevelser och uppnå önskade formateringsstandarder.