JavaSkriptistringi vorming: NÄIDETEGA meetodid

Mis on JavaSkripti stringi vorming?

JavaSkripti stringi vorming viitab lähenemisviisidele, mida saab kasutada stringide manipuleerimiseks ja vormindamiseks määratletud kujul. See on iga programmeerimiskeele oluline funktsioon, mis võimaldab teil oma rakenduses kuvatava teksti üle kontrollida.

Oma JavaSkriptikood ja stringi vormindamine võivad keerukaid andmeid lihtsal viisil muuta. See parandab ka väljundi loetavust ja muudab koodi paremini hooldatavaks. Lisaks korralikult vormindatud JavaSkriptistringid võivad samuti mängida rolli rakenduse kasutuskogemuse parandamisel.

Kuidas stringe vormindada JavaSkript?

Stringi vormindamiseks JavaSkript, järgige esitatud samme:

Step 1) Esiteks tuleb määrata andmed, mida soovite stringi lisada.

Step 2) Seejärel valige meetod stringi vormindamiseks JS-is.

Step 3) Kirjutage selle rakendamise kood vastavalt.

Step 4) Testige koodi veendumaks, et see genereerib oodatud väljundi.

Step 5) Värskendage või muutke koodi, et see vastaks täiendavatele vormindamise vajadustele või nõuetele.

Step 6) Refaktoreerige kood hooldatavuse ja loetavuse tagamiseks.

Erinevad stringi vormindamise meetodid JavaScript

Stringide vormindamiseks on mitu võimalust JavaSkript, sealhulgas konkatenatsioonioperaatorid, malliliteraalid, regulaaravaldised ja palju muud.

Järgmises jaotises uurite järgmisi lähenemisviise.

  • {} Brackets seljapulkadega
  • "+" Operator
  • Kohandatud funktsioon Stringi vormindamine
  • Konkatenatsioonioperaator
  • Malli literaalid
  • Regulaaravaldis
  • Kohandatud funktsioon
  • Kolmepoolne operaator

1. meetod: {} kasutamine Brackets koos Backticks to Format String sisse JavaScript

Selle meetodi puhul saate kasutada šabloon literaalid lisades seljapulgad (`) stringi kaasamiseks. Seejärel sisestage stringi argumentide muutujad sulgudesse {}, millele eelnes dollarimärk "$". Need mallid võimaldavad teil manustada väljendeid stringliteraali.

See toiming aitab liita muutujaid, mida nimetatakse kohatäideteks, ja muid määratletud väärtusi. Selle tulemusena saadakse lõplik vormindatud string kohahoidjate väärtuste interpoleerimisel.

Näiteks oleme loonud kaks muutujat, "nimi"Ja"id” ja sulges need seejärel vormindatud väljundi genereerimiseks back-tick’idesse. Pange tähele, et "${}” süntaksit kasutatakse avaldiste manustamiseks stringiga.

kood:

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

Võib täheldada, et kuvatud on kohahoidja "name" ja "id" väärtused, mis tähendab, et stringide interpoleerimine on edukalt sooritatud.

Väljund:

Welcome Jenny, your ID is 1

2. meetod: + kasutamine Operator, et vormindada string sisse JavaScript

Teine lähenemisviis on kasutada Konkatenatsioonioperaator "+” põhivormingu stringide jaoks JavaSkript. See viis hõlmab üksikute muutujate ja stringide ühendamist soovitud väljundi genereerimiseks.

Näiteks oleme nüüd kasutanud samade muutujate väärtuste ühendamiseks operaatorit "+" ja meetod "console.log()" tagastab konsoolil vormindatud stringi.

kood:

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

Väljund:

Welcome Jenny, your ID is 1

3. meetod: kohandatud funktsiooni stringi vormindamine JavaScript

Oma JavaSkripti programm, saate kasutada ka kohandatud funktsioonistringi vormingu lähenemisviisi. Selle tehnika puhul aktsepteerib funktsioon soovitud muutujaid ja tagastab vormindatud stringi. See vormingufunktsioon pakub ka palju paindlikkust. Saate seda kasutada ka kohandatud või keerukate vormindusnõuete täitmiseks.

Siin oleme loonud kohandatud vormingu funktsiooni nimega "tervitussõnum()", mis aktsepteerib kahte muutujat"nimi"Ja"id” argumentidena ja väljastab vormindatud stringe, kasutades mallistringi literaale.

Pärast seda määratlesime soovitud muutujad ja edastasime need vormingus kohandatud moodustamise funktsiooni kutse.

kood:

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

Väljund:

Welcome Jenny, your ID is 1

4. meetod: ühendamise kasutamine stringi vormindamiseks JavaScript

Liitmine on lihtne meetod, mida kasutatakse stringide vormindamiseks JavaSkript. See lähenemisviis hõlmab stringimuutujate või mitme stringi kombineerimist, kasutades konkatenatsioonioperaatorit "+”. Seda tehnikat saate kasutada ka lihtsate stringide ühendamise ülesannete jaoks.

Esitatud näites on muutujad "eesnimi"Ja"perekonnanimi" ühendatakse operaatori "+" abil, et moodustada "täisnimi” stringi järgmiselt.

kood:

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

Väljund:

Alex Edward

5. meetod: malliliteraalide kasutamine stringi vormindamiseks JavaScript

Malli stringid mida tuntakse ka kui Malli literaalid pakuvad väljendusrikkamat ja täiustatud viisi stringide vormindamiseks JavaSkript. Need võimaldavad avaldiste otsest manustamist ja muutujad stringi sees, kasutades kohahoidjat "${expression}".

Lisaks pakub malliliteraal ka mitmerealistele stringidele tuge.

kood:

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

Ülaltoodud näites interpoleerisime muutuja "nimi"Ja"vanus" stringi sees, kasutades kohahoidjaid "${}” malliliteraalide tagumiste märkide (`) sees.

