Μέθοδοι συμβολοσειράς JavaScript

Πίνακας περιεχομένων

String length
String slice()
String substring()
String substr()
String replace()
String replaceAll()
String toUpperCase()
String toLowerCase()
String concat()
String trim()
String trimStart()
String trimEnd()
String padStart()
String padEnd()
String charAt()
String charCodeAt()
String split()

Σημείωση

Οι μέθοδοι αναζήτησης συμβολοσειρών καλύπτονται στο επόμενο κεφάλαιο.

Μήκος συμβολοσειράς JavaScript

Η ιδιότητα length επιστρέφει το μήκος μιας συμβολοσειράς:

Παράδειγμα

let text = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
let length = text.length;

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The length Property</h2>

<p>The length of the string is:</p>
<p id="demo"></p>

<script>
let text = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
document.getElementById("demo").innerHTML = text.length;
</script>

</body>
</html>

Εξαγωγή εξαρτημάτων χορδών

Υπάρχουν 3 μέθοδοι για την εξαγωγή ενός τμήματος μιας συμβολοσειράς:


  slice(start, end)
  substring(start, end)
  substr(start, length)

Φέτα συμβολοσειράς JavaScript()

Το slice() εξάγει ένα μέρος μιας συμβολοσειράς και επιστρέφει το εξαγόμενο μέρος σε μια νέα συμβολοσειρά.

Η μέθοδος παίρνει 2 παραμέτρους: θέση έναρξης και θέση τερματισμού (το τέλος δεν περιλαμβάνεται).

Παράδειγμα

Κόψτε ένα τμήμα μιας συμβολοσειράς από τη θέση 7 στη θέση 13:

let text = "Apple, Banana, Kiwi";
let part = text.slice(7, 13);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The slice() Method</h2>

<p>The sliced (extracted) part of the string is:</p>
<p id="demo"></p>

<script>
let text = "Apple, Banana, Kiwi";
let part = text.slice(7,13);
document.getElementById("demo").innerHTML = part; 
</script>

</body>
</html>

Σημείωση

Η JavaScript μετράει θέσεις από το μηδέν.

Η πρώτη θέση είναι 0.

Η δεύτερη θέση είναι 1.

Παραδείγματα

Εάν παραλείψετε τη δεύτερη παράμετρο, η μέθοδος θα αφαιρέσει το υπόλοιπο της συμβολοσειράς:

let text = "Apple, Banana, Kiwi";
let part = text.slice(7);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The slice() Method</h2>

<p>Extract a part of a string from position 7:</p>
<p id="demo"></p>

<script>
let text = "Apple, Banana, Kiwi";
let part = text.slice(7)
document.getElementById("demo").innerHTML = part;
</script>

</body>
</html>

Εάν μια παράμετρος είναι αρνητική, η θέση μετράται από το τέλος της συμβολοσειράς:

let text = "Apple, Banana, Kiwi";
let part = text.slice(-12);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The slice() Method</h2>

<p>Extract a part of a string counting from the end:</p>
<p id="demo"></p>

<script>
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12);
document.getElementById("demo").innerHTML = part;
</script>

</body>
</html>

Αυτό το παράδειγμα κόβει ένα τμήμα μιας συμβολοσειράς από τη θέση -12 στη θέση -6:

let text = "Apple, Banana, Kiwi";
let part = text.slice(-12, -6);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The slice() Method</h2>

<p>Extract a part of a string and return the extracted parts in a new string:</p>

<p id="demo"></p>

<script>
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12,-6)
document.getElementById("demo").innerHTML = part;
</script>

</body>
</html>

Υποσυμβολοσειρά JavaScript String()

Η substring() είναι παρόμοια με την slice().

Η διαφορά είναι ότι οι τιμές έναρξης και λήξης μικρότερες από 0 αντιμετωπίζονται ως 0 in substring().

Παράδειγμα

let str = "Apple, Banana, Kiwi";
let part = str.substring(7, 13);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>The substring() method extract a part of a string and returns the extracted parts in a new string:</p>

<p id="demo"></p>

<script>
let str = "Apple, Banana, Kiwi";
document.getElementById("demo").innerHTML = str.substring(7,13);
</script>

</body>
</html>

