Javascript убрать пробелы начале строки

Строковые функции в JavaScript

Строка — один из основных типов данных в JS. Сегодня я расскажу тебе о типе данных String и встроенных строковых функциях в JavaScript.

В JavaScript, все текстовые данные — это строки. Не важно, состоит твой текст из одного или десяти тысяч символов. Все это — строки.

Длину JavaScript строки ты можешь получить из поля length .

const s = 'Hello, World!'; console.log(s.length); 

Второй важный пункт стоит выделить отдельно:

JavaScript строка не изменяется после создания. Функции вроде replace или slice , вернут тебе новую строку, а оригинальная строка останется без изменений.

Обзор встроенных функций String в JavaScript

Во всех примерах, я буду считать, что ты объявил строку s как константу со значением I am going to become a FULL STACK JS Dev with Coderslang .

const s = 'I am going to become a FULL STACK JS Dev with Coderslang'; 

Как проверить включает ли одна строка другую

Чтобы проверить вхождение одной строки в другую в JavaScript существует встроенная функция includes .

Она вернет true или false в зависимости от результата проверки.

console.log(s.includes('FULL STACK')); // true console.log(s.includes('cheeseburger')); // false 

То же самое можно сделать иначе. Чтобы узнать есть ли какое-то слово в строке, ты можешь использовать функции indexOf или lastIndexOf . Они обе проверяют, включает ли основная строка искомую строку и вернут индекс элемента с которого начинается совпадение. А если совпадений не будет, то они обе вернут -1 .

console.log(s.indexOf('AWS')); // -1 console.log(s.lastIndexOf('AWS')); // -1 

Отличие indexOf от lastIndexOf становится очевидным, когда в основной строке несколько вхождений искомой подстроки.

console.log(s.indexOf('g')); // 5 console.log(s.lastIndexOf('g')); // 55 

Это отличие определяет и результат.

В любом случае, ты можешь использовать indexOf и lastIndexOf чтобы определить, включает ли одна строка другую в JavaScript. Если результат отличается от -1 , то да, совпадение найдено. Иначе — совпадений нет

Как определить начинается ли одна строка с другой строки

Чтобы узнать, стоит ли одна строка в начале другой строки в JavaScript существует функция startsWith . Она возвращает true если основная строка начинается со строки аргумента, иначе — false .

console.log(s.startsWith('I am')); // true console.log(s.startsWith('You are')); // false 

Как определить заканчивается ли одна строка другой строкой

Чтобы проверить вхождение одной строки в конце другой строки в JS существует функция endsWith . Она работает почти так же как и startsWith , но проверяет окончание строки, а не начало.

console.log(s.endsWith('Coderslang')); // true console.log(s.endsWith('Node.js')); // false 

Как удалить пробелы в начале и конце JavaScript строки

Чтобы удалить лишние пробелы в начале или конце JS строки ты можешь воспользоваться этими функциями:

• trimStart — удаляет пробелы в начале строки
• trimEnd — удаляет пробелы в конце строки
• trim — удаляет пробелы в начале и конце строки

В нашей базовой строке не было пробелов, поэтому давай создадим новую для демонстрации.

const stringWithSpaces = ' I learn JS with Coderslang every day '; console.log(stringWithSpaces.trimStart()); //'I learn JS with Coderslang every day ' console.log(stringWithSpaces.trimEnd()); //' I learn JS with Coderslang every day' console.log(stringWithSpaces.trim()); //'I learn JS with Coderslang every day' 

Как перевести всю JS строку в ВЕРХНИЙ или нижний регистр

Чтобы получить строку идентичную данной, но со всеми буквами в верхнем регистре, ты можешь использовать функцию toUpperCase , а для нижнего регистра toLowerCase .

console.log(s.toUpperCase()); // I AM GOING TO BECOME A FULL STACK JS DEV WITH CODERSLANG console.log(s.toLowerCase()); // i am going to become a full stack js dev with coderslang 

Опять-таки, обрати внимание, что строка s не меняется, потому что все строки в JavaScript неизменяемы. Функции toUpperCase и toLowerCase возвращают новую строку, которая содержит все требуемые изменения.

Как заменить один символ на другой в JavaScript строке

Чтобы сделать замену символа в JS строке, ты можешь использовать функцию replace . Передай в нее две строки, и она заменит первое вхождения первой строки (в базовой строке) на вторую строку.

console.log(s.replace(' ', '!')) // I!am going to become a FULL STACK JS Dev with Coderslang console.log(s.replace('I am', 'You are')) // You are going to become a FULL STACK JS Dev with Coderslang 

Если ты удивлен, что replace меняет только один символ — это нормально. Просто это базовый сценарий.

Чтобы сделать замену всех символов (или подстрок), тебе нужна функция replaceAll .

console.log(s.replaceAll(' ', '!')) // I!am!going!to!become!a!FULL!STACK!JS!Dev!with!Coderslang 

Обрати внимание, что в зависимости от того, где ты запускаешь код, может иногда появиться ошибка.

TypeError: s.replaceAll is not a function

Если ты получил такую ошибку, то функция replaceAll не поддерживается твоим JavaScript окружением и ты можешь использовать регулярное выражение с флагом g . Так обычный replace сработает как replaceAll .

const regex = new RegExp(' ', 'g'); const s = 'I am going to become a FULL STACK JS Dev with Coderslang'; console.log(s.replace(regex, '!')); // I!am!going!to!become!a!FULL!STACK!JS!Dev!with!Coderslang 

Источник

doctor Brain

Как удалить пробелы в начала или в конце строки? Для JavaScript такой проблемы не существует — все очень просто: чтобы избавиться от пробельных символов в начале строки есть функция trimStart() , в конце строки — trimEnd() , а для удаления пробелов как в начале, так и в конце строки — trim() .

const string = " hi "; string.trimStart(); // "hi " string.trimEnd(); // " hi" string.trim(); // "hi" 

Возвращаемое значение

Все перечисленные выше методы удаления пробельных символов возвращают новую строку. Таким образом, исходная строка остается неизменной.

const string = " hi "; string.trimStart(); // "hi " string.trimEnd(); // " hi" string.trim(); // "hi" console.log(string); // " hi " 

Пробельные символы

Итак, trim() и другие методы этой группы удаляют пробельные символы. Что же к ним относится?

Символы разрыва строки

Возможно Вы удивитесь, но символы разрыва строки относятся к пробельным символам. Разберем на примере:

'hi \n'.trim(); // "hi" 'hi \t'.trim(); // "hi" 'hi \r'.trim(); // "hi" 

Многострочные конструкции

В JavaScript можно встретить многострочные конструкции — шаблонные литералы. Хорошей новостью будет то, что метод trim() будет корректно работать и с ними.

const multiLine = ` hi `; multiline.trim(); // "hi" 

Словосочетания

Следует помнить, что метод trim() работает только с пробелами в начале и в конце строки и не удаляет пробелы между словами.

Словосочетания, как строчные литералы

Здесь работают те же правила, что и для шаблонных литералов, содержащих только одно слово. С помощью trim() можно удалить только пробельные символы перед первым словом и после последнего слова конструкции.

const multiLine = ` hi there `; multiLine.trim(); /* вернет: "hi there" */ 

Псевдонимы

trimStart и trimLeft

trimStart() удаляет все пробельные символы от начала строки до первого непробельного символа.

До сих пор некоторые разработчики используют метод trimLeft() . Это псевдоним. Результаты полностью идентичны.

const string = " hi "; trimEnd(string); // "hi "; trimRight(string); // "hi "; 

trimEnd и trimRight

trimEnd() удаляет пробелы в конце строки. Для него псевдоним — trimRigth() .

const string = " hi "; trimEnd(string); // " hi"; trimRight(string); // " hi"; 

Какой синтаксис лучше?

Согласно спецификации ECMAScript, методы trimStart и trimEnd являются предпочтительными и рекомендуемыми. Синтаксис trimLeft и trimRight сохранен для обеспечения совместимости со старым кодом.

Таким образом, в этом противостоянии побеждают trimStart и trimEnd .

Почему появились псевдонимы?

Методы trimLeft и trimRight появились первыми. Однако, в дальнешем было принято решение использовать синтаксис trimStart и trimEnd , в связи с тем, что такое написание сходно с названиями других встроенных методов, например: padStart и padEnd . Такой подход позволяет сделать конструкции языка JavaScript более понятными и однородными.

Для сохранения совместимости с уже написанным ранее кодом методы trimLeft и trimRight были сохранены, как псевдонимы, позволяя использовать устаревший синтаксис в старых проектах.

Применение

trim

Обычно все пользуются методом trim() , например, для удаления лишних пробелов значений полей ввода.

const inputValue = document.getElementById('search').value.trim(); 

trimStart

Метод trimStart() может пригодиться при работе со строками документа в разметке markdown, когда нужно удалить только пробельные символы в начале строки, не затрагивая пробелы и символы разрыва в конце строки.

- List Item - Sub List Item - Sub List Item 

trimEnd

В отношении метода trimEnd() нет каких-то выдающихся мыслей, но возможно он пригодится для удаления символов разрыва строки.

Браузеры

Методы удаления пробельных символов trimStart и trimEnd поддерживаются последними версиями всех пополуярных браузеров, кроме Internet Explorer.

Альтернатива

Вместо метода trim можно использовать регулярное выражение:

const string = ' hi '; string.replace(/ /g, ''); // "hi" 

Написано по материалам статьи Samantha Ming “JavaScript String trim()”.

Новые публикации

JavaScript: сохраняем страницу в pdf

HTML: Полезные примеры

CSS: Ускоряем загрузку страницы

JavaScript: 5 странностей

JavaScript: конструктор сортировщиков

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.

© 2021 dr.Brain .
мир глазами веб-разработчика

Источник

String.prototype.trim()

Метод trim() удаляет пробельные символы с начала и конца строки. Пробельными символами в этом контексте считаются все собственно пробельные символы (пробел, табуляция, неразрывный пробел и прочие) и все символы конца строки (LF, CR и прочие).

Синтаксис

Описание

Метод trim() возвращает строку с вырезанными пробельными символами с её концов. Метод trim() не изменяет значение самой строки.

Примеры

Пример: использование метода trim()

Следующий пример покажет строку ‘foo’ :

var orig = ' foo '; console.log(orig.trim()); // 'foo' // Другой пример, в котором .trim() убирает пробельные символы только с одной стороны. var orig = 'foo '; console.log(orig.trim()); // 'foo' 

Полифил

Запуск следующего кода до любого другого создаст метод trim() , если он ещё не реализуется браузером.

if (!String.prototype.trim)  (function()  // Вырезаем BOM и неразрывный пробел String.prototype.trim = function()  return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''); >; >)(); > 

Спецификации

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

Found a content problem with this page?

This page was last modified on 27 мар. 2023 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

Our communities

Developers

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.

Источник