Väljund:

Hi, Alex! You are 30 years old.

6. meetod: regulaaravaldiste kasutamine stringi vormindamiseks JavaScript

In Javaskripti kood, Regulaaravaldised on tugev tööriist, mida kasutatakse stringidega manipuleerimiseks ja mustrite sobitamiseks. Lisaks kasutatakse neid ka antud mustri leidmiseks ja nende asendamiseks määratletud väärtustega. Seda toimingut saab teha "asenda ()”Meetod.

Vaadake allolevat programmi, asendusmeetodit () kasutatakse kahe regulaaravaldisega, mis asendavad kohahoidjad "[nimi]"Ja"[id]” vastava väärtusega.

kood:

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

Selle tulemuseks on uus stringobjekt, mis salvestatakse "sõnum” muutuja logitakse konsooli väljundina.

Väljund:

Welcome Jenny. Your ID is 1

7. meetod: kohandatud funktsiooni kasutamine stringi vormindamiseks JavaScript

Saate luua ka korduskasutatava ja kohandatud stringivormingu JavaSkript. Selleks määrake uus kohandatud funktsioon mis aktsepteerib stringi ja muid parameetreid. Saate seda kutsuda kohahoidjate asendamiseks või kohandatud vormingureeglite rakendamiseks. See meetod toetab ka kohandatud vormindamist keerukates vormindamisstsenaariumides.

Siin oleme loonud uue kohandatud funktsioonivormingu nimega "formString", mis aktsepteerib "nöör"Ja"parameetrid"(massiivi parameetritest) argumentidena.

Funktsiooni kehas oleme kutsunud esile "asenda ()" meetod regulaaravaldisega kohahoidjate asendamiseks "0 {}, 1 {}” koos nende vastavate väärtustega parameetrite massiivist.

kood:

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

Väljund:

Hi, Alex! You are 30 years old.

8. meetod: kolmekomponendi kasutamine Operator, et vormindada string sisse JavaScript

JavaScript Kolmepoolne operaator on lühendatud viis tingimusavaldiste kirjutamiseks stringidele. Kuid seda saab kasutada ka stringi vormindamiseks, valides tingimuslikult ühe kahest väärtusest vastavalt määratud tõeväärtusavaldisele ja tagastades stringi.

süntaksit:

condition ? expressionIfTrue : expressionIfFalse

Vaadake seda näidiskoodi, kuidas kasutada stringiobjektiks vormindamiseks kolmekomponentset operaatorit.

kood:

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

Väljund:

Welcome Jenny, you are an admin

Siin oleme määratlenud kaks muutujat "nimi"Ja"on Admin" väärtustega "Jenny"Ja"tõsi”, vastavalt.

Pärast seda kasutasime kolmepoolset operaatorit, et lisada tingimuslikult string ", olete administraator” sõnumistringi, kui valikulise parameetri „isAdmin” väärtus on tõene, nagu eespool öeldud.

Võrdlus JavaSkripti stringi vormingu meetodid

Siin oleme koondanud ülalpool käsitletud eelised ja puudused JavaSkriptistringi vormingu meetodid:

Meetod Eelised Puudused
Brackets {} tagumiste märkidega (`) • Lihtne kasutada.
• Lühike ja loetav kood.
See ei pruugi sobida keerukamate vormindusnõuete jaoks.
"+" operaator Lihtne arusaada. Keerulisemate vormindusnõuete puhul võib see olla ebaefektiivne.
Kohandatud funktsioon stringi vormindamiseks Pakub palju paindlikkust. Vajab rohkem kodeerimistööd.
Liitmine Operator Lihtne ja laialdaselt toetatud. Keerulise stringivormingu jaoks tülikas.
Malli literaalid • Toetab mitmerealisi stringe.
• Readable ja intuitiivne süntaks.
Piiratud kontroll vormindusvalikute üle.
Regulaaravaldised Pakkuge palju paindlikkust. Erinev rakendamine ja hooldus võrreldes teiste meetoditega.
Kohandatud funktsioon Pakub palju paindlikkust. Vajab kohandatud funktsiooni loomiseks ja hooldamiseks täiendavat kodeerimist.
Kolmepoolne operaator Lühike viis null- või määratlemata väärtuste käsitlemiseks. See ei pruugi sobida keerukamate vormindusnõuete jaoks.

Pange tähele, et meetodi valik sõltub suuresti konkreetsest kasutusjuhtumist ja teie asjakohastest nõuetest JavaSkripti kood.

Järeldus

In JavaScript, võite kasutada malliliteraale, kolmesõnalist operaatorit "+” operaator, regulaaravaldised ja kohandatud funktsioon stringide vormindamiseks. Need stringivormingu meetodid võimaldavad arendajatel tekstiandmeid tõhusalt manipuleerida ja esitada.

Seega valige loetavuse, jõudluse ja brauseri ühilduvuse põhjal õige meetod. See annab arendajatele võimaluse parandada kasutuskogemust ja saavutada soovitud vormindamisstandardid.

Võta see postitus kokku järgmiselt: