Kā formatēt virkni JavaScript?

Programmā JavaScript virkne ir rakstzīmju grupa, kas ietverta ar vienpēdiņām vai dubultpēdiņām. Ir daudz veidu, kā formatēt virknes JavaScript.

Virkņu apvienošanai varat izmantot noteiktas metodes vai operatorus. Varat pat veikt noteiktas darbības, lai izlemtu, kura virkne parādās, kur un kad.

DIENAS VIDEO MAKEUSEOF

Uzziniet, kā formatēt JavaScript virknes, izmantojot savienošanas metodes un veidņu literāļus.

Virknes savienošana

JavaScript ļauj savienot virknes, izmantojot vairākas pieejas. Noderīga pieeja ir concat () metodi. Šī metode izmanto divas vai vairākas virknes. Tas izmanto vienu izsaukuma virkni un izmanto vienu vai vairākas virknes kā argumentus.

cik maksā youtube premium

const firstName = "John"; 
const lastName = "Doe"; 
  
let stringVal; 
  
stringVal = firstName.concat(" ", lastName); 
console.log(stringVal);

Šeit concat savieno virknes argumentus (tukša atstarpe un uzvārds) ar izsaucēja virkni (firstName). Pēc tam kods saglabā iegūto jauno virkni mainīgajā (stringVal) un izdrukā jauno vērtību pārlūkprogrammas konsolē :

Vēl viens veids, kā savienot virkņu kolekciju, ir izmantot plus operatoru. Šī metode ļauj apvienot virkņu mainīgos un virkņu literāļus, lai izveidotu jaunas virknes.

const firstName = "John"; 
const middleName = "Mike"; 
const lastName = "Doe"; 
  
let stringVal; 
  
stringVal = firstName + " " + middleName + " " + lastName; 
console.log(stringVal);

Iepriekš minētais kods konsolē izdrukā šādu izvadi:

Trešā pieeja JavaScript virkņu savienošanai prasa plusa un vienādības zīmes izmantošanu. Šī metode ļauj pievienot jaunu virkni esošas virknes beigām.

const firstName = "John"; 
const lastName = "Doe"; 
  
let stringVal; 
  
stringVal = firstName; 
stringVal += " "; 
stringVal += lastName; 
  
console.log(stringVal);

Šis kods mainīgajam FirstName pievieno tukšu vietu un mainīgā LastName vērtību, iegūstot šādu izvadi:

chrome os on aveņu pi 3

Veidņu burti

Veidņu literāļi ir ES6 līdzeklis, kas ļauj formatēt JavaScript virknes. Lai parādītu virknes, veidnes literālē tiek izmantots atzīmes (`) pāris. Šī virkņu formatēšanas metode ļauj parādīt tīrākas daudzrindu virknes JavaScript.

let html; 
  
html = `<ul> 
       <li> Name: John Doe </li> 
       <li> Age: 24 </li> 
       <li> Job: Software Engineer </li> 
       </ul>`; 
  
document.body.innerHTML = html;

Tiek izmantots iepriekš minētais JavaScript kods HTML lai pārlūkprogrammā izdrukātu trīs vienumu sarakstu:

Lai sasniegtu tādu pašu rezultātu bez veidņu literāļiem (vai pirms veidņu literāļiem), jums būs jāizmanto pēdiņas. Tomēr jūs nevarēsit paplašināt kodu vairākās rindās, kā tas ir iespējams, izmantojot veidņu literāļus.

let html; 
  
html = "<ul><li>Name: John Doe</li><li>Age: 24</li><li>Job: Software Engineer</li></ul>"; 
  
document.body.innerHTML = html;

Stīgu interpolācija

Veidņu literāļi ļauj izmantot izteiksmes JavaScript virknēs, izmantojot procesu, ko sauc par interpolāciju. Izmantojot virkņu interpolāciju, savās virknēs varat iegult izteiksmes vai mainīgos, izmantojot ${expression} vietturis. Šeit kļūst patiesi acīmredzama JavaScript veidņu literāļu vērtība.

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;

Iepriekš minētais kods konsolē rada šādu izvadi:

Pirmie četri argumenti ${expression} vietturi ir virknes mainīgie, bet piektais ir nosacījuma izteiksme. Izteiksme balstās uz viena mainīgā lieluma vērtību (pieredze), lai noteiktu, kas tai jāparāda pārlūkprogrammā.

Elementu formatēšana jūsu tīmekļa lapā, izmantojot JavaScript

Papildus funkcionālajai saistībai ar tīmekļa lapu izstrādi JavaScript darbojas ar HTML, lai ietekmētu tīmekļa lapas dizainu un izkārtojumu. Tas var manipulēt ar tekstu, kas parādās tīmekļa lapā, kā tas ir ar veidņu literāļiem.

Tas pat var pārvērst HTML par attēliem un parādīt tos tīmekļa lapā.