Εάν παραλείψετε τη δεύτερη παράμετρο, το substring() θα αφαιρέσει το υπόλοιπο σειρά.

JavaScript String substr()

Το substr() είναι παρόμοιο με το slice().

Η διαφορά είναι ότι η δεύτερη παράμετρος καθορίζει το μήκος του εξαγόμενου τμήματος.

Παράδειγμα

let str = "Apple, Banana, Kiwi";
let part = str.substr(7, 6);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>The substr() method extract a part of a string
and returns the extracted parts in a new string:</p>

<p id="demo"></p>

<script>
let str = "Apple, Banana, Kiwi";
document.getElementById("demo").innerHTML = str.substr(7,6);
</script>

</body>
</html>

Εάν παραλείψετε τη δεύτερη παράμετρο, το substr() θα αφαιρέσει το υπόλοιπο σειρά.

Παράδειγμα

let str = "Apple, Banana, Kiwi";
let part = str.substr(7);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>The substr() method extract a part of a string and returns the extracted parts in a new string:</p>

<p id="demo"></p>

<script>
let str = "Apple, Banana, Kiwi";
document.getElementById("demo").innerHTML = str.substr(7);
</script>

</body>
</html>

Εάν η πρώτη παράμετρος είναι αρνητική, η θέση μετράει από το τέλος του σειρά.

Παράδειγμα

let str = "Apple, Banana, Kiwi";
let part = str.substr(-4);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>The substr() method extract a part of a string and returns the extracted parts in a new string:</p>

<p id="demo"></p>

<script>
let str = "Apple, Banana, Kiwi";
document.getElementById("demo").innerHTML = str.substr(-4);
</script>

</body>
</html>

Αντικατάσταση περιεχομένου συμβολοσειράς

Η μέθοδος replace() αντικαθιστά μια καθορισμένη τιμή με μια άλλη τιμή σε μια συμβολοσειρά:

Παράδειγμα

let text = "Please visit Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>

<body>

<h1>JavaScript String Methods</h1>
<p>Replace &quot;Microsoft&quot; with &quot;W3Schools&quot; in the paragraph below:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Please visit Microsoft!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML;
  document.getElementById("demo").innerHTML =
  text.replace("Microsoft","W3Schools");
}
</script>

</body>
</html>

Σημείωση

Η μέθοδος replace() δεν αλλάζει τη συμβολοσειρά στην οποία καλείται.

Η μέθοδος replace() επιστρέφει μια νέα συμβολοσειρά.

Η μέθοδος replace() αντικαθιστά μόνο την πρώτη αντιστοίχιση

Εάν θέλετε να αντικαταστήσετε όλες τις αντιστοιχίσεις, χρησιμοποιήστε μια τυπική έκφραση με το σύνολο σημαιών /g. Δείτε παραδείγματα παρακάτω.

Από προεπιλογή, η μέθοδος replace() αντικαθιστά μόνο την πρώτη αντιστοίχιση:

Παράδειγμα

let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Replace "Microsoft" with "W3Schools" in the paragraph below:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Please visit Microsoft and Microsoft!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML; 
  document.getElementById("demo").innerHTML =
  text.replace("Microsoft","W3Schools");
}
</script>

</body>
</html>

Από προεπιλογή, η μέθοδος replace() κάνει διάκριση πεζών-κεφαλαίων. Γράψιμο της MICROSOFT (με κεφαλαία) δεν θα λειτουργήσει:

Παράδειγμα

let text = "Please visit Microsoft!";
let newText = text.replace("MICROSOFT", "W3Schools");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Try to replace "Microsoft" with "W3Schools" in the paragraph below:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Please visit Microsoft!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML; 
  document.getElementById("demo").innerHTML =
  text.replace("MICROSOFT","W3Schools");
}
</script>

<p>The replace() method is case sensitive. MICROSOFT (with upper-case) will not be replaced.</p>

</body>
</html>

Για να αντικαταστήσετε τα πεζά και πεζά, χρησιμοποιήστε μια κανονική έκφραση με μια σημαία /i (μη ευαίσθητη):

Παράδειγμα

let text = "Please visit Microsoft!";
let newText = text.replace(/MICROSOFT/i, "W3Schools");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Replace "Microsoft" with "W3Schools" in the paragraph below:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Please visit Microsoft!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML; 
  document.getElementById("demo").innerHTML =
  text.replace(/MICROSOFT/i,"W3Schools");
}
</script>

