JavaScript RegExp -objekti

Sisällysluettelo

    Näytä sisällysluettelo

Säännöllinen lauseke on merkkijono, joka muodostaa a hakumalli.

Hakumallia voidaan käyttää tekstihakuun ja tekstin korvaamiseen toiminnot.

Mikä on säännöllinen lauseke?

Säännöllinen lauseke on merkkijono, joka muodostaa haun kuvio.

Kun etsit tietoja tekstistä, voit käyttää tätä hakumallia kuvaamaan etsimääsi.

Säännöllinen lauseke voi olla yksittäinen merkki tai monimutkaisempi kuvio.

Säännöllisiä lausekkeita voidaan käyttää kaikentyyppisten tekstihakujen suorittamiseen ja tekstin korvaaminen.

Syntaksi

/pattern/modifiers;

Esimerkki

/w3schools/i;

Esimerkki selitettynä:

/w3schools/i on säännöllinen lauseke.

w3schools on malli (jota käytetään haussa).

i on muokkaus (muuttaa haun niin, että kirjainkoolla ei ole merkitystä).

Merkkijonomenetelmien käyttäminen

JavaScriptissä säännöllisiä lausekkeita käytetään usein kahden -merkkijonon kanssa menetelmät: haku() ja korvaa().

haku()-menetelmä käyttää lauseketta etsiessään a ottelu, ja palauttaa ottelun sijainnin.

Metodi replace() palauttaa muokatun merkkijonon, jossa kuvio vaihdetaan.

Merkkijonon search() käyttäminen merkkijonon kanssa

Metodi search() etsii merkkijonosta määritetyn arvon ja palauttaa osuman sijainnin:

Esimerkki

Käytä merkkijonoa hakeaksesi "W3schools" merkkijonosta:

let text = "Visit W3Schools!";
let n = text.search("W3Schools");

Tulos kohdassa n on:

6

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Search a string for &quot;W3Schools&quot;, and display the position of the match:</p>

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

<script>
let text = "Visit W3Schools!"; 
let n = text.search("W3Schools");
document.getElementById("demo").innerHTML = n;
</script>

</body>
</html>

Merkkijonon search() käyttäminen säännöllisen lausekkeen kanssa

Esimerkki

Käytä säännöllistä lauseketta hakeaksesi merkkijonosta "w3schools", jossa kirjainkoolla ei ole merkitystä:

let text = "Visit W3Schools";
let n = text.search(/w3schools/i);

Tulos kohdassa n on:

6

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search a string for "w3Schools", and display the position of the match:</p>

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

<script>
let text = "Visit W3Schools!"; 
let n = text.search(/w3Schools/i);
document.getElementById("demo").innerHTML = n;
</script>

</body>
</html>

Merkkijonon käyttäminen replace() merkkijonolla

replace()-menetelmä korvaa määritetyn arvon toisella merkkijonon arvolla:

let text = "Visit Microsoft!";
let result = text.replace("Microsoft", "W3Schools");

Kokeile itse →

<!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>

Käytä merkkijonoa replace() säännöllisellä lausekkeella

Esimerkki

Käytä säännöllistä lauseketta, jossa kirjainkoolla ei erota, korvaamaan Microsoft W3Schoolsilla merkkijonossa:

let text = "Visit Microsoft!";
let result = text.replace(/microsoft/i, "W3Schools");

Tulos res:ssä on:

Visit W3Schools!

Kokeile itse →

<!DOCTYPE html>
<html>

<body>

<h2>JavaScript String Methods</h2>

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

Huomasitko?

Säännöllisten lausekkeiden argumentteja (merkkijonoargumenttien sijaan) voidaan käyttää yllä olevissa menetelmissä.
Säännölliset lausekkeet voivat tehdä haustasi paljon tehokkaampaa (esimerkiksi kirjainkoolla ei ole merkitystä).

Säännöllisten lausekkeiden muokkaajat

Muokkaajilla voidaan tehdä yleisempiä hakuja, joissa kirjainkokoa ei erotella:

Muokkaa:

i

Kuvaus: Hae kirjainkokoa eroon

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a case-insensitive search for "w3schools" in a string:</p>

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

<script>
let text = "Visit W3Schools";
let result = text.match(/w3schools/i);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

g

Kuvaus: Suorita yleinen ottelu (etsi kaikki ottelut sen sijaan, että lopetat ensimmäisen ottelun jälkeen)

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for "is" in a string:</p>

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

<script>
let text = "Is this all there is?";
let result = text.match(/is/g);
document.getElementById("demo").innerHTML = result; 
</script>

</body>
</html>

Muokkaa:

m

Kuvaus: Suorita monirivinen täsmäys

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a multiline search for "is" at the beginning of each line in a string:</p>

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

<script>
let text = "\nIs th\nis it?";
let result = text.match(/^is/m);
document.getElementById("demo").innerHTML = "Result is: " + result;
</script>

</body>
</html>

Säännölliset lausekkeet

Hakasulkeilla etsitään erilaisia merkkejä:

Muokkaa:

[abc]

