I have the following:
if (referrer.indexOf("Ral") == -1) { ... }
What I like to do is to make Ral
case insensitive, so that it can be RAl
, rAl
, etc. and still match.
Is there a way to say that Ral
has to be case-insensitive?
I have the following:
if (referrer.indexOf("Ral") == -1) { ... }
What I like to do is to make Ral
case insensitive, so that it can be RAl
, rAl
, etc. and still match.
Is there a way to say that Ral
has to be case-insensitive?
Add .toUpperCase()
after referrer
. This method turns the string into an upper case string. Then, use .indexOf()
using RAL
instead of Ral
.
if (referrer.toUpperCase().indexOf("RAL") === -1) {
The same can also be achieved using a Regular Expression (especially useful when you want to test against dynamic patterns):
if (!/Ral/i.test(referrer)) {
// ^i = Ignore case flag for RegExp
Another options is to use the search method as follow:
if (referrer.search(new RegExp("Ral", "i")) == -1) { ...
It looks more elegant then converting the whole string to lower case and it may be more efficient.
With toLowerCase()
the code have two pass over the string, one pass is on the entire string to convert it to lower case and another is to look for the desired index.
With RegExp
the code have one pass over the string which it looks to match the desired index.
Therefore, on long strings I recommend to use the RegExp
version (I guess that on short strings this efficiency comes on the account of creating the RegExp
object though)
From ES2016 you can also use slightly better / easier / more elegant method (case-sensitive):
if (referrer.includes("Ral")) { ... }
or (case-insensitive):
if (referrer.toLowerCase().includes(someString.toLowerCase())) { ... }
Here is some comparison of .indexOf()
and .includes()
:
https://dev.to/adroitcoder/includes-vs-indexof-in-javascript
Use a RegExp:
if (!/ral/i.test(referrer)) {
...
}
Or, use .toLowerCase()
:
if (referrer.toLowerCase().indexOf("ral") == -1)
There are a couple of approaches here.
If you want to perform a case-insensitive check for just this instance, do something like the following.
if (referrer.toLowerCase().indexOf("Ral".toLowerCase()) == -1) {
...
Alternatively, if you're performing this check regularly, you can add a new indexOf()
-like method to String
, but make it case insensitive.
String.prototype.indexOfInsensitive = function (s, b) {
return this.toLowerCase().indexOf(s.toLowerCase(), b);
}
// Then invoke it
if (referrer.indexOfInsensitive("Ral") == -1) { ...
You can try this
str = "Wow its so COOL"
searchStr = "CoOl"
console.log(str.toLowerCase().includes(searchStr.toLowerCase()))
Example for any language:
'My name is Хведор'.toLocaleLowerCase().includes('ХвЕдОр'.toLocaleLowerCase())
Here are the options as per ES6 in decreasing order of performance
Includes
if (referrer.toLowerCase().includes("Ral".toLowerCase())) { ... }
IndexOf (this sometimes gives similar or better results than Includes)
if (referrer.toLowerCase().indexOf("Ral".toLowerCase()) !== -1) { ... }
Match
if (referrer.match(new RegExp("Ral", 'i'))) { ... }
Benchmark results: https://jsben.ch/IBbnl
if (referrer.toUpperCase().indexOf("RAL") == -1) { ...
To do a better search use the following code,
var myFav = "javascript";
var theList = "VB.NET, C#, PHP, Python, JavaScript, and Ruby";
// Check for matches with the plain vanilla indexOf() method:
alert( theList.indexOf( myFav ) );
// Now check for matches in lower-cased strings:
alert( theList.toLowerCase().indexOf( myFav.toLowerCase() ) );
In the first alert(), JavaScript returned "-1" - in other words, indexOf() did not find a match: this is simply because "JavaScript" is in lowercase in the first string, and properly capitalized in the second. To perform case-insensitive searches with indexOf(), you can make both strings either uppercase or lowercase. This means that, as in the second alert(), JavaScript will only check for the occurrence of the string you are looking for, capitalization ignored.
Reference, http://freewebdesigntutorials.com/javaScriptTutorials/jsStringObject/indexOfMethod.htm
It's 2016, and there's no clear way of how to do this? I was hoping for some copypasta. I'll have a go.
Design notes: I wanted to minimize memory usage, and therefore improve speed - so there is no copying/mutating of strings. I assume V8 (and other engines) can optimise this function.
//TODO: Performance testing
String.prototype.naturalIndexOf = function(needle) {
//TODO: guard conditions here
var haystack = this; //You can replace `haystack` for `this` below but I wan't to make the algorithm more readable for the answer
var needleIndex = 0;
var foundAt = 0;
for (var haystackIndex = 0; haystackIndex < haystack.length; haystackIndex++) {
var needleCode = needle.charCodeAt(needleIndex);
if (needleCode >= 65 && needleCode <= 90) needleCode += 32; //ToLower. I could have made this a function, but hopefully inline is faster and terser
var haystackCode = haystack.charCodeAt(haystackIndex);
if (haystackCode >= 65 && haystackCode <= 90) haystackCode += 32; //ToLower. I could have made this a function, but hopefully inline is faster and terser
//TODO: code to detect unicode characters and fallback to toLowerCase - when > 128?
//if (needleCode > 128 || haystackCode > 128) return haystack.toLocaleLowerCase().indexOf(needle.toLocaleLowerCase();
if (haystackCode !== needleCode)
{
foundAt = haystackIndex;
needleIndex = 0; //Start again
}
else
needleIndex++;
if (needleIndex == needle.length)
return foundAt;
}
return -1;
}
My reason for the name:
Why not...:
toLowerCase()
- potential repeated calls to toLowerCase on the same string.RegExp
- awkward to search with variable. Even the RegExp object is awkward having to escape charactersIf referrer
is an array, you can use findIndex()
if(referrer.findIndex(item => 'ral' === item.toLowerCase()) == -1) {...}
Here's my take:
Script:
var originalText = $("#textContainer").html()
$("#search").on('keyup', function () {
$("#textContainer").html(originalText)
var text = $("#textContainer").html()
var val = $("#search").val()
if(val=="") return;
var matches = text.split(val)
for(var i=0;i<matches.length-1;i++) {
var ind = matches[i].indexOf(val)
var len = val.length
matches[i] = matches[i] + "<span class='selected'>" + val + "</span>"
}
$("#textContainer").html(matches.join(""))
HTML:
<input type="text" id="search">
<div id="textContainer">
lorem ipsum is simply dummy text of the printing and typesetting industry. lorem ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of letraset sheets containing lorem ipsum passages, and more recently with desktop publishing software like Aldus pagemaker including versions of lorem ipsum.</div>