Hur formaterar du en sträng i JavaScript?

Hur formaterar du en sträng i JavaScript?

I JavaScript är en sträng en grupp tecken som omges av antingen ett par enkla eller dubbla citattecken. Det finns många sätt att formatera strängar i JavaScript.





överföra textra -meddelanden till en ny telefon

Du kan använda specifika metoder eller operatorer för att kombinera strängar. Du kan till och med utföra specifika operationer för att bestämma vilken sträng som ska visas var och när.





MAKEUSE AV DAGENS VIDEO

Lär dig hur du formaterar dina JavaScript-strängar med hjälp av sammanlänkningsmetoder och mallbokstavar.





Strängsammansättning

JavaScript låter dig sammanfoga strängar med flera metoder. Ett användbart tillvägagångssätt är concat() metod. Denna metod använder två eller flera strängar. Den använder en enda anropssträng och tar en eller flera strängar som argument.

const firstName = "John"; 
const lastName = "Doe";

let stringVal;

stringVal = firstName.concat(" ", lastName);
console.log(stringVal);

Här sammanfogar concat strängargumenten (ett blanksteg och efternamn) till den anropande strängen (förnamn). Koden lagrar sedan den resulterande nya strängen i en variabel (stringVal) och skriver ut det nya värdet till webbläsarkonsolen :



  Använder concat-metoden

Ett annat sätt att sammanfoga en samling strängar är att använda plusoperatorn. Den här metoden låter dig kombinera strängvariabler och strängliteraler för att skapa nya strängar.

const firstName = "John"; 
const middleName = "Mike";
const lastName = "Doe";

let stringVal;

stringVal = firstName + " " + middleName + " " + lastName;
console.log(stringVal);

Koden ovan skriver ut följande utdata till konsolen:





  Plus operatörssträngsammansättning

En tredje metod för att sammanfoga dina JavaScript-strängar kräver användning av ett plus- och likhetstecken. Denna metod låter dig lägga till en ny sträng i slutet av en befintlig.

const firstName = "John"; 
const lastName = "Doe";

let stringVal;

stringVal = firstName;
stringVal += " ";
stringVal += lastName;

console.log(stringVal);

Den här koden lägger till ett tomt utrymme och värdet på lastName-variabeln till firstName-variabeln, vilket ger följande utdata:





hur man tvingar starta om en mac
  Plus och lika operatorer på sträng

Mallbokstavar

Mall-literals är en ES6-funktion som låter dig formatera JavaScript-strängar. En mall literal använder ett par backticks (`) för att visa strängar. Denna metod för strängformatering låter dig visa renare flerradssträngar i JavaScript.

let html; 

html = `<ul>
<li> Name: John Doe </li>
<li> Age: 24 </li>
<li> Job: Software Engineer </li>
</ul>`;

document.body.innerHTML = html;

JavaScript-koden ovan använder HTML för att skriva ut en lista med tre objekt i webbläsaren:

Photoshop hur man väljer en färg
  Utmatning av bokstavsmallar

För att uppnå samma utdata utan mallliteral (eller före mallliterals), skulle du behöva använda citattecken. Du skulle dock inte kunna utöka koden över flera rader som du kan med mallbokstavar.

let html; 

html = "<ul><li>Name: John Doe</li><li>Age: 24</li><li>Job: Software Engineer</li></ul>";

document.body.innerHTML = html;

Stränginterpolation

Mallliteraler låter dig använda uttryck i dina JavaScript-strängar genom en process som kallas interpolation. Med stränginterpolation kan du bädda in uttryck eller variabler i dina strängar med hjälp av ${expression} Platshållare. Det är här värdet av bokstavliga JavaScript-mallar blir verkligen uppenbart.

let userName = "Jane Doe"; 
let age = 21;
let job = "Web Developer";
let experience = 3;

let html;

html = `<ul>
<li> Name: ${userName} </li>
<li> Age: ${age} </li>
<li> Job Title: ${job} </li>
<li> Years of Experience: ${experience} </li>
<li> Developer Level: ${experience < 5 ? "Junior to Intermediate" : "Senior"} </li>
</ul>`;

document.body.innerHTML = html;

Koden ovan producerar följande utdata i konsolen:

  Stränginterpolationsutgång

De fyra första argumenten för ${expression} platshållare är strängvariabler, men den femte är ett villkorligt uttryck. Uttrycket förlitar sig på värdet av en av variablerna (upplevelse), för att diktera vad den ska visa i webbläsaren.

Formatera element på din webbsida med JavaScript

Förutom dess funktionella koppling till webbsidautveckling, fungerar JavaScript med HTML för att påverka designen och layouten på en webbsida. Det kan manipulera texten som visas på en webbsida, som är fallet med mallbokstavar.

Det kan till och med konvertera HTML till bilder och visa dem på en webbsida.