JavaSkriptimerkkijonomuoto: menetelmät ESIMERKKEJÄ

by: James Hartman James Hartman
Hours Päivitetty

Mikä on JavaSkriptimerkkijonomuoto?

JavaScript String -muoto viittaa lähestymistapoihin, joita voidaan käyttää määritetyssä muodossa olevien merkkijonojen muokkaamiseen ja muotoiluun. Se on minkä tahansa ohjelmointikielen tärkeä ominaisuus, jonka avulla voit hallita sovelluksessasi näkyvää tekstiä.

Teidän JavaSkriptikoodi, merkkijonomuotoilu voi muuntaa monimutkaisia ​​tietoja yksinkertaisella tavalla. Se myös parantaa tulosteen luettavuutta ja tekee koodista helpommin ylläpidettävän. Lisäksi oikein muotoiltu JavaSkriptijonoilla voi myös olla rooli sovelluksen käyttökokemuksen parantamisessa.

Kuinka muotoilla merkkijonoja JavaKäsikirjoitus?

Merkkijonon muotoilemiseksi JavaScript, noudata annettuja ohjeita:

Vaihe 1) Ensin on määritettävä tiedot, jotka haluat sisällyttää merkkijonoon.

Vaihe 2) Valitse sitten menetelmä muotoilla merkkijono JS:ssä.

Vaihe 3) Kirjoita koodi sen toteuttamiselle vastaavasti.

Vaihe 4) Testaa koodia varmistaaksesi, että se tuottaa odotetun tulosteen.

Vaihe 5) Päivitä tai muokkaa koodia vastaamaan lisämuotoilutarpeita tai -vaatimuksia.

Vaihe 6) Refaktoroi koodi ylläpidettävyyttä ja luettavuutta varten.

Erilaisia ​​merkkijonomuotoilumenetelmiä JavaKäsikirjoitus

On olemassa useita tapoja muotoilla merkkijonoja JavaKomentosarja, mukaan lukien ketjutusoperaattorit, malliliteraalit, säännölliset lausekkeet ja paljon muuta.

Seuraavassa osiossa tutkit seuraavia lähestymistapoja:

  • {} Brackets selkäpuikoilla
  • "+" OperaTor
  • Mukautettu funktio merkkijonomuotoilu
  • Yhdistelmäoperaattori
  • Mallin literaalit
  • Tavallinen ilme
  • Mukautettu toiminto
  • Kolmikantainen operaattori

Tapa 1: Käytä {} Brackets jossa Backticks to Format String sisään JavaKäsikirjoitus

Tässä menetelmässä voit käyttää sapluuna kirjallisia lisäämällä selkäpuikot (`) merkkijonon sulkemiseen. Lisää sitten merkkijonoargumenttien muuttujat suluissa {}, joita edeltää dollarimerkki "$". Näiden mallien avulla voit upottaa lausekkeita merkkijonoliteraaliin.

Tämä toiminto auttaa ketjuttamaan muuttujia, joita kutsutaan paikkamerkit ja muut määritellyt arvot. Lopputuloksena lopullinen muotoiltu merkkijono saadaan interpoloimalla paikkamerkkien arvot.

Olemme esimerkiksi luoneet kaksi muuttujaa, "nimi"Ja"id” ja merkitsi ne sitten backticksille muotoillun tulosteen luomiseksi. Huomaa, että "${}” syntaksia käytetään lausekkeiden upottamiseen merkkijonon kanssa.

Koodi:

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

Voidaan havaita, että paikkamerkkien "name" ja "id" arvot on näytetty, mikä tarkoittaa, että merkkijonointerpolointi on suoritettu onnistuneesti.

lähtö:

Welcome Jenny, your ID is 1

AIHEESEEN LIITTYVÄT ARTIKKELIT

Tapa 2: Käytä + Operator muotoilla merkkijono sisään JavaKäsikirjoitus

Toinen tapa on käyttää Yhdistelmäoperaattori "+" perusmuotoilun merkkijonoille JavaKäsikirjoitus. Tämä tapa sisältää yksittäisten muuttujien ja merkkijonojen ketjuttamisen yhteen halutun tulosteen luomiseksi.

Olemme esimerkiksi nyt käyttäneet +-operaattoria samojen muuttujien arvojen ketjuttamiseen, ja menetelmä "console.log()" palauttaa muotoillun merkkijonon konsolissa.

Koodi:

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

lähtö:

Welcome Jenny, your ID is 1

Tapa 3: Mukautetun funktion merkkijonomuotoilu sisään JavaKäsikirjoitus

Teidän JavaKäsikirjoitusohjelma, voit myös käyttää mukautettua funktiomerkkijonomuotoilutapaa. Tässä tekniikassa funktio hyväksyy halutut muuttujat ja palauttaa muotoillun merkkijonon. Tämä muototoiminto tarjoaa myös paljon joustavuutta. Voit käyttää sitä myös mukautettujen tai monimutkaisten muotoiluvaatimusten täyttämiseen.

Täällä olemme luoneet mukautetun muotoisen toiminnon nimeltä "tervetuloa viesti()"joka hyväksyy kaksi muuttujaa"nimi"Ja"id" argumentteina ja tulostaa muotoiltuja merkkijonoja käyttämällä mallimerkkijonoliteraaaleja.

Tämän jälkeen määritimme halutut muuttujat ja välitimme ne muotoon mukautetun muodostuksen funktiokutsu.

Koodi:

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

lähtö:

Welcome Jenny, your ID is 1

Tapa 4: Konkatenoinnin käyttäminen muotoiluun JavaKäsikirjoitus

ketju on yksinkertainen menetelmä, jota käytetään merkkijonojen muotoiluun JavaKäsikirjoitus. Tämä lähestymistapa sisältää merkkijonomuuttujien tai useiden merkkijonojen yhdistämisen yhteen ketjutusoperaattorilla "+”. Voit käyttää tätä tekniikkaa myös yksinkertaisiin merkkijonojen yhdistämistehtäviin.

Esitetyssä esimerkissä muuttujat "etunimi"Ja"sukunimi" ketjutetaan "+"-operaattorin avulla muodostamaan "koko nimi”-merkkijono seuraavasti.

Koodi:

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

lähtö:

Alex Edward

Tapa 5: Malliliteraalien käyttäminen muotoilemaan merkkijonoa JavaKäsikirjoitus

Mallin merkkijonot jotka tunnetaan myös nimellä Mallin literaalit tarjoavat ilmeisemmän ja kehittyneemmän tavan muotoilla merkkijonoja JavaKäsikirjoitus. Ne mahdollistavat ilmaisujen suoran upottamisen ja muuttujat merkkijonon sisällä käyttämällä paikkamerkkiä "${expression}".

Lisäksi malliliteraali tukee myös monirivisiä merkkijonoja.

Koodi:

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

Yllä olevassa esimerkissä olemme interpoloineet muuttujan suoraannimi"Ja"ikä" merkkijonossa käyttämällä paikkamerkkejä "${}” mallin literaalien backticksissä (`).

lähtö:

Hi, Alex! You are 30 years old.

Tapa 6: Säännöllisten lausekkeiden käyttäminen merkkijonon muotoiluun JavaKäsikirjoitus

In JavaKäsikirjoituskoodi, Säännölliset lausekkeet ovat vankka työkalu merkkijonojen käsittelyyn ja kuvioiden sovittamiseen. Lisäksi niitä käytetään myös tietyn kuvion etsimiseen ja niiden korvaamiseen määritellyillä arvoilla. Tämä toimenpide voidaan tehdä "vaihda ()”Menetelmä.

Tutustu alla olevaan ohjelmaan, korvaa () -menetelmää käytetään kahdella säännöllisellä lausekkeella, jotka korvaavat paikkamerkit "[nimi]"Ja"[id]” vastaavalla arvolla.

Koodi:

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

Tämä johtaa uuteen merkkijonoobjektiin, joka tallennetaan "viesti”-muuttuja kirjataan konsoliin ulostulona.

lähtö:

Welcome Jenny. Your ID is 1

Tapa 7: Mukautetun toiminnon käyttäminen muotoile merkkijonoa varten JavaKäsikirjoitus

Voit myös luoda uudelleen käytettävän ja mukautetun merkkijonomuodon JavaKäsikirjoitus. Voit tehdä tämän määrittämällä uuden mukautettu toiminto joka hyväksyy merkkijonon ja muut parametrit. Voit kutsua sitä korvataksesi paikkamerkit tai soveltaaksesi mukautettuja muotoilusääntöjä. Tämä tekniikka tukee myös mukautettua muotoilua monimutkaisissa muotoiluskenaarioissa.

