JS-zelfstudie

JS HOME JS Introductie JS Waarheen? JS-uitgang JS-verklaringen JS-syntaxis JS-opmerkingen JS-variabelen JS Let JS Const JS-operators JS Rekenen JS-opdracht JS-gegevenstypen JS-functies JS-objecten JS-evenementen JS-snaren JS String-methoden JS String zoeken JS String-sjablonen JS-nummers JS-nummermethoden JS-arrays JS-array-methoden JS-array sorteren JS-array-iteratie JS Array Const JS-datums JS-datumnotaties JS Datum Ophaalmethoden Methoden voor het instellen van JS-datum JS Math JS Willekeurig JS Booleans JS-vergelijkingen JS-voorwaarden JS-schakelaar JS Loop For JS-lus voor binnen JS Loop For Of JS-lus terwijl JS Break JS-iteraties JS-sets JS-kaarten JS Typeof JS Type conversie JS Bitwise JS RegExp JS-fouten JS-bereik JS Hijsen JS strikte modus JS dit trefwoord JS-pijlfunctie JS-lessen JS JSON JS-foutopsporing JS-stijlgids JS-best practices JS-fouten JS-prestaties JS Gereserveerde Woorden

JS-versies

JS-versies JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge JS-geschiedenis

JS-objecten

Objectdefinities Objecteigenschappen Objectmethoden Objectweergave Objectaccessoires Objectconstructeurs Objectprototypes Object-Iterables Objectsets Objectkaarten Objectreferentie

JS-functies

Functiedefinities Functieparameters: Functie-aanroep Functie-oproep: Functie Toepassen Functie Sluitingen

JS-lessen

Klas Intro Klasse Overerving Klasse Statisch

JS Asynchrone

JS-callbacks JS asynchroon JS belooft JS Async/Wachten

JS HTML DOM

DOM Intro DOM-methoden DOM-document DOM-elementen DOM HTML DOM-formulieren DOM-CSS DOM-animaties DOM-evenementen DOM-gebeurtenisluisteraar DOM-navigatie DOM-knooppunten DOM-collecties DOM-knooppuntlijsten

JS-browserstuklijst

JS-venster JS-scherm JS-locatie JS-geschiedenis JS-navigator JS pop-upwaarschuwing JS-timing JS-koekjes

JS Web API's

Introductie web-API Web Forms API Webgeschiedenis-API Webopslag-API Web Worker-API Web Fetch-API Webgeolocatie-API

JS AJAX

Ajax-intro AJAX XMLHttp Ajax-verzoek Ajax-reactie AJAX XML-bestand AJAX PHP Ajax ASP AJAX-database AJAX-toepassingen Ajax-voorbeelden

JS JSON

JSON-intro JSON-syntaxis JSON versus XML JSON-gegevenstypen JSON ontleden JSON Stringify JSON-objecten JSON-arrays JSON-server JSON PHP JSON HTML JSON JSONP

JS versus jQuery

jQuery-kiezers jQuery HTML jQuery CSS jQuery DOM

JS-graphics

JS-graphics JS Canvas JS Plotly JS Chart.js JS Google-kaart JS D3.js

JS-voorbeelden

JS-voorbeelden JS HTML DOM JS HTML-invoer JS HTML-objecten JS HTML-evenementen JS-browser JS-editor JS-oefeningen JS-quiz JS-certificaat

JS-referenties

JavaScript-objecten HTML DOM-objecten


Zoeken in JavaScript-tekenreeks

JavaScript-zoekmethoden

  • String indexOf()
  • Tekenreeks lastIndexOf()
  • Tekenreeks begint met()
  • String eindigt met()

JavaScript-tekenreeks indexOf()

De indexOf()methode retourneert de index van (de positie van) het firstvoorkomen van een gespecificeerde tekst in een string:

Voorbeeld

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

Opmerking

JavaScript telt posities vanaf nul.

0 is de eerste positie in een string, 1 is de tweede, 2 is de derde, ...


JavaScript-tekenreeks lastIndexOf()

De lastIndexOf()methode retourneert de index van het laatste voorkomen van een opgegeven tekst in een tekenreeks:

Voorbeeld

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

Beide indexOf(), en lastIndexOf()retourneer -1 als de tekst niet wordt gevonden:

