JavaSkriptstrengformat: Metoder med EKSEMPLER

by: James Hartman James Hartman
Hours oppdatert

Hva er JavaSkriptstrengformat?

JavaSkriptstrengformat refererer til tilnærmingene som kan brukes til å manipulere og formatere strenger i en definert form. Det er en avgjørende funksjon i ethvert programmeringsspråk som lar deg ha kontroll over teksten som vises i applikasjonen din.

I din JavaSkriptkode, strengformatering kan transformere komplekse data på en enkel måte. Det forbedrer også utdatalesbarheten og gjør koden mer vedlikeholdbar. I tillegg riktig formatert JavaSkriptstrenger kan også spille en rolle i å forbedre brukeropplevelsen av applikasjonen.

Hvordan formatere strenger i JavaManus?

For å formatere en streng i JavaSkript, følg de angitte trinnene:

Trinn 1) Først er det nødvendig å bestemme dataene du vil inkludere i strengen.

Trinn 2) Velg deretter en metode for å formatere streng i JS.

Trinn 3) Skriv koden for implementeringen deretter.

Trinn 4) Test koden for å være sikker på at den genererer forventet utgang.

Trinn 5) Oppdater eller modifiser koden for å møte de ekstra formateringsbehovene eller kravene.

Trinn 6) Refaktorer koden for vedlikehold og lesbarhet.

Ulike strengformateringsmetoder i JavaScript

Det finnes flere måter å formatere strenger på JavaSkript, inkludert sammenkoblingsoperatorer, bokstavmaler, regulære uttrykk og mer.

I neste avsnitt vil du utforske følgende tilnærminger:

  • {} Brackets med backticks
  • "+" Operator
  • Egendefinert funksjon Stringformatering
  • Sammenkoblingsoperatør
  • Maler bokstaver
  • Vanlig uttrykk
  • Egendefinert funksjon
  • Ternær operatør

Metode 1: Bruke {} Brackets med backticks for å formatere streng i JavaScript

I denne metoden kan du bruke mal bokstavelige ved å legge til backticks (`) for å omslutte en streng. Deretter setter du inn variabler for strengargumentene i parentes {} foran med et dollartegn "$". Disse malene lar deg legge inn uttrykk i en streng-literal.

Denne operasjonen hjelper til med å sette sammen variabler kalt plassholdere og andre definerte verdier. Resultatet er at den endelige formaterte strengen oppnås ved å interpolere verdiene til plassholdere.

For eksempel har vi laget to variabler, "navn"Og"id” og deretter omsluttet dem i backticks for å generere den formaterte utgangen. Merk at "${}” syntaks brukes for å bygge inn uttrykkene med strengen.

Kode:

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

Det kan observeres at verdiene til plassholderens "navn" og "id" har blitt vist, noe som betyr at strenginterpolering er utført vellykket.

Utgang:

Welcome Jenny, your ID is 1

RELATERTE ARTIKLER

Metode 2: Bruk + Operator til å formatere streng inn JavaScript

Den andre tilnærmingen er å bruke Sammenkoblingsoperatør "+" for grunnleggende formateringsstrenger i JavaManus. Denne måten innebærer å sette sammen de individuelle variablene og strengene for å generere ønsket utgang.

For eksempel har vi nå brukt "+"-operatoren for å sette sammen de samme variabelverdiene, og "console.log()"-metoden vil returnere en formatert streng på konsollen.

Kode:

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

Utgang:

Welcome Jenny, your ID is 1

Metode 3: Egendefinert funksjon Strengformatering i JavaScript

I din JavaSkriptprogram, kan du også bruke tilnærmingen til tilpasset funksjon strengformatering. I denne teknikken aksepterer funksjonen de ønskede variablene og returnerer den formaterte strengen. Denne formatfunksjonen tilbyr også mye fleksibilitet. Du kan også bruke den til å oppfylle tilpassede eller komplekse formateringskrav.

Her har vi laget en egendefinert formatfunksjon kalt "velkommenMsg()" som aksepterer to variabler "navn"Og"id" som argumenter og utganger formaterte strenger ved å bruke malstrengen bokstaver.

Etter det definerte vi de ønskede variablene og sendte dem i formatet tilpasset formasjonsfunksjonskall.

Kode:

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);

Utgang:

Welcome Jenny, your ID is 1

Metode 4: Bruke sammenkobling for formatstreng i JavaScript

sammenkjeding er en enkel metode som brukes for å formatere strenger i JavaManus. Denne tilnærmingen innebærer å kombinere strengvariabler eller flere strenger sammen ved å bruke sammenkoblingsoperatoren "+". Du kan også bruke denne teknikken for enkle strengsammenkoblingsoppgaver.

I det angitte eksemplet er variablene "fornavn"Og"etternavn" vil bli koblet sammen ved hjelp av "+"-operatoren for å danne "fullt navn" streng som følger.

Kode:

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

Utgang:

Alex Edward

Metode 5: Bruke malbokstaver for formatstreng i JavaScript

Malstrenger som også er kjent som Maler bokstaver tilby en mer uttrykksfull og avansert måte å formatere strenger på JavaManus. De tillater direkte innebygging av uttrykk og variabler i strengen ved å bruke plassholderen "${expression}".

Dessuten gir template literal også støtte til flerlinjestrengene.

Kode:

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

I eksemplet ovenfor har vi direkte interpolert variabelen "navn"Og"alder" i strengen ved å bruke plassholderne "${}” innenfor baksiden (`) av malens bokstaver.

