Js occurrence of a substring in a string. javascript methods for working with strings
Greetings to all readers of the blog site. In this article we will look at the built-in jscript object – String, which is responsible for text processing.
The js String internal class of the script server programming language provides methods for manipulating strings, such as substring searching, parsing, or replacement. It has one property length which returns the length of the string. It must be remembered that . There is no need to use the new keyword and String to declare a class.
Let's look at a simple example:
| // js String object // length_string.js //************************************* var s1, s2; s1 = "plain text" ; s2 = new String("plain text"); WScript.Echo(s1.length + " \n"+ s2.length) ; |
We see that here we have declared two variables s1 and s2, both store text value "simple text", by using length properties we determined their length. As you can see, you can use both a simplified format and a more cumbersome one (new keywords).
Let's look at the main methods of the String class.
Methods of the String JS class
s.charAt(index)– Get the character at the given index from s.
s.charCodeAt(index)– Extract the specified character code in the encoding Unicode through its index from s.
s1.concat(s2)– Concatenation (union) s1 and s2.
String.fromCharCode (c1,...,cN)- Generate a unicode string. Instead of symbols, we write codes Unicode.
| //************************************* // js String object // Formation of a string// fromCharCode_string.js //************************************* var MyResult; //return hello MyResult = String .fromCharCode (104 , 101 , 108 , 108 , 111 ) ; WScript.Echo(MyResult); |
s.indexOf(substr, startindex)– This method of the js String class allows you to search for the substring substring in the string s. The startindex parameter specifies the character number from which to start the search if this parameter missing, the search is performed from the very beginning. The process itself occurs from left to right. indexOf returns a number - the index of the character starting from which the occurrence was found; if nothing is found, then the value -1 will be returned. Let's not forget that character numbering starts from zero.
| //************************************* // js String object // Search in string // indexOf_string.js //************************************* var MyStr= "one, two, three and four", MyResult; MyResult= MyStr.indexOf("two", 2); WScript.Echo(MyResult); |
s.lastIndexOf(substr, startindex)– Similar to indexOf, but we will search in reverse order.
s.match(rgExp)– This js method of the String class allows you to search for s in text using regular expressions (rgExp). As a result, an array containing the result will be obtained. The first element of the array is the found text, the second is the substring corresponding to the first subexpression, the third is the substring corresponding to the second subexpression, and so on. For example, we will consider a script that parses url addresses.
| //************************************* // String js // parsing url addresses// match_string.js //************************************* var url = /(\w+):\/\/([\w.]+)\/(\S*)/ ; var text = "Internet page http://www.site/~vladimir"; var result = text.match (url) , index, list= "" if (result != null ) ( for (var index in result) ( list+= result[ index] + " \n"; ) ) WScript.Echo (list) ; |
s.slice(start, )– Get part from text s, parameters start And end specify the starting and ending positions, respectively, and are integers.
s.split(str)– Break the text s into substrings and write them as . The str parameter specifies a symbolic sign that indicates the start of the partition. At the output we get an array.
| //************************************* // String js object // parse strings into array// split_string.js //************************************* var MyStr2, MyResult1, index, list= "" ; MyStr2 = "first, second, third, fourth"; MyResult1 = MyStr2.split (", " ) ; for (var index in MyResult1) ( list+= MyResult1[ index] + " \n"; ) WScript.Echo (list) ; |
s.substr(start[, length])– Similar to slice, but here we indicate not the ending index, but the length.
s.substring(index1, index2)– Allows you to get a substring from a given string s. substring does not change the original value. The parameters specify the positions of the start and end characters.
A string is a sequence of one or more characters that can contain letters, numbers, and other symbols. In JavaScript, it is the simplest immutable data type.
Strings allow you to display and manipulate text, and text is the primary way to communicate and transmit information on the web. Therefore, strings are one of the main concepts of programming.
This tutorial will teach you how to create and view string output, concatenate strings and store them in variables. You'll also learn about the rules for using quotes, apostrophes, and newlines in JavaScript.
Creating and viewing a string
There are three ways to create a string in JavaScript: they can be written inside single quotes (‘), double quotes (‘), or backticks (`). Although scripts sometimes contain all three types of strings, only one type of quotation mark should be used within a single line.
Single- and double-quoted strings are essentially the same thing. There are no conventions regarding the use of one type of quotation marks or another, but it is generally recommended to use one type consistently in program scripts.
"This string uses single quotes.";
"This string uses double quotes.";
Third and newest way creating a string is called a template literal. Template literals are written inside backquotes (also called a backtick) and work just like regular strings with multiple additional functions which we will look at in this article.
`This string uses backticks.`;
The easiest way to view the output of a string is to enter it into the console using console.log().
console.log("This is a string in the console.");
This is a string in the console.
To others in a simple way to request the value of a string is a popup window in the browser that can be called using alert():
alert("This is a string in an alert.");
This line will open a notification window in the browser with the following text:
This is a string in an alert.
The alert() method is used less frequently because alerts need to be closed constantly.
Storing Strings in Variables
Variables in JavaScript are named containers that store values using keywords var, const or let. Strings can be assigned to variables.
const newString = "This is a string assigned to a variable.";
The newString variable now contains a string that can be referenced and displayed using the console.
console.log(newString);
This is a string assigned to a variable.
By assigning strings to variables, you don't have to retype the string each time you want to output it, making it easier to work with strings within programs.
String concatenation
String concatenation is the process of combining two or more strings into one new string. Concatenation is done using the + operator. The + symbol is also the addition operator in mathematical operations.
For example, try concatenating two short strings:
"Sea" + "horse";
Seahorse
Concatenation joins the end of one string to the beginning of another string without inserting spaces. To have a space between lines, it must be added to the end of the first line.
"Sea" + "horse";
Sea horse
Concatenation allows you to combine strings and variables with string values.
const favePoem = "My favorite poem is " + poem + " by " + author ".";
The new strings resulting from concatenation can be used in the program.
Variables with template literals
One of the features of template literals is the ability to include expressions and variables in the string. Instead of concatenation, you can use the $() syntax to insert a variable.
const poem = "The Wide Ocean";
const author = "Pablo Neruda";
const favePoem = `My favorite poem is $(poem) by $(author).`;
My favorite poem is The Wide Ocean by Pablo Neruda.
This syntax allows you to get the same result. Template literals make string concatenation easier.
String literals and string values
As you may have noticed, all strings are written in quotes or backquotes, but when output, the string does not contain quotes.
"Beyond the Sea";
Beyond the Sea
A string literal is a string as it appears in source code, including quotes. The string value is the string that appears in the output (without the quotes).
IN in this example"Beyond the Sea" is a string literal, and Beyond the Sea is a string value.
Traversing quotes and apostrophes in strings
Because quotation marks are used to denote strings, there are special rules for using apostrophes and quotation marks in strings. For example, JavaScript will interpret an apostrophe in the middle of a single-quoted string as a closing single quote, and attempt to read the rest of the intended string as code.
Consider this example:
const brokenString = "I"m a broken string";
console.log(brokenString);
unknown: Unexpected token (1:24)
The same thing will happen if you try to use double quotes inside a string enclosed in double quotes. The interpreter will not notice the difference.
To avoid such errors, you can use:
- Different string syntax.
- Escape symbols.
- Template literal.
Alternative string syntax
The easiest way to get around this problem is to use the opposite syntax to the one you use in the script. For example, put strings with apostrophes in double quotes:
"We"re safely using an apostrophe in double quotes."
Strings with quotes can be enclosed in single quotes:
"Then he said, "Hello, World!";
By combining single and double quotes, you can control the display of quotes and apostrophes within strings. However, this will affect the consistency of the syntax in the project files, making them difficult to maintain.
Escape character \
By using a backslash, JavaScript will not interpret quotes as closing quotes.
The combination \' will always be treated as an apostrophe and \" as double quotes, no exceptions.
This allows apostrophes to be used in single-quoted strings and quotations to be used in double-quoted strings.
"We\"re safely using an apostrophe in single quotes.\"
"Then he said, \"Hello, World!\"";
This method looks a bit messy. But it is necessary if the same line contains both an apostrophe and double quotes.
Template literals
Template literals are defined by backquotes, so both double quotes and apostrophes can be safely used without any additional manipulation.
`We"re safely using apostrophes and "quotes" in a template literal.`;
Template literals not only avoid errors when displaying quotes and apostrophes, but also provide support for inline expressions and multiline blocks, as discussed in the next section.
Multiline lines and newline
In some situations there is a need to insert a symbol new line or line break. The escape characters \n or \r will help insert a new line into the code output.
const threeLines = "This is a string\nthat spans across\nthree lines.";
This is a string
that spans across
three lines.
This will split the output into multiple lines. However, if the code contains long lines, they will be difficult to work with and read. To display one string on multiple lines, use the concatenation operator.
const threeLines = "This is a string\n" +
"that spans across\n" +
"three lines.";
You can also escape a newline using the escape character \.
const threeLines = "This is a string\n\
that spans across\n\
three lines.";
Note: This method is not recommended as it may cause problems in some browsers.
To make your code readable, use template literals. This eliminates concatenation and escape characters.
const threeLines = `This is a string
that spans across
three lines.`;
This is a string
that spans across
three lines.
Because different code bases may use different standards, it is important to know all the ways to break on a new line and create multiline strings.
Conclusion
Now you know the basic principles of working with strings in JavaScript, you can create strings and template literals, perform concatenation and traversal, and assign strings to variables.
Tags:Hello everyone and happy new year. Let's go! We'll start by looking at the length property, which allows us to count the number of characters in a string:
Var str = "methods and properties for working with strings in javaScript"; console.log(str.length);
As you can see, the console displays the result, the number of characters in the line (54).
Var str = "methods and properties for working with strings in javaScript"; console.log(str.charAt(7));
Using the charAt() method, we can get a string character at a given position; in our case, we get the “and” character at the 7th position. Note that the line position report starts from zero. For example, if we want to get the first character of a string:
Var str = "methods and properties for working with strings in javaScript"; str.charAt(0);
here we will get back "m". There is also a similar method charCodeAt() IT WORKS EXACTLY AS charAt(), but it returns not the character itself, but its code.
Var str = "methods and properties for working with strings in javaScript"; console.log(str.charCodeAt(0));
The code for the character "m" (1084) will be returned to us.
The charAt() method is useful for extracting a single character from a string, but if we want to get a set of characters (substring), then the following methods are suitable for this purpose:
Var str = "methods and properties for working with strings in javaScript"; console.log(str.slice(8,17));
the slice() method returns a substring ("properties"), takes two as arguments numeric values, the starting and ending index of the substring. Another similar method is substr():
Var str = "methods and properties for working with strings in javaScript"; console.log(str.substr(8,17));
here we will already get a substring (“properties for slave”), the first argument is the starting position, and the second is the number of characters in the substring. Next we will look at methods for working with case in strings.
Var str = "methods and properties for working with strings in javaScript"; console.log(str.toUpperCase());
the toUpperCase() method returns us a string where all characters are in uppercase, that is, in capital letters.
Var str = "MBA"; console.log(str.toLowerCase());
the toLowerCase() method returns us a string where all characters are lowercase, small letters.
To find a substring in a string, we can use the indexOf() method:
Var str = "methods and properties for working with strings in javaScript"; document.write(str.indexOf("works"));
this method takes as an argument the substring we want to find in the string and if it finds it, then the position at which the match was found is returned. If this substring is not contained in the string, then:
Var str = "methods and properties for working with strings in javaScript"; document.write(str.indexOf("work"));
we will get the value -1. Example:
Var str = "methods and properties for working with strings in javaScript", sub = "work"; function indexOf(str, substr) ( if (str.indexOf(substr) === -1) ( return "This substring ""+substr+"" is not contained in the string ""+str+"""; ) else( index = str.indexOf(substr) return "Substring ""+substr+"" found at position "+index; ) ) document.write(indexOf(str,sub));
here we wrote down small function indexOf(str,sub) which takes a string(str) and a substring(sub) as arguments and, using the indexOf() method, checks for the presence of a substring in the string and returns a message about the result. I note that the indexOf() method returns the position of the substring relative to the beginning of the string, that is, from index zero.
If we want to find the position of a substring relative to the end, then we can use the lastIndexOf() function.
The trim() method allows you to remove spaces from the beginning and end of a string, let's say we have the following string:
Var str = "methods and properties for working with strings in javaScript"; console.log(str);
and we want to remove spaces at the beginning and end:
Console.log(str.trim());
after we use the trim() method, the spaces from the end and beginning of the string will be successfully removed.
Well, that’s basically all I wanted to tell you about working with strings in JavaScript. Of course, there are also methods for concatenating and comparing strings, but we won’t consider them, since these methods are easily replaced by standard operators.
I congratulate you on the upcoming New Year, I wish you happiness, health, success, love and of course good luck! Bye!
When you write JavaScript, very often you have to surf the Internet in search of information about the syntax and parameters for methods that work with strings.
I've read a lot of articles on working with strings. This post will show examples and brief descriptions the most common methods for working with strings. I tried to put the most common methods at the top for quick reference.
Of course, most experienced developers will already be quite familiar with many of the techniques, but I think this good list for beginners to understand the range of techniques that can help perform complex operations with simple means.
Converting to String
You can convert a number, boolean expression, or object to a string:
Var myNumber = 24; // 24 var myString = myNumber.toString(); // "24"
You can do it the same way with String():
Var myNumber = 24; // 24 var myString = String(myNumber); // "24"
If you are not sure what the value is not null or undefined, you can use String(), which always returns a string, regardless of the value type.
Splitting a string into substrings
To split strings into an array of substrings you can use the method split():
Var myString = "coming,apart,at,the,commas"; var substringArray = myString.split(","); // ["coming", "apart", "at", "the", "commas"] var arrayLimited = myString.split(",", 3); // ["coming", "apart", "at"]
As seen in last line, the second parameter of the function is the limit on the number of elements that will be in the final array.
Getting the length of a string
To find how many characters there are in a string, we use the property length:
Var myString = "You"re quite a character."; var stringLength = myString.length; // 25
Finding a substring in a string
There are two methods to search for a substring:
Usage indexOf():
Var stringOne = "Johnny Waldo Harrison Waldo"; var wheresWaldo = stringOne.indexOf("Waldo"); // 7
indexOf() The method starts searching for a substring from the beginning of the string, and returns the position of the beginning of the first occurrence of the substring. IN in this case— 7th position.
Usage lastIndexOf():
Var stringOne = "Johnny Waldo Harrison Waldo"; var wheresWaldo = stringOne.lastIndexOf("Waldo"); // 22
The method returns the starting position of the last occurrence of a substring in a string.
Both methods return -1 if the substring is not found, and both take an optional second argument indicating the position in the string where you want the search to begin. So if the second argument is "5", indexOf() starts the search from character 5, ignoring characters 0-4, while lastIndexOf() starts the search at character 5 and works backwards, ignoring characters 6 and beyond.
Substring replacement
To replace an occurrence of a substring in a string with another substring, you can use replace():
Var slugger = "Josh Hamilton"; var betterSlugger = slugger.replace("h Hamilton", "e Bautista"); console.log(betterSlugger); // "Jose Bautista"
The first argument is what you want to replace and the second argument is the newline. The function replaces only the first occurrence of a substring in a string.
To replace all occurrences, you need to use regular expression with global flag:
Var myString = "She sells automotive shells on the automotive shore"; var newString = myString.replace(/automotive/g, "sea"); console.log(newString); // "She sells sea shells on the sea shore"
The second argument may include a special template or function. You can read more.
Get a character at a given position in a string
We can get the symbol using the function charAt():
Var myString = "Birds of a Feather"; var whatsAtSeven = myString.charAt(7); // "f"
As is often the case in JavaScript, the first position in the string starts at 0, not 1.
As an alternative function you can use charCodeAt() function, which is the character code.
Var myString = "Birds of a Feather"; var whatsAtSeven = myString.charCodeAt(7); // "102" var whatsAtEleven = myString.charCodeAt(11); // "70"
Note that the code for the "F" character (position 11) is different than the "f" character (position 7).
Concatenating Strings
In most cases, you can use the "+" operator to concatenate strings. But you can also use the method concat():
Var stringOne = "Knibb High football"; var stringTwo = stringOne.concat("rules."); // "Knibb High football rules"
In this way we can combine many lines into one in the order in which they are written:
Var stringOne = "Knibb"; var stringTwo = "High"; var stringThree = "football"; var stringFour = "rules."; var finalString = stringOne.concat(stringTwo, stringThree, stringFour); console.log(finalString); // "Knibb high football rules."
Substring extraction
There are 3 ways to get a string from part of another string:
Using slice():
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.slice(5, 10); // "fghij"
Using substring():
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.substring(5, 10); // "fghij"
In both functions, the first parameter is the character at which the substring begins (starting from position 0) and the second argument (optional) is the position of the character up to which the substring is returned. The example (5, 10) returns the string between positions 5 and 9.
Using substr():
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.substr(5, 10); // "fghijklmno"
The first argument is the position of the character at which the new line begins and the second argument is the number of characters from the starting position of the new line. Those. (5, 10) returns 10 characters, starting at position 5.
Convert a string to upper or lower case.
There are 4 methods for translation. The first 2 convert the string to uppercase:
Var stringOne = "Speak up, I can"t hear you."; var stringTwo = stringOne.toLocaleUpperCase(); // "SPEAK UP, I CAN"T HEAR YOU" var stringThree = stringOne.toUpperCase(); // "SPEAK UP, I CAN"T HEAR YOU"
The other 2 convert the string to lowercase:
Var stringOne = "YOU DON"T HAVE TO YELL"; var stringTwo = stringOne.toLocaleLowerCase(); // "you don"t have to yell" var stringThree = stringOne.toLowerCase(); // "you don"t have to yell"
It's better to use "locale" methods, because... in different places, for example, in Turkey, the display of registers does not work quite the way we are used to and therefore the result may be the one we wanted. If you use “locale” methods, then there will be no such problems.
Pattern Matching
Pattern matching on a string can be done using 2 methods, which work differently.
Method match() is applied to a string and it takes a regular expression as a parameter:
Var myString = "How much wood could a wood chuck chuck"; var myPattern = /.ood/; var myResult = myString.match(myPattern); // ["wood"] var patternLocation = myResult.index; // 9 var originalString = myResult.input // "How much wood could a wood chuck chuck"
Method exec() applied to a regular expression object and takes the string as a parameter:
Var myString = "How much wood could a wood chuck chuck"; var myPattern = /.huck/; var myResult = myPattern.exec(myString); // ["chuck"] var patternLocation = myResult.index; // 27 var originalString = myResult.input // "How much wood could a wood chuck chuck"
In both methods, only the first match is returned. If there are no matches, it returns null.
You can also use the method search() which takes a regular expression and returns the position of the first match in the pattern:
Var myString = "Assume"; var patternLocation = myString.search(/ume/); // 3
If there were no matches, “ -1 «.
Comparing two strings for sorting
You can compare 2 strings to determine which comes first in the alphabet. To do this, we will use the method localeCompare() which returns 3 possible values:
Var myString = "chicken"; var myStringTwo = "egg"; var whichCameFirst = myString.localeCompare(myStringTwo); // -1 (Chrome returns -2) whichCameFirst = myString.localeCompare("chicken"); // 0 whichCameFirst = myString.localeCompare("apple"); // 1 (Chrome returns 2)
As shown above, negative number returned if the string argument comes after the original string. A positive number if the string argument comes before the original string. If returned 0 - means the lines are equal.
To check the return value it is better to use if (result< 0), чем if (result === -1). Последнее не будет работать в Chrome.
Thank you for your attention, I hope that you learned a lot of new and interesting things!
Author of the article: Alex. Category:Date of publication: 03/19/2013
Task . Search and replace
Task. Given a string "aaa@bbb@ccc". Replace everything @ on "!" by using global search and replace.
Solution: in this case, you need to use the replace method, which performs a search and replace. However, with simple use case, this method will find and replace only the first match:
Var str = "aaa@bbb@ccc"; alert(str.replace("@", "!")); //get "aaa!bbb@ccc"
To replace all matches, we use global search using regular expression:
Var str = "aaa@bbb@ccc"; alert(str.replace(/@/g, "!")); //get "aaa!bbb!ccc"
Task . Methods substr, substring, slice
Task. Given a string "aaa bbb ccc". Cut a word out of it "bbb" three in different ways(via substr, substring, slice).
Solution: word "bbb" starts with character number 4 (numbering from zero), and ends with character number 6. Let's use the indicated methods:
Var str = "aaa bbb ccc"; alert(str.substr(4, 3)); //substr(where to cut, how much to cut) alert(str.substring(4, 7)); //substring(from where to cut, to where to cut) alert(str.slice(4, 7)); //slice(where to cut from, where to cut to)
Please note that in the methods substring And slice the second parameter must be 1 greater than the character that we want to remove (that is, if we specify the number 7, then the cutting will occur up to the 6th character inclusive).
Task . Date format conversion
Task. In variable date the date is in the format "2025-12-31" "31/12/2025" .
Solution: using the split method we will split our string "2025-12-31" to array by separator "-" , in this case the zero element will contain the year, the first - the month, and the second - the day:
Var str = "2025-12-31"; var arr = split("-"); alert(arr);//get the array ["2025", "12", "31"]
Now, turning to different elements array by their keys, we will form the string we need:
Var str = "2025-12-31"; var arr = split("-"); var newStr = arr + "/" + arr + "/"+arr; alert(newStr); //get the string "12/31/2025"
Problems to solve
Working with character case
Given a string "js". Make it a string "JS".
Given a string "JS". Make it a string "js".
Working with length, substr, substring, slice. Working with indexOf
Given a string "I'm learning javascript!". Find number of characters in this line.
Given a string "I'm learning javascript!". Find the position of the substring "I'm teaching".
Given a variable str, which stores some text. Implement trimming of long text according to the following principle: if the number of characters of this text is greater than specified in the variable n, then into the variable result let's write down the first ones n characters of the string str and add an ellipsis "..." at the end. Otherwise, into a variable result write the contents of the variable str.
Working with replace
Given a string "I'm-learning-javascript!". Replace everything hyphens on "!" by using global search and replace.
Working with split
Given a string "I'm learning javascript!". Using the method split write each word of this line in separate array element.
Given a string "I'm learning javascript!". Using the method split write each character of this string to separate element array.
In variable date the date is in the format "2025-12-31" . Convert this date to format "31.12.2025" .
Working with join
Given an array ["I", "teach", "javascript", "!"]. Using the method join convert array to string "I'm+learning+javascript+!".
Tasks
Convert first letter strings to uppercase.
Convert the first letter every word strings to uppercase.
Convert String "var_test_text" V "varTestText". The script, of course, should work with any similar strings.
Some videos may get ahead of themselves, as we haven’t covered all of ES6 yet at this point in the tutorial. Just skip these videos and watch them later.