JavaScript

JavaScript: как сравнить первые символы строки

В JavaScript первые символы строки чаще всего сравнивают двумя способами. Если нужно проверить, начинается ли строка с нужного текста, используйте startsWith. Если нужно взять первые 2, 3 или 4 символа и сравнить их отдельно, используйте slice(0, n)

Прямой пример:

const code = "ABCD-2026";

console.log(code.startsWith("ABCD"));      // true
console.log(code.slice(0, 4) === "ABCD"); // true

Оба варианта рабочие, но смысл немного разный

Способ 1: startsWith

startsWith отвечает на вопрос: «строка начинается с этого фрагмента?»

const fileName = "report-final.pdf";

if (fileName.startsWith("report")) {
  console.log("Это отчет");
} else {
  console.log("Это другой файл");
}

Результат:

Это отчет

Этот способ хорошо подходит для префиксов: кодов товара, названий файлов, маршрутов сайта, коротких технических меток

Способ 2: slice

Если пользователь ищет именно «как сравнить первые 4 символа», обычно нужен slice(0, 4):

const text = "user_1542";
const firstFour = text.slice(0, 4);

if (firstFour === "user") {
  console.log("Строка начинается с user");
}

slice(0, 4) берет символы с индекса 0 до индекса 4, не включая 4. То есть для строки user_1542 получится user

Индексы начинаются с нуля

Это частая ловушка. В строке:

JavaScript

индексы такие:

J -> 0
a -> 1
v -> 2
a -> 3

Поэтому первые 4 символа:

"JavaScript".slice(0, 4); // "Java"

Проверка без учета регистра

Сравнение строк чувствительно к регистру:

console.log("Admin".startsWith("admin")); // false

Если нужно сравнивать без учета регистра, сначала приведите строку к одному виду:

const login = "Admin_42";

if (login.toLowerCase().startsWith("admin")) {
  console.log("Админский логин");
}

Такой вариант проще и понятнее, чем вручную проверять Admin, admin, ADMIN и другие комбинации

Практический сценарий: проверить артикул

Допустим, артикулы товаров начинаются с категории:

const productCode = "BOOK-4581";

if (productCode.slice(0, 4) === "BOOK") {
  console.log("Категория: книги");
} else {
  console.log("Другая категория");
}

Если длина префикса фиксированная, slice читается хорошо. Если важен именно текст начала, startsWith("BOOK") будет еще прямее

Пример с массивом строк

Часто нужно проверить не одну строку, а список. Например, оставить только ссылки, которые начинаются с https://:

const links = [
  "https://aglamov.biz",
  "http://old-site.example",
  "mailto:test@example.com"
];

const secureLinks = links.filter((link) => link.startsWith("https://"));

console.log(secureLinks);

Результат:

["https://aglamov.biz"]

Здесь filter проходит по массиву, а startsWith проверяет каждую строку. Такой пример уже ближе к реальной веб-разработке: вы можете фильтровать ссылки, коды заказов, имена файлов или строки из формы

Проверка первых символов из поля ввода

Если значение приходит из input, сначала получите строку:

<input id="code" value="SALE-2026">
<button id="check">Проверить</button>
<p id="result"></p>

<script>
  const input = document.querySelector("#code");
  const button = document.querySelector("#check");
  const result = document.querySelector("#result");

  button.addEventListener("click", () => {
    if (input.value.startsWith("SALE")) {
      result.textContent = "Это промокод";
    } else {
      result.textContent = "Префикс не совпал";
    }
  });
</script>

Так можно проверить начало логина, кода скидки, номера заявки или внутреннего артикула

Что выбрать

Задача	Лучший вариант
Проверить, начинается ли строка с текста	`startsWith("abc")`
Сравнить первые N символов	`slice(0, N) === "..."`
Получить первые символы и вывести их	`slice(0, N)`
Сравнить без учета регистра	`toLowerCase()` + проверка

Частые ошибки

Писать slice(1, 4) для первых четырех символов

slice(1, 4) начнет со второго символа. Для начала строки нужен индекс 0

Путать = и ===

Для сравнения используйте:

firstFour === "user"

Один знак = присваивает значение, а не сравнивает

Не учитывать короткую строку

Если строка короче четырех символов, slice(0, 4) просто вернет всю строку. Это не ошибка, но результат может отличаться от ожиданий

Мини-задание

Напишите проверку: если строка начинается с tel:, вывести Телефонная ссылка, если с mailto:, вывести Почтовая ссылка

const link = "mailto:test@example.com";

Проверьте оба варианта через startsWith

Что почитать дальше по JavaScript

Если нужен общий маршрут по теме, откройте рубрику JavaScript. Для соседних задач пригодятся эти разборы:

0 комментариев

Старые

Новые Популярные