</body>
</html>

Σημείωση

Οι κανονικές εκφράσεις γράφονται χωρίς εισαγωγικά.

Για να αντικαταστήσετε όλες τις αντιστοιχίσεις, χρησιμοποιήστε μια κανονική έκφραση με μια σημαία /g (καθολική αντιστοίχιση):

Παράδειγμα

let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace(/Microsoft/g, "W3Schools");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Replace all occurrences of "Microsoft" with "W3Schools" in the paragraph below:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Please visit Microsoft and Microsoft!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML; 
  document.getElementById("demo").innerHTML =
  text.replace(/Microsoft/g,"W3Schools");
}
</script>

</body>
</html>

Σημείωση

Θα μάθετε πολλά περισσότερα για τις τυπικές εκφράσεις στο κεφάλαιο JavaScript Regular Εκφράσεις.

Συμβολοσειρά JavaScript ReplaceAll()

Το 2021, η JavaScript εισήγαγε τη μέθοδο συμβολοσειράς replaceAll():

Παράδειγμα

text = text.replaceAll("Cats","Dogs");
text = text.replaceAll("cats","dogs");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Strings</h1>
<h2>The replaceAll() Method</h2>

<p>ES2021 intoduced the string method replaceAll().</p>

<p id="demo"></p>

<script>
let text = "I love cats. Cats are very easy to love. Cats are very popular."
text = text.replaceAll("Cats","Dogs");
text = text.replaceAll("cats","dogs");

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Η μέθοδος replaceAll() σάς επιτρέπει να καθορίσετε ένα κανονική έκφραση αντί για συμβολοσειρά που θα αντικατασταθεί.

Εάν η παράμετρος είναι κανονική έκφραση, πρέπει να οριστεί η καθολική σημαία (g), διαφορετικά εμφανίζεται ένα TypeError.

Παράδειγμα

text = text.replaceAll(/Cats/g,"Dogs");
text = text.replaceAll(/cats/g,"dogs");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Strings</h1>
<h2>The replaceAll() Method</h2>

<p>ES2021 intoduced the string method replaceAll().</p>

<p id="demo"></p>

<script>
let text = "I love cats. Cats are very easy to love. Cats are very popular";
text = text.replaceAll(/Cats/g,"Dogs");
text = text.replaceAll(/cats/g,"dogs");

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Σημείωση

Το replaceAll() είναι μια δυνατότητα ES2021.

Το replaceAll() δεν λειτουργεί στον Internet Explorer.

Μετατροπή σε κεφαλαία και πεζά

Μια συμβολοσειρά μετατρέπεται σε κεφαλαία με toUpperCase():

Μια συμβολοσειρά μετατρέπεται σε πεζά με toLowerCase():

Συμβολοσειρά JavaScript toUpperCase()

Παράδειγμα

let text1 = "Hello World!";
let text2 = text1.toUpperCase();

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Convert string to upper case:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Hello World!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML;
  document.getElementById("demo").innerHTML =
  text.toUpperCase();
}
</script>

</body>
</html>

Συμβολοσειρά JavaScript toLowerCase()

Παράδειγμα

let text1 = "Hello World!";       // String
let text2 = text1.toLowerCase();  // text2 is text1 
converted to lower

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Convert string to lower case:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Hello World!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML;
  document.getElementById("demo").innerHTML =
  text.toLowerCase();
}
</script>

</body>
</html>

JavaScript String concat()

Η concat() ενώνει δύο ή περισσότερες συμβολοσειρές:

Παράδειγμα

let text1 = "Hello";
let text2 = "World";
let text3 = text1.concat(" ", text2);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String</h1>
<h2>The concat() Method</h2>

<p>The concat() method joins two or more strings:</p>

<p id="demo"></p>

<script>
let text1 = "Hello";
let text2 = "World!";
let text3 = text1.concat(" ",text2);
document.getElementById("demo").innerHTML = text3;
</script>

</body>
</html>

Η μέθοδος concat() μπορεί να χρησιμοποιηθεί αντί για τον τελεστή συν. Αυτές οι δύο γραμμές κάνουν το ίδιο:

Παράδειγμα

text = "Hello" + " " + "World!";
text = "Hello".concat(" ", "World!");

Σημείωση

Όλες οι μέθοδοι συμβολοσειράς επιστρέφουν μια νέα συμβολοσειρά. Δεν τροποποιούν την αρχική συμβολοσειρά.

Είπε επίσημα:

Οι συμβολοσειρές είναι αμετάβλητες: Οι συμβολοσειρές δεν μπορούν να αλλάξουν, αλλά μόνο να αντικατασταθούν.

Περικοπή συμβολοσειράς JavaScript()

Η μέθοδος trim() αφαιρεί το κενό διάστημα και από τις δύο πλευρές μιας συμβολοσειράς:

Παράδειγμα

let text1 = "      Hello World!      ";
let text2 = text1.trim();

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The trim() Method</h2>

<p id="demo"></p>

<script>
let text1 = "     Hello World!     ";
let text2 = text1.trim();

document.getElementById("demo").innerHTML =
"Length text1 = " + text1.length + "<br>Length text2 = " + text2.length;
</script>

</body>
</html>

Συμβολοσειρά JavaScript trimStart()

Το ECMAScript 2019 πρόσθεσε τη μέθοδο String trimStart() στο JavaScript. <p>Η μέθοδος trimStart() λειτουργεί όπως trim(), αλλά αφαιρεί το κενό διάστημα μόνο από την αρχή του μια χορδή.

Παράδειγμα

let text1 = "     Hello World!     ";
let text2 = text1.trimStart();

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The trimStart() Method</h2>

<p id="demo"></p>

<script>
let text1 = "     Hello World!     ";
let text2 = text1.trimStart();

document.getElementById("demo").innerHTML =
"Length text1 = " + text1.length + "<br>Length text2 = " + text2.length;
</script>

</body>
</html>

Το JavaScript String trimStart() υποστηρίζεται σε όλα τα σύγχρονα προγράμματα περιήγησης από τον Ιανουάριο του 2020:


Chrome 66	Edge 79	Firefox 61	Safari 12	Opera 50
Apr 2018	Jan 2020	Jun 2018	Sep 2018	May 2018

JavaScript String trimEnd()

Το ECMAScript 2019 πρόσθεσε τη μέθοδο συμβολοσειράς trimEnd() στο JavaScript. <p>Η μέθοδος trimEnd() λειτουργεί όπως trim(), αλλά αφαιρεί το κενό διάστημα μόνο από το τέλος του μια χορδή.

Παράδειγμα

let text1 = "     Hello World!     ";
let text2 = text1.trimEnd();

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The trimEnd() Method</h2>

<p id="demo"></p>

<script>
let text1 = "     Hello World!     ";
let text2 = text1.trimEnd();

document.getElementById("demo").innerHTML =
"Length text1 = " + text1.length + "<br>Length text2 = " + text2.length;
</script>

</body>
</html>

Η συμβολοσειρά JavaScript trimEnd() υποστηρίζεται σε όλα τα σύγχρονα προγράμματα περιήγησης από τον Ιανουάριο του 2020:


Chrome 66	Edge 79	Firefox 61	Safari 12	Opera 50
Apr 2018	Jan 2020	Jun 2018	Sep 2018	May 2018

Επένδυση συμβολοσειρών JavaScript

Το ECMAScript 2017 πρόσθεσε δύο νέες μεθόδους συμβολοσειράς στο JavaScript: padStart() και padEnd() για υποστήριξη πλήρωσης στην αρχή και στο τέλος μιας συμβολοσειράς.

JavaScript String padStart()

Η μέθοδος padStart() συμπληρώνει μια συμβολοσειρά από την αρχή.

Γεμίζει μια χορδή με μια άλλη χορδή (πολλές φορές) μέχρι να φτάσει σε ένα δεδομένο μήκος.

Παραδείγματα

Συμπληρώστε μια συμβολοσειρά με "0" μέχρι να φτάσει το μήκος 4:

let text = "5";
let padded = text.padStart(4,"0");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The padStart() Method</h2>

<p>The padStart() method pads a string from the start.</p>
<p>It pads the string with another string (multiple times) until it reaches a given length.</p>

<p id="demo"></p>

<script>
let text = "5";
text = text.padStart(4,"0");

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Συμπληρώστε μια συμβολοσειρά με "x" μέχρι να φτάσει το μήκος 4:

let text = "5";
let padded = text.padStart(4,"x");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The padStart() Method</h2>

<p>The padStart() method pads a string from the start.</p>
<p>It pads the string with another string (multiple times) until it reaches a given length.</p>

<p id="demo"></p>

<script>
let text = "5";
document.getElementById("demo").innerHTML = text.padStart(4,"x");
</script>

</body>
</html>

Σημείωση

Η μέθοδος padStart() είναι μέθοδος συμβολοσειράς.

Για να συμπληρώσετε έναν αριθμό, μετατρέψτε τον αριθμό σε συμβολοσειρά πρώτα.

Δείτε το παρακάτω παράδειγμα.

Παράδειγμα

let numb = 5;
let text = numb.toString();
let padded = text.padStart(4,"0");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The padStart() Method</h2>

<p>The padStart() method pads a string from the start.</p>
<p>It pads the string with another string (multiple times) until it reaches a given length.</p>

<p id="demo"></p>

<script>
let numb = 5;
let text = numb.toString();
document.getElementById("demo").innerHTML = text.padStart(4,0);
</script>

</body>
</html>

Υποστήριξη προγράμματος περιήγησης

Το padStart() είναι μια δυνατότητα ECMAScript 2017.

Υποστηρίζεται σε όλα τα σύγχρονα προγράμματα περιήγησης:


Chrome	Edge	Firefox	Safari	Opera
Yes	Yes	Yes	Yes	Yes

Το padStart() δεν υποστηρίζεται στον Internet Explorer.

JavaScript String padEnd()

Η μέθοδος padEnd() συμπληρώνει μια συμβολοσειρά από το τέλος.

Γεμίζει μια χορδή με μια άλλη χορδή (πολλές φορές) μέχρι να φτάσει σε ένα δεδομένο μήκος.

Παραδείγματα

let text = "5";
let padded = text.padEnd(4,"0");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The padEnd() Method</h2>

<p>The padEnd() method pads a string at the end.</p>
<p>It pads the string with another string (multiple times) until it reaches a given length.</p>

<p id="demo"></p>

<script>
let text = "5";
text = text.padEnd(4,"0");

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

let text = "5";
let padded = text.padEnd(4,"x");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The padEnd() Method</h2>

<p>The padEnd() method pads a string at the end.</p>
<p>It pads the string with another string (multiple times) until it reaches a given length.</p>

<p id="demo"></p>

<script>
let text = "5";
document.getElementById("demo").innerHTML = text.padEnd(4,"x");
</script>

</body>
</html>

Σημείωση

Η μέθοδος padEnd() είναι μέθοδος συμβολοσειράς.

Για να συμπληρώσετε έναν αριθμό, μετατρέψτε τον αριθμό σε συμβολοσειρά πρώτα.

Δείτε το παρακάτω παράδειγμα.

Παράδειγμα

let numb = 5;
let text = numb.toString();
let padded = text.padEnd(4,"0");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The padEnd() Method</h2>

<p>The padEnd() method pads a string at the end.</p>
<p>It pads the string with another string (multiple times) until it reaches a given length.</p>

<p id="demo"></p>

<script>
let numb = 5;
let text = numb.toString();
document.getElementById("demo").innerHTML = text.padEnd(4,"x");
</script>

</body>
</html>

Υποστήριξη προγράμματος περιήγησης

Το padEnd() είναι μια δυνατότητα ECMAScript 2017.

Υποστηρίζεται σε όλα τα σύγχρονα προγράμματα περιήγησης:


Chrome	Edge	Firefox	Safari	Opera
Yes	Yes	Yes	Yes	Yes

Το padEnd() δεν υποστηρίζεται στον Internet Explorer.

Εξαγωγή χαρακτήρων συμβολοσειράς

Υπάρχουν 3 μέθοδοι για την εξαγωγή χαρακτήρων συμβολοσειράς:

charAt(position)
charCodeAt(position)
Πρόσβαση στο ακίνητο [ ]

Συμβολοσειρά JavaScript charAt()

Η μέθοδος charAt() επιστρέφει τον χαρακτήρα σε καθορισμένο ευρετήριο (θέση) σε μια συμβολοσειρά:

