Αναζήτηση συμβολοσειρών JavaScript

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

    Εμφάνιση πίνακα περιεχομένων

Μέθοδοι αναζήτησης συμβολοσειρών

    

  • String indexOf()
    • 

  • String lastIndexOf()
    • 

  • String search()
    • 

  • String match()
    • 

  • String matchAll()
    • 

  • String includes()
    • 

  • String startsWith()
    • 

  • String endsWith()
    •

JavaScript String indexOf()

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

Παράδειγμα

let text = "Please locate where 'locate' occurs!";
let index = text.indexOf("locate");

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

<!DOCTYPE html>
<html>
<body>

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

<p>The indexOf() method returns the position of the first occurrence of a string in a string.</p>
<p>The position of the first occurrence of "locate" is:</p>
<p id="demo"></p>

<script>
let text = "Please locate where 'locate' occurs!";
let index = text.indexOf("locate");
document.getElementById("demo").innerHTML = index; 
</script>

</body>
</html>

Σημείωση

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

0 είναι η πρώτη θέση στο α συμβολοσειρά, 1 είναι η δεύτερη, 2 είναι η τρίτη, ...

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

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

Παράδειγμα

let text = "Please locate where 'locate' occurs!";
let index = text.lastIndexOf("locate");

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

<!DOCTYPE html>
<html>
<body>

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

<p>The position of the last occurrence of "locate" is:</p>

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

<script>
let text = "Please locate where 'locate' occurs!";
let index = text.lastIndexOf("locate");
document.getElementById("demo").innerHTML = index;
</script>

</body>
</html>

Τόσο το indexOf() όσο και το lastIndexOf() επιστρέφουν -1 αν δεν βρεθεί το κείμενο:

Παράδειγμα

let text = "Please locate where 'locate' occurs!";
let index = text.lastIndexOf("John");

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

<!DOCTYPE html>
<html>
<body>

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

<p>Both indexOf() and lastIndexOf() return -1 if the text is not found:</p>
<p id="demo"></p>

<script>
let text = "Please locate where 'locate' occurs!";
let index = text.indexOf("John");
document.getElementById("demo").innerHTML = index;
</script>

</body>
</html>

Και οι δύο μέθοδοι δέχονται μια δεύτερη παράμετρο ως αρχική θέση για το Αναζήτηση:

Παράδειγμα

let text = "Please locate where 'locate' occurs!";
let index = text.indexOf("locate", 15);

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

<!DOCTYPE html>
<html>
<body>

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

<p>The indexOf() method accepts a second parameter as the starting position for the search:</p>
<p id="demo"></p>

<script>
let text = "Please locate where 'locate' occurs!";
let index = text.indexOf("locate",15);
document.getElementById("demo").innerHTML = index; 
</script>

</body>
</html>

Οι μέθοδοι lastIndexOf() πραγματοποιούν αναζήτηση προς τα πίσω (από το τέλος στην αρχή), που σημαίνει: εάν η δεύτερη παράμετρος είναι 15, η αναζήτηση ξεκινά από τη θέση 15 και αναζητά στην αρχή της συμβολοσειράς.

Παράδειγμα

let text = "Please locate where 'locate' occurs!";
text.lastIndexOf("locate", 15);

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

<!DOCTYPE html>
<html>
<body>

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

<p>The lastIndexOf() method accepts a second parameter as the starting position for the search.</p>
<p>Remember that the lastIndexOf() method searches backwards, so position 15 means start the search at position 15, and search to the beginning.</p>

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

<script>
let text = "Please locate where 'locate' occurs!";
let index = text.lastIndexOf("locate", 15);
document.getElementById("demo").innerHTML = index; 
</script>

</body>
</html>

Αναζήτηση συμβολοσειράς JavaScript()

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

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

let text = "Please locate where 'locate' occurs!";
text.search("locate");

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

<!DOCTYPE html>
<html>
<body>

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

<p>The search() method returns the position of the first occurrence of a string in a string.</p>
<p>The position of the first occurrence of "locate" is:</p>
<p id="demo"></p>

<script>
let text = "Please locate where 'locate' occurs!";
let index = text.search("locate");
document.getElementById("demo").innerHTML = index; 
</script>

</body>
</html>


let text = "Please locate where 'locate' occurs!";
text.search(/locate/);

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

<!DOCTYPE html>
<html>
<body>

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

<p>The search() method returns the position of the first occurrence of a string in a string.</p>
<p>Return the position of the first occurrence of a regular expression:</p>
<p id="demo"></p>

<script>
let text = "Please locate where 'locate' occurs!";
let index = text.search(/locate/);
document.getElementById("demo").innerHTML = index;
</script>

</body>
</html>

Παρατήρησες?

Οι δύο μέθοδοι, indexOf() και search(), είναι ίσες;

Δέχονται τα ίδια ορίσματα (παραμέτρους) και επιστρέφουν την ίδια τιμή;

Οι δύο μέθοδοι ΔΕΝ είναι ίσες. Αυτές είναι οι διαφορές:

  • Η μέθοδος search() δεν μπορεί να λάβει δεύτερο όρισμα θέσης έναρξης.

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

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

Αντιστοίχιση συμβολοσειράς JavaScript()

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

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

Εκτελέστε μια αναζήτηση για "ain":

let text = "The rain in SPAIN stays mainly in the plain"; 
text.match("ain");

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

<!DOCTYPE html>
<html>
<body>

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

<p>Perform a search for "ain":</p>

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

<script>
let text = "The rain in SPAIN stays mainly in the plain";
const myArr = text.match("ain");
document.getElementById("demo").innerHTML = myArr.length + " " + myArr;
</script>

</body>
</html>

Εκτελέστε μια αναζήτηση για "ain":

let text = "The rain in SPAIN stays mainly in the plain"; 
text.match(/ain/);

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

<!DOCTYPE html>
<html>
<body>

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

<p>Perform a search for "ain":</p>

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

<script>
let text = "The rain in SPAIN stays mainly in the plain"; 
const myArr = text.match(/ain/);
document.getElementById("demo").innerHTML = myArr.length + " " + myArr;

</script>

</body>
</html>

Εκτελέστε μια συνολική αναζήτηση για "ain":

let text = "The rain in SPAIN stays mainly in the plain"; 
text.match(/ain/g);

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

<!DOCTYPE html>
<html>
<body>

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

<p>Perform a global search for "ain":</p>

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

<script>
let text = "The rain in SPAIN stays mainly in the plain"; 
const myArr = text.match(/ain/g);
document.getElementById("demo").innerHTML = myArr.length + " " + myArr;
</script>

</body>
</html>

Πραγματοποιήστε μια συνολική αναζήτηση χωρίς διάκριση πεζών-κεφαλαίων για το "ain":

let text = "The rain in SPAIN stays mainly in the plain"; 
text.match(/ain/gi);

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

<!DOCTYPE html>
<html>
<body>

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

<p>Perform a global, case-insensitive search for "ain":</p>

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

<script>
let text = "The rain in SPAIN stays mainly in the plain"; 
const myArr = text.match(/ain/gi);
document.getElementById("demo").innerHTML = myArr.length + " " + myArr;
</script>

</body>
</html>

Σημείωση

Εάν μια τυπική έκφραση δεν περιλαμβάνει τον τροποποιητή g (καθολική αναζήτηση), Το match() θα επιστρέψει μόνο την πρώτη αντιστοίχιση στη συμβολοσειρά.

Διαβάστε περισσότερα για τις τυπικές εκφράσεις στο κεφάλαιο JS RegExp.

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

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

Παράδειγμα

const iterator = text.matchAll("Cats");

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

<!DOCTYPE html>
<html>
<body>

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

<p>ES2020 intoduced the string method matchAll().</p>

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

<script>
let text = "I love cats. Cats are very easy to love. Cats are very popular."
const iterator = text.matchAll("Cats");

document.getElementById("demo").innerHTML = Array.from(iterator);
</script>

</body>
</html>

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

Παράδειγμα

const iterator = text.matchAll(/Cats/g);

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

<!DOCTYPE html>
<html>
<body>

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

<p>ES2020 intoduced the string method matchAll().</p>

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

<script>
let text = "I love cats. Cats are very easy to love. Cats are very popular."
const iterator = text.matchAll(/Cats/g);

document.getElementById("demo").innerHTML = Array.from(iterator);
</script>

</body>
</html>

Εάν θέλετε να κάνετε αναζήτηση χωρίς διάκριση πεζών-κεφαλαίων, πρέπει να οριστεί η σημαία (i) που δεν είναι ευαίσθητη:

Παράδειγμα

const iterator = text.matchAll(/Cats/gi);

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

<!DOCTYPE html>
<html>
<body>

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

<p>ES2020 intoduced the string method matchAll().</p>

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

<script>
let text = "I love cats. Cats are very easy to love. Cats are very popular."
const iterator = text.matchAll(/Cats/gi);

document.getElementById("demo").innerHTML = Array.from(iterator);
</script>

</body>
</html>

Σημειώσεις

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

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

Η συμβολοσειρά JavaScript περιλαμβάνει()

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

Διαφορετικά, επιστρέφει false.

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

Ελέγξτε εάν μια συμβολοσειρά περιλαμβάνει "world":

let text = "Hello world, welcome to the universe.";
text.includes("world");

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

<!DOCTYPE html>
<html>
<body>

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

<p>Check if a string includes "world":</p>
<p id="demo"></p>

<p>The includes() method is not supported in Internet Explorer.</p>

<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.includes("world");
</script>

</body>
</html>

Ελέγξτε εάν μια συμβολοσειρά περιλαμβάνει "κόσμο". Ξεκινήστε από τη θέση 12:

let text = "Hello world, welcome to the universe.";
text.includes("world", 12);

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

<!DOCTYPE html>
<html>
<body>

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

<p>Check if a string includes "world" starting from position 12:</p>
<p id="demo"></p>

<p>The includes() method is not supported in Internet Explorer.</p>

<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.includes("world", 12);
</script>

</body>
</html>

Σημειώσεις

Το includes() κάνει διάκριση πεζών-κεφαλαίων.

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

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

Η συμβολοσειρά JavaScript startsWith()

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

Διαφορετικά, επιστρέφει false:

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

Επιστρέφει true:

let text = "Hello world, welcome to the universe.";
text.startsWith("Hello");

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

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Strings</h1>
<h2>The startsWith() Method</h2>
<p>Check if a string starts with "Hello":</p>

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

<p>The startsWith() method is not supported in Internet Explorer.</p>

<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.startsWith("Hello");
</script>

</body>
</html>

Επιστρέφει ψευδές:

let text = "Hello world, welcome to the universe.";
text.startsWith("world")

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

<!DOCTYPE html>
<html>
<body>

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

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

<p>The startsWith() method is not supported in Internet Explorer.</p>

<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.startsWith("world");
</script>

</body>
</html>

Μια θέση έναρξης για την αναζήτηση μπορεί να καθοριστεί:

Επιστρέφει ψευδές:

let text = "Hello world, welcome to the universe.";
text.startsWith("world", 5)

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

<!DOCTYPE html>
<html>
<body>

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

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

<p>The startsWith() method is not supported in Internet Explorer.</p>

<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.startsWith("world", 5);
</script>

</body>
</html>

Επιστρέφει true:

let text = "Hello world, welcome to the universe.";
text.startsWith("world", 6)

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

<!DOCTYPE html>
<html>
<body>

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

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

<p>The startsWith() method is not supported in Internet Explorer.</p>

<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.startsWith("world", 6);
</script>

</body>
</html>

Σημειώσεις

Το startsWith() κάνει διάκριση πεζών-κεφαλαίων.

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

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

Η συμβολοσειρά JavaScript endsWith()

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

Διαφορετικά, επιστρέφει false:

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

Ελέγξτε αν μια συμβολοσειρά τελειώνει με "Doe":

let text = "John Doe";
text.endsWith("Doe");

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

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Strings</h2>

<p>Check if a string ends with "Doe":</p>

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

<p>The endsWith() method is not supported in Internet Explorer.</p>

<script>
let text = "John Doe";
document.getElementById("demo").innerHTML = text.endsWith("Doe");
</script>

</body>
</html>

Ελέγξτε αν οι 11 πρώτοι χαρακτήρες μιας συμβολοσειράς τελειώνουν με "world":

let text = "Hello world, welcome to the universe.";
text.endsWith("world", 11);

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

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Strings</h2>

<p>Check in the 11 first characters of a string ends with "world":</p>

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

<p>The endsWith() method is not supported in Internet Explorer.</p>

<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.endsWith("world", 11);
</script>

</body>
</html>

Σημειώσεις

Το endsWith() κάνει διάκριση πεζών-κεφαλαίων.

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

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

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

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

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

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