Voorbeeld

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

Beide methoden accepteren een tweede parameter als startpositie voor het zoeken:

Voorbeeld

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

De lastIndexOf()methode zoekt achteruit (van het einde naar het begin), wat betekent: als de tweede parameter is 15, begint de zoekopdracht op positie 15 en zoekt naar het begin van de string.

Voorbeeld

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

JavaScript-tekenreeks zoeken()

De search()methode zoekt in een tekenreeks naar een opgegeven waarde en retourneert de positie van de overeenkomst:

Voorbeeld

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

Is het je opgevallen?

De twee methoden, indexOf()en search(), zijn gelijk?

Ze accepteren dezelfde argumenten (parameters) en retourneren dezelfde waarde?

De twee methoden zijn NIET gelijk. Dit zijn de verschillen:

  • De search()methode kan geen tweede startpositieargument aannemen.
  • De indexOf()methode kan geen krachtige zoekwaarden (reguliere expressies) aannemen.

In een later hoofdstuk leert u meer over reguliere expressies.



JavaScript-tekenreeks match()

De methode match() zoekt in een tekenreeks naar een overeenkomst met een reguliere expressie en retourneert de overeenkomsten als een Array-object.

voorbeeld 1

Zoek een string voor "ain":

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

Lees meer over reguliere expressies in het hoofdstuk JS RegExp .

Opmerking

Als een reguliere expressie de g - modifier niet bevat (om een globale zoekopdracht uit te voeren), retourneert de match()-methode alleen de eerste overeenkomst in de tekenreeks.

Syntaxis

string.match(regexp)
regexp Required. The value to search for, as a regular expression.
Returns: An Array, containing the matches, one item for each match, or null if no match is found

Voorbeeld 2

Voer een globale, hoofdletterongevoelige zoekopdracht uit naar "ain":

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

JavaScript-tekenreeks bevat()

De includes()methode retourneert true als een tekenreeks een opgegeven waarde bevat.

Voorbeeld

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

Syntaxis

string.includes(searchvalue, start)
searchvalue Required. The string to search for
start Optional. Default 0. Position to start the search
Returns: Returns true if the string contains the value, otherwise false
JS Version: ES6 (2015)

Controleer of een tekenreeks "wereld" bevat, beginnend met zoeken op positie 12:

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

Browserondersteuning

includes()is een ES6-functie (JavaScript 2015).

Het wordt ondersteund in alle moderne browsers:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

includes()wordt niet ondersteund in Internet Explorer.


JavaScript-tekenreeks begint met()

De startsWith()methode retourneert true als een tekenreeks begint met een opgegeven waarde, anders false:

Voorbeeld

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

text.startsWith("Hello");

Syntaxis

string.startsWith(searchvalue, start)

Parameterwaarden

Parameter Description
searchvalue Required. The value to search for.
start Optional. Default 0. The position to start the search.

Voorbeelden

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

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

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

text.startsWith("world", 6)    // Returns true

Opmerking

De startsWith()methode is hoofdlettergevoelig.


Browserondersteuning

startsWith()is een ES6-functie (JavaScript 2015).

Het wordt ondersteund in alle moderne browsers:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

startsWith()wordt niet ondersteund in Internet Explorer.


JavaScript-tekenreeks eindigt met()

De endsWith()methode retourneert true als een tekenreeks eindigt met een opgegeven waarde, anders false:

Voorbeeld

Controleer of een string eindigt op "Doe":

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

Syntaxis

string.endswith(searchvalue, length)

Parameterwaarden

Parameter Description
searchvalue Required. The value to search for.
length Optional. The length to search.

Controleer de 11 eerste tekens van een string die eindigt op "world":

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

Opmerking

De endsWith()methode is hoofdlettergevoelig.


Browserondersteuning

endsWith()is een ES6-functie (JavaScript 2015).

Het wordt ondersteund in alle moderne browsers:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

endsWith()wordt niet ondersteund in Internet Explorer.


Volledige tekenreeksreferentie

Ga voor een volledige String-referentie naar onze:

Volledige JavaScript-stringreferentie .

De referentie bevat beschrijvingen en voorbeelden van alle tekenreekseigenschappen en -methoden.