Täällä olemme luoneet uuden mukautetun funktiomuodon nimeltä "muotomerkkijono"joka hyväksyy"jono"Ja"params"(ryhmä parametrien) argumentteina.

Toimintorungossa olemme käyttäneet "korvaa ()" menetelmä säännöllisellä lausekkeella paikkamerkkien korvaamiseksi "0 {}, 1 {}" ja niiden arvot parametritaulukosta.

Koodi:

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

lähtö:

Hi, Alex! You are 30 years old.

Tapa 8: Kolminkertaisen menetelmän käyttö Operator muotoilla merkkijono sisään JavaKäsikirjoitus

JavaKäsikirjoitus Kolmikantainen operaattori on lyhyt tapa kirjoittaa ehdollisia lausekkeita merkkijonoihin. Sitä voidaan kuitenkin käyttää myös merkkijonojen muotoiluun valitsemalla ehdollisesti toinen kahdesta arvosta määritetyn loogisen lausekkeen mukaisesti ja palauttamalla merkkijono.

Syntaksi:

condition ? expressionIfTrue : expressionIfFalse

Katso tämä esimerkkikoodi kolmiosaisen operaattorin käyttämisestä merkkijonoobjektin muotoilemiseen.

Koodi:

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

lähtö:

Welcome Jenny, you are an admin

Tässä olemme määrittäneet kaksi muuttujaa "nimi"Ja"on Admin"arvoilla"Jenny"Ja"totta”, vastaavasti.

Sen jälkeen käytimme kolmiosaista operaattoria lisätäksemme ehdollisesti merkkijonon ", olet järjestelmänvalvoja" sanomamerkkijonoon, jos valinnaisen parametrin "isAdmin" arvo on tosi, kuten yllä todettiin.

Vertailu JavaScript String Format Methods

Tässä olemme ottaneet huomioon edellä käsiteltyjen edut ja haitat JavaSkriptijonomuotoilumenetelmät:

Menetelmä edut Haitat
Brackets {} takapuikoilla (`) • Helppokäyttöinen.
• Lyhyt ja luettava koodi. 		Se ei ehkä sovellu monimutkaisempiin muotoiluvaatimuksiin.
"+" -operaattori Helppo ymmärtää. Voi olla tehoton monimutkaisemmissa muotoiluvaatimuksissa.
Mukautettu toiminto merkkijonomuotoilulle Tarjoaa paljon joustavuutta. Tarvitsee lisää koodausta.
ketju OperaTor Yksinkertainen ja laajasti tuettu. Hankala monimutkaiselle merkkijonomuotoilulle.
Mallin kirjaimet • Tukee monirivisiä merkkijonoja.
• Readable ja intuitiivinen syntaksi. 		Rajoitettu muotoiluvaihtoehtojen hallinta.
Säännölliset lausekkeet Tarjoa paljon joustavuutta. Erilainen käyttöönotto ja ylläpito muihin menetelmiin verrattuna.
Mukautettu toiminto Tarjoaa paljon joustavuutta. Tarvitsee lisäkoodausta mukautetun toiminnon luomiseen ja ylläpitämiseen.
Kolmikantainen operaattori Tiivis tapa käsitellä nolla- tai määrittelemättömiä arvoja. Se ei ehkä sovellu monimutkaisempiin muotoiluvaatimuksiin.

Huomaa, että menetelmän valinta riippuu suuresti käyttötapauksestasi ja vaatimuksistasi JavaKäsikirjoituskoodi.

Yhteenveto

In JavaKäsikirjoitus, voit käyttää malliliteraaleja, kolmiosaista operaattoria, "+”-operaattori, säännölliset lausekkeet ja mukautettu funktio merkkijonojen muotoiluun. Näiden merkkijonomuotojen avulla kehittäjät voivat käsitellä ja esittää tekstidataa tehokkaasti.

Valitse siis oikea menetelmä luettavuuden, suorituskyvyn ja selaimen yhteensopivuuden perusteella. Se antaa kehittäjille mahdollisuuden parantaa käyttökokemuksia ja saavuttaa halutut muotoilustandardit.

Tiivistä tämä viesti seuraavasti: