Удалить все пробелы из строки в JavaScript
В этом посте мы обсудим, как удалить все пробельные символы из строки в JavaScript.
Решение должно удалить из строки все символы новой строки, символы табуляции, пробелы или любые другие пробельные символы.
1. Использование регулярных выражений
Нет собственного метода JavaScript replaceAll() , который заменяет все экземпляры символа заменой. Общая стратегия замены шаблона в заданной строке заключается в использовании replace() метод, который может принимать RegExp объект.
Вот рабочий пример, который заменяет все пробелы в строке пустой строкой (включая начальные, конечные и несколько последовательных пробелов). g переключатель в регулярном выражении выполняет поиск и замену по всей строке.
Строковые функции в JavaScript
Строка — один из основных типов данных в JS. Сегодня я расскажу тебе о типе данных String и встроенных строковых функциях в JavaScript.
В JavaScript, все текстовые данные — это строки. Не важно, состоит твой текст из одного или десяти тысяч символов. Все это — строки.
Длину JavaScript строки ты можешь получить из поля length .
Второй важный пункт стоит выделить отдельно:
JavaScript строка не изменяется после создания. Функции вроде replace или slice , вернут тебе новую строку, а оригинальная строка останется без изменений.
Обзор встроенных функций String в JavaScript
Во всех примерах, я буду считать, что ты объявил строку s как константу со значением I am going to become a FULL STACK JS Dev with Coderslang .
Как проверить включает ли одна строка другую
Чтобы проверить вхождение одной строки в другую в JavaScript существует встроенная функция includes .
Она вернет true или false в зависимости от результата проверки.
То же самое можно сделать иначе. Чтобы узнать есть ли какое-то слово в строке, ты можешь использовать функции indexOf или lastIndexOf . Они обе проверяют, включает ли основная строка искомую строку и вернут индекс элемента с которого начинается совпадение. А если совпадений не будет, то они обе вернут -1 .
Отличие indexOf от lastIndexOf становится очевидным, когда в основной строке несколько вхождений искомой подстроки.
- indexOf ищет с начала строки
- lastIndexOf ищет с конца строки
Это отличие определяет и результат.
В любом случае, ты можешь использовать indexOf и lastIndexOf чтобы определить, включает ли одна строка другую в JavaScript. Если результат отличается от -1 , то да, совпадение найдено. Иначе — совпадений нет
Как определить начинается ли одна строка с другой строки
Чтобы узнать, стоит ли одна строка в начале другой строки в JavaScript существует функция startsWith . Она возвращает true если основная строка начинается со строки аргумента, иначе — false .
Как определить заканчивается ли одна строка другой строкой
Чтобы проверить вхождение одной строки в конце другой строки в JS существует функция endsWith . Она работает почти так же как и startsWith , но проверяет окончание строки, а не начало.
Как удалить пробелы в начале и конце JavaScript строки
Чтобы удалить лишние пробелы в начале или конце JS строки ты можешь воспользоваться этими функциями:
- trimStart — удаляет пробелы в начале строки
- trimEnd — удаляет пробелы в конце строки
- trim — удаляет пробелы в начале и конце строки
В нашей базовой строке не было пробелов, поэтому давай создадим новую для демонстрации.
Как перевести всю JS строку в ВЕРХНИЙ или нижний регистр
Чтобы получить строку идентичную данной, но со всеми буквами в верхнем регистре, ты можешь использовать функцию toUpperCase , а для нижнего регистра toLowerCase .
Опять-таки, обрати внимание, что строка s не меняется, потому что все строки в JavaScript неизменяемы. Функции toUpperCase и toLowerCase возвращают новую строку, которая содержит все требуемые изменения.
Как заменить один символ на другой в JavaScript строке
Чтобы сделать замену символа в JS строке, ты можешь использовать функцию replace . Передай в нее две строки, и она заменит первое вхождения первой строки (в базовой строке) на вторую строку.
Если ты удивлен, что replace меняет только один символ — это нормально. Просто это базовый сценарий.
Чтобы сделать замену всех символов (или подстрок), тебе нужна функция replaceAll .
Обрати внимание, что в зависимости от того, где ты запускаешь код, может иногда появиться ошибка.
TypeError: s.replaceAll is not a function
Если ты получил такую ошибку, то функция replaceAll не поддерживается твоим JavaScript окружением и ты можешь использовать регулярное выражение с флагом g . Так обычный replace сработает как replaceAll .
Методы строк в JavaScript: простая шпаргалка с примерами
Любые текстовые данные в JavaScript считаются строками. Это примитивный тип, но язык позволяет работать с ним так, будто он является объектом. В том числе — использовать встроенные в JS методы строк, которые собраны в этой шпаргалке.
Важно: при использовании методов создаётся новая строка, которая записывается в ту же переменную вместо старой строки.
Как изменить регистр
toLowerCase
Преобразует символы в строке в нижний регистр.
toUpperCase
Преобразует символы в строке в верхний регистр.
Как объединить строки
concat
Объединяет две или более строки и возвращает одну строку.
Как разделить строку на подстроки
split
Разбивает строку в массив по указанному разделителю, которым может быть подстрока или регулярное выражение. Вторым параметром можно указать ограничитель.
Как повторить строку
repeat
Принимает в качестве параметра число и повторяет строку указанное количество раз.
Как найти подстроку
charAt
Возвращает символ по указанному индексу.
includes
Проверяет, содержит ли строка указанную подстроку. Возвращает значение true или false. Вторым параметром можно указать позицию в строке, с которой следует начать поиск.
indexOf
Возвращает индекс первого найденного вхождения указанного значения. Поиск ведётся от начала до конца строки. Если совпадений нет, возвращает -1. Вторым параметром можно передать позицию, с которой следует начать поиск.
lastIndexOf
Возвращает индекс последнего найденного вхождения указанного значения. Поиск ведётся от конца к началу строки. Если совпадений нет, возвращает -1. Вторым параметром можно передать позицию, с которой следует начать поиск.
endsWith
Проверяет, заканчивается ли строка символами, заданными первым параметром. Возвращает true или false. Есть второй необязательный параметр — ограничитель по диапазону поиска. По умолчанию он равен длине строки.
startsWith
Проверяет, начинается ли строка с указанных символов. Возвращает true или false. Вторым параметром можно указать индекс, с которого следует начать проверку.
search
Проверяет, есть ли в строке указанное значение или регулярное выражение и возвращает индекс начала совпадения.
Как извлечь подстроку
slice
Извлекает часть строки и возвращает новую строку. Обязательный параметр — начало извлечения. Вторым параметром можно установить границу (по умолчанию — до конца строки).
substring
Извлекает символы из строки между двумя указанными индексами. Второй индекс указывать не обязательно. В таком случае будут извлечены все символы от начала до конца строки. В отличие от slice, можно задавать start больше, чем end. Отрицательные значения не поддерживаются, они интерпретируются как 0.
substr
Извлекает часть строки указанной длины. Первым параметром принимает стартовую позицию, вторым — длину. Значение первого параметра может быть отрицательным, тогда позиция определяется с конца строки.
Как заменить подстроку
replace
Ищет в строке указанное значение или регулярное выражение и возвращает новую строку, в которой выполнена замена на второй параметр. Можно заменить найденные значения другой строкой или передать функцию для работы над совпадениями.
replaceAll
Даёт такой же результат, как метод replace() с глобальным флагом g. Заменяет все найденные совпадения другой строкой или переданной функцией.
Как добавить в строку пробелы или другие символы
padEnd
Добавляет в конце отступы, пока строка не достигнет длины, заданной первым параметром. Вторым параметром можно указать другой символ вместо пробела.
padStart
Добавляет в начале отступы, пока строка не достигнет длины, заданной первым параметром. Вторым параметром можно указать другой символ вместо пробела.
Как удалить пробелы в строке
Обрезает пробелы с обоих концов строки.
trimEnd
Обрезает пробелы в конце строки
trimStart
Обрезает пробелы в начале строки
Как работать с Юникодом
charCodeAt
Возвращает числовое значение Юникода по указанному индексу. Обратите внимание: у букв в верхнем и нижнем регистрах разные коды.
fromCharCode
Преобразует числовые значения Юникода в читаемые символы.
Примечание: при работе с эмодзи, редкими математическими символами, иероглифами нужно помнить о суррогатных парах. Это символы, которые записываются двумя 16-битными словами. Длина таких строк — 2.
Суррогатные пары не учитывались при создании JS и методы строк charCodeAt / fromCharCode обрабатывают их некорректно. Правильно работают с суррогатными парами редкие методы String.fromCodePoint и str.codePointAt, которые появились в языке недавно.
Для работы со строками в JS есть не только встроенные методы, но и сторонние библиотеки. Они решают задачи более сложные задачи. Но подключать их имеет смысл только в том случае, если возможностей встроенных методов действительно не хватает.
How to trim() white spaces from a string?
JavaScript doesn’t seem to have a native trim() method. How can I trim white spaces at the start and end of a string with JavaScript?
19 Answers 19
The shortest form for jQuery:
according to this page the best all-around approach is
Of course if you are using jQuery , it will provide you with an optimized trim method.
I know this question is ancient but now, Javascript actually does have a native .trim()
Well, as a lot of people always says, the trim function works pretty well, but if you don’t want to use a whole framework just to perform a trim, it may be useful to take a look at its implementation. So here it is:
The main advantages I see in this implementation, comparing to other solution already proposed here are:
- The ‘g’ flag that allows you to perfom a trim on a multi-line string
- The (text || «») syntax that ensure that the function will always work, even if the argument passed is null or undefined.
As a couple of others have already noted, it’s usually best to do this sort of thing by using a third-party JS library. Not that trim() is a complicated function to build yourself, but there are so many functions that aren’t native to JavaScript that you might need and end-up writing yourself, it soon becomes more cost-effective to use a library.
Of course, another advantage of using a JS library is that the authors do the hard work of ensuring that the functions work across all the major browsers, so that you can code to a standard interface and forget about the irritating differences between Internet Explorer and all the other browsers.
A slightly tinier version of @Pat’s.
For ltrim, replace spaces anchored at the start of the string with nothing:
For rtrim, replace spaces anchored at the end of the string with nothing:
These all use regex’es to do the actual work.
Why not just modify the String prototype? Why not steal the trim function from an open source library, like I did here with YUI? (Do you really need to load and entire framework for this simple taks?) Put them together and you get this:
My solution, though, would be this (because the String object in Firefox 3.5 and above already has a trim method):
I made a trim-function speed in mind. This function beats in a clear difference all of 24 competitors (of which many use regular expressions) and also native string.trim() of Chrome and Chromium(!) and performs as speedy as Safari’s trim(). Test results are here: http://jsperf.com/mega-trim-test/7
The function trims characters » \n\r\t\f», but it’s easy to add more whitespace-characters, eg. those that regexp uses as whitespaces (\s) with only a minor performance lost ( please see http://jsperf.com/mega-trim-test/8 ).
Edit: The previous trim27() trims only the most common characters (» \n\r\t\f»), but to trim all possible whitespaces, I included below a new function mytrim():