Splitting strings with javascript

JavaScript String Methods

String search methods are covered in the next chapter.

JavaScript String Length

The length property returns the length of a string:

Example

Extracting String Parts

There are 3 methods for extracting a part of a string:

JavaScript String slice()

slice() extracts a part of a string and returns the extracted part in a new string.

The method takes 2 parameters: start position, and end position (end not included).

Example

Slice out a portion of a string from position 7 to position 13:

Note

JavaScript counts positions from zero.

Читайте также:  Html select multiple bootstrap

Examples

If you omit the second parameter, the method will slice out the rest of the string:

If a parameter is negative, the position is counted from the end of the string:

This example slices out a portion of a string from position -12 to position -6:

JavaScript String substring()

substring() is similar to slice() .

The difference is that start and end values less than 0 are treated as 0 in substring() .

Example

If you omit the second parameter, substring() will slice out the rest of the string.

JavaScript String substr()

substr() is similar to slice() .

The difference is that the second parameter specifies the length of the extracted part.

Example

If you omit the second parameter, substr() will slice out the rest of the string.

Example

If the first parameter is negative, the position counts from the end of the string.

Example

Replacing String Content

The replace() method replaces a specified value with another value in a string:

Example

Note

The replace() method does not change the string it is called on.

The replace() method returns a new string.

The replace() method replaces only the first match

If you want to replace all matches, use a regular expression with the /g flag set. See examples below.

By default, the replace() method replaces only the first match:

Example

let text = «Please visit Microsoft and Microsoft!»;
let newText = text.replace(«Microsoft», «W3Schools»);

By default, the replace() method is case sensitive. Writing MICROSOFT (with upper-case) will not work:

Example

To replace case insensitive, use a regular expression with an /i flag (insensitive):

Example

Note

Regular expressions are written without quotes.

To replace all matches, use a regular expression with a /g flag (global match):

Example

let text = «Please visit Microsoft and Microsoft!»;
let newText = text.replace(/Microsoft/g, «W3Schools»);

Note

You will learn a lot more about regular expressions in the chapter JavaScript Regular Expressions.

JavaScript String ReplaceAll()

In 2021, JavaScript introduced the string method replaceAll() :

Example

The replaceAll() method allows you to specify a regular expression instead of a string to be replaced.

If the parameter is a regular expression, the global flag (g) must be set, otherwise a TypeError is thrown.

Example

Note

replaceAll() is an ES2021 feature.

replaceAll() does not work in Internet Explorer.

Converting to Upper and Lower Case

A string is converted to upper case with toUpperCase() :

A string is converted to lower case with toLowerCase() :

JavaScript String toUpperCase()

Example

JavaScript String toLowerCase()

Example

let text1 = «Hello World!»; // String
let text2 = text1.toLowerCase(); // text2 is text1 converted to lower

JavaScript String concat()

concat() joins two or more strings:

Example

The concat() method can be used instead of the plus operator. These two lines do the same:

Example

Note

All string methods return a new string. They don’t modify the original string.

Strings are immutable: Strings cannot be changed, only replaced.

JavaScript String trim()

The trim() method removes whitespace from both sides of a string:

Example

JavaScript String trimStart()

ECMAScript 2019 added the String method trimStart() to JavaScript.

The trimStart() method works like trim() , but removes whitespace only from the start of a string.

Example

JavaScript String trimStart() is supported in all modern browsers since January 2020:

JavaScript String trimEnd()

ECMAScript 2019 added the string method trimEnd() to JavaScript.

The trimEnd() method works like trim() , but removes whitespace only from the end of a string.

Example

JavaScript String trimEnd() is supported in all modern browsers since January 2020:

JavaScript String Padding

ECMAScript 2017 added two new string methods to JavaScript: padStart() and padEnd() to support padding at the beginning and at the end of a string.

JavaScript String padStart()

The padStart() method pads a string from the start.

It pads a string with another string (multiple times) until it reaches a given length.

Examples

Pad a string with «0» until it reaches the length 4:

Pad a string with «x» until it reaches the length 4:

Note

The padStart() method is a string method.

To pad a number, convert the number to a string first.

Example

Browser Support

It is supported in all modern browsers:

padStart() is not supported in Internet Explorer.

JavaScript String padEnd()

The padEnd() method pads a string from the end.

It pads a string with another string (multiple times) until it reaches a given length.

Examples

Note

The padEnd() method is a string method.

To pad a number, convert the number to a string first.

Example

Browser Support

It is supported in all modern browsers:

padEnd() is not supported in Internet Explorer.

Extracting String Characters

There are 3 methods for extracting string characters:

JavaScript String charAt()

The charAt() method returns the character at a specified index (position) in a string:

Example

JavaScript String charCodeAt()

The charCodeAt() method returns the unicode of the character at a specified index in a string:

The method returns a UTF-16 code (an integer between 0 and 65535).

Example

Property Access