Utgang:

Hi, Alex! You are 30 years old.

Metode 6: Bruke regulære uttrykk for å formatere strenger JavaScript

In JavaSkriptkode, Vanlig uttrykk er det robuste verktøyet som brukes for strengmanipulering og mønstertilpasning. Dessuten brukes de også for å finne det gitte mønsteret og erstatte dem med definerte verdier. Denne operasjonen kan gjøres ved hjelp av "erstatte ()”Metoden.

Sjekk ut programmet nedenfor, erstatte ()-metoden brukes med to regulære uttrykk som vil erstatte plassholderne "[Navn]"Og"[id]” med den respektive verdien.

Kode:

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);

Dette resulterer i et nytt strengobjekt som vil bli lagret i "meldingvariabel logget på konsollen som utdata.

Utgang:

Welcome Jenny. Your ID is 1

Metode 7: Bruke en egendefinert funksjon for Format String in JavaScript

Du kan også lage et mer gjenbrukbart og tilpasset strengformat i JavaManus. For å gjøre det, definer en ny tilpasset funksjon som godtar en streng og andre parametere. Du kan kalle det for å erstatte plassholdere eller bruke tilpassede formateringsregler. Denne teknikken støtter også tilpasset formatering i komplekse formateringsscenarier.

Her har vi laget et nytt tilpasset funksjonsformat kalt "formatString" som godtar en "string"Og"params"(matrise av parametere) som argumenter.

Innenfor funksjonskroppen har vi påkalt "erstatte ()" metode med et regulært uttrykk for å erstatte plassholdere "0 {}, 1 {}” med sine respektive verdier fra parametermatrisen.

Kode:

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);

Utgang:

Hi, Alex! You are 30 years old.

Metode 8: Bruk av ternær Operator til å formatere streng inn JavaScript

JavaScript Ternær operatør er en forkortelse for å skrive betingede uttrykk på strenger. Den kan imidlertid også brukes til strengformatering ved å betinget velge en av to verdier i henhold til det spesifiserte boolske uttrykket og returnere strengen.

Syntaks:

condition ? expressionIfTrue : expressionIfFalse

Ta en titt på denne eksempelkoden for bruk av en ternær operatør for å formatere til et strengobjekt.

Kode:

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

Utgang:

Welcome Jenny, you are an admin

Her har vi definert to variabler "navn"Og"er Admin" med verdiene "Jenny"Og"sant", henholdsvis.

Etter det brukte vi den ternære operatoren for å betinget legge til strengen ", du er administrator” til meldingsstrengen hvis verdien til den valgfrie parameteren “isAdmin” er sann, som angitt ovenfor.

Sammenligning av JavaSkriptstrengformatmetoder

Her har vi hentet inn fordelene og ulempene ved de ovenfor omtalte JavaSkriptstrengformatmetoder:

Metode Fordeler Ulemper
Brackets {} med backticks (`) • Lett å bruke.
• Konsis og lesbar kode. 		Det er kanskje ikke egnet for mer komplekse formateringskrav.
"+" operatør Enkelt å forstå. Kan være ineffektivt for mer komplekse formateringskrav.
Egendefinert funksjon for strengformatering Tilbyr mye fleksibilitet. Trenger mer kodeinnsats.
sammenkjeding Operator Enkelt og bredt støttet. Tungt for kompleks strengformatering.
Mallitteratur • Støtter flerlinjede strenger.
• Readable og intuitiv syntaks. 		Begrenset kontroll over formateringsalternativer.
Vanlig uttrykk Gi mye fleksibilitet. Ulik implementering og vedlikehold sammenlignet med andre metoder.
Egendefinert funksjon Gir mye fleksibilitet. Trenger ekstra koding for å lage og vedlikeholde en tilpasset funksjon.
Ternær operatør Konsis måte for håndtering av null eller udefinerte verdier. Det er kanskje ikke egnet for mer komplekse formateringskrav.

Merk at valget av metode i stor grad avhenger av den spesifikke brukssaken og de relevante kravene til din JavaSkriptkode.

Konklusjon

In JavaScript, kan du bruke bokstavmaler, den ternære operatoren, "+”-operator, regulære uttrykk og den egendefinerte funksjonen for å formatere strenger. Disse strengformatmetodene tillater utviklere å manipulere og presentere tekstdata på en effektiv måte.

Velg derfor riktig metode basert på lesbarhet, ytelse og nettleserkompatibilitet. Det gir utviklere mulighet til å forbedre brukeropplevelser og oppnå ønskede formateringsstandarder.