Kuvaus: Etsi mikä tahansa merkkejä hakasulkeista

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for the character "h" in a string:</p>

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

<script>
let text = "Is this all there is?";
let result = text.match(/[h]/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

[0-9]

Kuvaus: Etsi mikä tahansa numero hakasulkeista

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for the numbers 1 to 4 in a string:</p>

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

<script>
let text = "123456789";
let result = text.match(/[1-4]/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

(x|y)

Kuvaus: Etsi mikä tahansa vaihtoehdoista erotettuna |

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for any of the specified alternatives (red|green):</p>

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

<script>
let text = "re, green, red, green, gren, gr, blue, yellow";
let result = text.match(/(red|green)/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Metamerkit ovat merkkejä, joilla on erityinen merkitys:

Muokkaa:

\d

Kuvaus: etsi numero

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for digits in a string:</p>

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

<script>
let text = "Give 100%!"; 
let result = text.match(/\d/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

\s

Kuvaus: Etsi välilyöntimerkki

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for whitespace characters in a string:</p>

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

<script>
let text = "Is this all there is?";
let result = text.match(/\s/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

\b

Kuvaus: Etsi vastaavuus sanan alusta, kuten tämä: \bWORD tai sanan lopusta näin: WORD\b

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search for the characters "LO" in the <b>beginning</b> of a word in the phrase:</p>
<p>"HELLO, LOOK AT YOU!"</p>

<p>Found in position: <span id="demo"></span></p>

<script>
let text = "HELLO, LOOK AT YOU!"; 
let result = text.search(/\bLO/);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search for the characters "LO" in the <b>end</b> of a word in the phrase:</p>
<p>"HELLO, LOOK AT YOU!"</p>

<p>Found in position: <span id="demo"></span></p>

<script>
let text = "HELLO, LOOK AT YOU!"; 
let result = text.search(/LO\b/);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

\uxxxx

Kuvaus: Etsi heksadesimaaliluvulla xxxx määritetty Unicode-merkki

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for the hexadecimal number 0057 (W) in a string:</p>

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

<script>
let text = "Visit W3Schools. Hello World!"; 
let result = text.match(/\u0057/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Kvantorit määrittävät suuret:

Muokkaa:

n+

Kuvaus: vastaa mitä tahansa merkkijonoa, joka sisältää vähintään yhden n

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for at least one "o" in a string:</p>

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

<script>
let text = "Hellooo World! Hello W3Schools!"; 
let result = text.match(/o+/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

n*

Kuvaus: vastaa mitä tahansa merkkijonoa, jossa on nolla tai useampi n esiintymä

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for an "l", followed by zero or more "o" characters:</p>

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

<script>
let text = "Hellooo World! Hello W3Schools!"; 
let result = text.match(/lo*/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Muokkaa:

n?

Kuvaus: vastaa mitä tahansa merkkijonoa, joka sisältää nollan tai yhden esiintymän n

Kokeile →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for a "1", followed by zero or one "0" characters:</p>

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

<script>
let text = "1, 100 or 1000?";
let result = text.match(/10?/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

RegExp-objektin käyttäminen

JavaScriptissä RegExp-objekti on säännöllinen lausekeobjekti, jossa on ennalta määritetyt ominaisuudet ja menetelmät.

Testin() käyttö

test()-menetelmä on RegExp-lausekemenetelmä.

Se etsii merkkijonosta kuviota ja palauttaa tosi tai väärä, tuloksesta riippuen.

Seuraava esimerkki etsii merkkijonosta "e"-merkkiä:

Esimerkki

const pattern = /e/;
pattern.test("The best things in life are free!");

Koska merkkijonossa on "e", yllä olevan koodin tulos on:

true

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search for an "e" in the next paragraph:</p>

<p id="p01">The best things in life are free!</p>

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

<script>
let text = document.getElementById("p01").innerHTML;
const pattern = /e/;
document.getElementById("demo").innerHTML = pattern.test(text);
</script>

</body>
</html>

Sinun ei tarvitse laittaa säännöllistä lauseketta ensin muuttujaan. Kaksi yllä olevat rivit voidaan lyhentää yhteen:

/e/.test("The best things in life are free!");

Käytä exec()

Metodi exec() on RegExp-lausekemenetelmä.

Se etsii merkkijonosta tiettyä mallia ja palauttaa löydetyn tekstin muodossa esine.

Jos vastaavuutta ei löydy, se palauttaa tyhjän (null)-objektin.

Seuraava esimerkki etsii merkkijonosta "e"-merkkiä:

Esimerkki

/e/.exec("The best things in life are free!");

Kokeile itse →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

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

<script>
const obj = /e/.exec("The best things in life are free!");
document.getElementById("demo").innerHTML =
"Found " + obj[0] + " in position " + obj.index + " in the text: " + obj.input;
</script>

</body>
</html>

Täydellinen RegExp-viite

Täydellinen viite löytyy kohdasta Täydellinen JavaScript RegExp -viite.

Viite sisältää kuvauksia ja esimerkkejä kaikista RegExp ominaisuuksia ja menetelmiä.