ECMAScript 5 (2009) allows property access [ ] on strings:

Example

Note

Property access might be a little unpredictable:

  • It makes strings look like arrays (but they are not)
  • If no character is found, [ ] returns undefined, while charAt() returns an empty string.
  • It is read only. str[0] = «A» gives no error (but does not work!)

Example

Converting a String to an Array

If you want to work with a string as an array, you can convert it to an array.

JavaScript String split()

A string can be converted to an array with the split() method:

Example

text.split(«,») // Split on commas
text.split(» «) // Split on spaces
text.split(«|») // Split on pipe

If the separator is omitted, the returned array will contain the whole string in index [0].

If the separator is «», the returned array will be an array of single characters:

Example

Complete String Reference

For a complete String reference, go to our:

The reference contains descriptions and examples of all string properties and methods.

Источник

split()

split() — метод разбивает строку на массив строк используя для этого заданный разделитель.

Синтаксис

separator — условие по которому будет разделена строка. В качестве разделителя может выступать строковый литерал или регулярное выражение. Также можно использовать специальные символы, например перевод строки, кавычки или юникод. Параметр является необязательным.

limit — количество элементов, которые должен вернуть метод. Параметр необязательный, если пропустить в массив попадут все подстроки. Если задать, то split() все-равно разделит всю строку по разделителям, но возвратит только указанное количество.

При нахождении разделителя метод удаляет separator и возвращает подстроку.

Если задать в качестве разделителя пустое значение » , тогда каждый символ строки запишется в отдельный элемент массива.

Если при записи split() пропустить separator , то метод вернет массив с одним элементом, который будет содержать всю строку.

Разбить строку по разделителю

 let mySkills = 'Native JavaScript-React-HTML-CSS' mySkills = mySkills.split('-', 2) console.log(mySkills) 

Результатом будет массив с двумя элементами: Native JavaScript и React

Разбить строку на символы

 let myDream = 'Хочу стать frontend разработчиком' let allSymbols = myDream.split('') for (let n = 0; n

Здесь мы разделили строку myDream с помощью split(») , задав в качестве separator пустое значение. Все это записали в allSymbols — теперь там массив, где каждый элемент это символ нашей строки. Далее используя цикл for вывели в console все символы — каждый с новой строки.

Разбить строку используя регулярное выражение

 let topProgramLang = 'JavaScript-Python-Java-C++,PHP,C,C#' topProgramLang = topProgramLang.split(/,|-/) console.log(topProgramLang) 

/,|-/ в этом регулярном выражении мы указали разделители, которые необходимо учесть — запятая и дефис. В итоге получаем массив, где перечислены все языки программирования указанные изначально.

Вывести символы строки в обратном порядке

 let importanceSkills = 'React,TypeScript,CSS,HTML,JavaScript' importanceSkills = importanceSkills.split(',') importanceSkills = importanceSkills.reverse() importanceSkills = importanceSkills.join(', ') console.log(importanceSkills) 

Для того, чтобы решить эту задачу нам понадобятся еще два метода reverse() и join() . Первый перевернет массив, а второй объединит элементы в строку. В итоге получим в console JavaScript, HTML, CSS, TypeScript, React

Сумма элементов массива

 let numForSum = '1,2,5,10,392,19,3,10' numForSum = numForSum.split(',') let sumNum = 0 for (let n = 0; n < numForSum.length; n++) < sumNum += +(numForSum[n]) >console.log(sumNum) 

Выполняя подобные задачи стоит помнить, что метод split() записывает данные в массив в формате строки, поэтому перед тем, как складывать элементы необходимо сначала привести их к числу. Здесь это сделано с помощью + перед выражением. Также можно воспользоваться функцией Number(numForSum[n]) .

Итого

1. Метод split() делит строку по разделителю и записывает все в массив.

2. В получившемся массиве, элементы хранятся в формате текст.

3. В параметрах метода, первым свойством задается разделитель, вторым ограничение на вывод элементов. Оба параметра не обязательны.

Skypro — научим с нуля

Источник

JavaScript String split()

The split() method splits a string into an array of substrings.

The split() method returns the new array.

The split() method does not change the original string.

If (» «) is used as separator, the string is split between words.

See Also

Syntax

Parameters

Parameter Description
separator Optional.
A string or regular expression to use for splitting.
If omitted, an array with the original string is returned.
limit Optional.
An integer that limits the number of splits.
Items after the limit are excluded.

Return Value

More Examples

Split a string into characters and return the second character:

Use a letter as a separator:

If the separator parameter is omitted, an array with the original string is returned:

Browser Support

split() is an ECMAScript1 (ES1) feature.

ES1 (JavaScript 1997) is fully supported in all browsers:

Chrome Edge Firefox Safari Opera IE
Yes Yes Yes Yes Yes Yes

Unlock Full Access 50% off

COLOR PICKER

colorpicker

Join our Bootcamp!

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials
Top References
Top Examples
Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

Оцените статью