Παράδειγμα

let text = "HELLO WORLD";
let char = text.charAt(0);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String</h1>
<h2>The charAt() Method</h2>

<p>The charAt() method returns the character at a given position in a string:</p>

<p id="demo"></p>

<script>
var text = "HELLO WORLD";
document.getElementById("demo").innerHTML = text.charAt(0);
</script>

</body>
</html>

Συμβολοσειρά JavaScript charCodeAt()

Η μέθοδος charCodeAt() επιστρέφει το unicode του χαρακτήρα σε ένα καθορισμένο ευρετήριο σε μια συμβολοσειρά:

Η μέθοδος επιστρέφει έναν κωδικό UTF-16 (έναν ακέραιο μεταξύ 0 και 65535).

Παράδειγμα

let text = "HELLO WORLD";
let char = text.charCodeAt(0);

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String</h1>
<h2>The charCodeAt() Method</h2>

<p>The charCodeAt() method returns the unicode of the character at a given position in a string:</p>

<p id="demo"></p>

<script>
let text = "HELLO WORLD";
document.getElementById("demo").innerHTML = text.charCodeAt(0);
</script>

</body>
</html>

Πρόσβαση στο ακίνητο

Το ECMAScript 5 (2009) επιτρέπει την πρόσβαση στην ιδιότητα [ ] σε συμβολοσειρές:

Παράδειγμα

let text = "HELLO WORLD";
let char = text[0];

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<p>Property access on strings:</p>

<p>The first character in the string is:</p>
<p id="demo"></p>

<script>
let text = "HELLO WORLD";
document.getElementById("demo").innerHTML = text[0];
</script>
</body>
</html>

Σημείωση

Η πρόσβαση στην ιδιοκτησία μπορεί να είναι λίγο απρόβλεπτη:

Κάνει τις συμβολοσειρές να μοιάζουν με πίνακες (αλλά δεν είναι)
Εάν δεν βρεθεί χαρακτήρας, το [ ] επιστρέφει απροσδιόριστο, ενώ το charAt() επιστρέφει μια κενή συμβολοσειρά.
Διαβάζεται μόνο. str[0]=Το "A" δεν δίνει κανένα σφάλμα (αλλά δεν λειτουργεί!)

Παράδειγμα

let text = "HELLO WORLD";
text[0] = "A";    // Gives no error, but does not work

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<p>Property acces on strings are read only:</p>

<p id="demo"></p>

<script>
let text = "HELLO WORLD";

text[0] = "A";  // Does not work

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Μετατροπή συμβολοσειράς σε πίνακα

Εάν θέλετε να εργαστείτε με μια συμβολοσειρά ως πίνακα, μπορείτε να τη μετατρέψετε σε πίνακα.

JavaScript String split()

Μια συμβολοσειρά μπορεί να μετατραπεί σε πίνακα με τη μέθοδο split():

Παράδειγμα

text.split(",")    // Split on commas
text.split(" ")    // Split on spaces
text.split("|")    // Split on pipe

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Display the first array element, after a string split:</p>

<p id="demo"></p>

<script>
let text = "a,b,c,d,e,f";
const myArray = text.split(",");
document.getElementById("demo").innerHTML = myArray[0];
</script>

</body>
</html>

Εάν παραλειφθεί το διαχωριστικό, ο πίνακας που επιστρέφεται θα περιέχει ολόκληρη τη συμβολοσειρά στον δείκτη [0].

Εάν το διαχωριστικό είναι "", ο πίνακας που επιστρέφεται θα είναι ένας πίνακας μεμονωμένων χαρακτήρες:

Παράδειγμα

text.split("")

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<h2>The split().Method</h2>

<p id="demo"></p>

<script>
let text = "Hello";
const myArr = text.split("");

text = "";
for (let i = 0; i < myArr.length; i++) {
  text += myArr[i] + "<br>"
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Πλήρης αναφορά συμβολοσειράς

Για μια πλήρη αναφορά String, μεταβείτε στη διεύθυνση μας:

Ολοκληρώστε την αναφορά συμβολοσειράς JavaScript.

Η αναφορά περιέχει περιγραφές και παραδείγματα όλων των ιδιοτήτων και μεθόδων συμβολοσειράς.