JS об'єкт String

Введення до об'єкта String

String - це вбудований об'єкт у JavaScript, який представляє рядок символів. Рядки використовуються для зберігання текстових даних, що можуть бути відображені у текстовому форматі. На відміну від масивів, де кожен елемент зберігає одне значення, рядки зберігають послідовність символів.

Створення рядків

Існує кілька способів створити рядок в JavaScript. Один із них - використовувати літерали рядків:

const string1 = "Це рядок";
const string2 = 'Це теж рядок';
const string3 = `Це ще один рядок`;

Кожен з цих літералів представляє рядок. Вони можуть використовуватися взаємозамінно, але з `` можна виконувати інтерполяцію рядків - це коли ви вставляєте змінні безпосередньо в рядок. Наприклад:

const name = "Олексій";
const greetings = `Привіт, ${name}!`;
console.log(greetings); // Виведе: "Привіт, Олексій!"

Робота з рядками

Коли у вас є рядок, ви можете виконувати різноманітні операції: додавання рядків, доступ до окремих символів, пошук підрядків тощо.

Для додавання двох рядків можна використовувати оператор +:

const string1 = "Привіт, ";
const string2 = "світе!";
console.log(string1 + string2); // Виведе: "Привіт, світе!"

Для доступу до конкретного символу в рядку можна використовувати метод charAt() або квадратні дужки:

const text = "абрикос";
console.log(text.charAt(3)); // Виведе: "и"
console.log(text[3]); // Також виведе: "и"

Розширені можливості рядків

Рядки в JavaScript мають багато вбудованих методів, що допомагають виконувати різноманітні операції. Наприклад, метод substring() дозволяє витягти підрядок з поточного рядка:

const word = "парасолька";
const text = word.substring(2, 8);
console.log(text); // Виведе: "расоль"

Інший корисний метод - indexOf(), який повертає індекс першого входження підрядка:

const text = "Веселий, веселий день.";
console.log(text.indexOf("веселий")); // Виведе: 9

правити

Операції з рядками

Рядки в JavaScript - це більше, ніж просто послідовності символів. Завдяки великій кількості методів, які надає об'єкт String, можливо виконувати ряд сложних операцій з рядками.

Конкатенація рядків

Однією з основних операцій з рядками є їх об'єднання, або конкатенація. Це можна зробити за допомогою оператора +:

const chunk1 = "Коли розум";
const chunk2 = " мовчить, говорить серце.";
const common = chunk1 + chunk2;
console.log(common); // Виведе: "Коли розум мовчить, говорить серце."

В цьому прикладі ми об'єднали два рядки, використовуючи оператор +. Результат - новий рядок, який є комбінацією двох попередніх.

Доступ до символів

Щоб отримати доступ до конкретного символу в рядку, можна використовувати метод charAt() або квадратні дужки:

const word = "циркуль";
console.log(word.charAt(4)); // Виведе: "у"
console.log(word[4]); // Також виведе: "у"

Тут ми отримали доступ до п'ятого символу в рядку (індексація починається з 0), використовуючи обидва доступних метода.

Пошук в рядку

Щоб знайти підрядок в межах більшого рядка, можна використовувати метод indexOf():

const sentence = "Сонце світить яскраво і високо.";
const position = sentence.indexOf("яскраво");
console.log(position); // Виведе: 11

У цьому прикладі ми шукали підрядок "яскраво" в рядку. Метод повернув позицію першого символу цього підрядка в більшому рядку.

Заміна підрядка

Щоб замінити частину рядка іншою стрічкою, можна використовувати метод replace():

const text = "Котик грає на гітарі.";
const new_text = text.replace("гітарі", "барабанах");
console.log(new_text); // Виведе: "Котик грає на барабанах."

Тут ми замінили підрядок "гітарі" на "барабанах", використовуючи метод replace().

Розбиття рядка

Щоб розбити рядок на масив підрядків за певним роздільником, можна використовувати метод split():

const phrase = "Яблуко, апельсин, банан";
const found = phrase.split(", ");
console.log(found); // Виведе: ["Яблуко", "апельсин", "банан"]

Тут ми розділили рядок на масив підрядків, використовуючи кому та пробіл як роздільники.

правити

Порада

Не змінюйте рядки напряму! Рядки в JavaScript є незмінними. Кожна операція, яка "змінює" рядок, насправді створює новий рядок.

автор: Bond правити

Порада

Уникайте використання String як конструктора. Це може призвести до плутанини, оскільки типи об'єктів та примітивів відрізняються.

автор: Bond правити

Нотатка

Будьте обережні при порівнянні рядків. Оператори порівняння (==, ===, <, >) розглядають рядки як чутливі до регістру. Для порівняння незалежно від регістру використовуйте методи toUpperCase або toLowerCase.

const str1 = "Привіт";
const str2 = "привіт";
console.log(str1.toLowerCase() === str2.toLowerCase());  // true

В цьому прикладі ми перетворили обидва рядки на нижній регістр перед порівнянням, щоб зробити їх незалежними від регістру.

автор: Bond правити

Нотатка

Будьте уважні з локалізацією: Якщо ваша програма працює з різними мовами, використовуйте методи, які є чутливими до локалізації, такі як localeCompare.

const str1 = "Straße";
const str2 = "Strasse";
console.log(str1.localeCompare(str2, 'de-DE'));  // -1

В цьому прикладі ми використовуємо localeCompare для порівняння двох німецьких слів в контексті німецької локалізації.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

let string = 'text';
let string = "text";
let string = `text`;
let string = new String("text");

методи

властивості

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1	1	3	12

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1

Підтримка: серверні переглядачі

Переглядач
	0.10.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

const name = "john";
const capitalizedName = capitalizeFirstLetter(name);
console.log(capitalizedName); // Виведе: "John"

function findSubstringContext(str, subStr, context = 5) {
    const index = str.indexOf(subStr);
    if (index === -1) return "Substring not found";

    const start = Math.max(0, index - context);
    const end = Math.min(str.length, index + subStr.length + context);

    return str.slice(start, end);
}

const text = "The quick brown fox jumps over the lazy dog";
const context = findSubstringContext(text, "fox");
console.log(context); // Виведе: "quick brown fox jumps o"

function censorText(text, forbiddenWords) {
    let censoredText = text;
    for (const word of forbiddenWords) {
        const regex = new RegExp(word, "gi");
        const replacement = '*'.repeat(word.length);
        censoredText = censoredText.replace(regex, replacement);
    }
    return censoredText;
}

const comment = "This is a nasty comment with bad words.";
const forbidden = ["nasty", "bad"];
const censoredComment = censorText(comment, forbidden);
console.log(censoredComment); // Виведе: "This is a ***** comment with *** words."