Рядкові методи, які варто знати в JavaScript

| | 0 Comments| 9:33 PM
Categories:

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

Щоб позбутися цих кошмарів, нам потрібно знати найважливіші властивості та методи рядків у JavaScript.

Давайте досліджувати їх один за іншим.

довжина

Властивість length повертає довжину рядка.

const company = "techukraine.net";

console.log(company.length);

toUpperCase()

Метод toUpperCase перетворює кожен символ у рядку у верхній регістр і повертає його. Це не змінює оригінальний рядок.

const company = "techukraine.net";

const upperCaseCompany = company.toUpperCase();

console.log(upperCaseCompany);

toLowerCase()

Метод toLowerCase перетворює кожен символ у рядку на нижній регістр і повертає його. Це не змінює оригінальний рядок.

const company = "techukraine.net";

const lowerCaseCompany = company.toLowerCase();

console.log(lowerCaseCompany);

обрізати()

Метод trim видаляє початкові та кінцеві пробіли з рядка. Це операція на місці, тобто оновлюється вихідний рядок.

const company = "         Geek   Flare           ";

console.log(company);
console.log(company.trim());

charAt(індекс)

Метод charAt повертає символ із заданим індексом. Він повертає порожній рядок, якщо індекс недійсний.

const company = "techukraine.net";

console.log(company.charAt(2));
console.log(company.charAt(10));

charCodeAt(індекс)

Метод charCodeAt повертає ASCII-код символу за заданим індексом. Він повертає NaN, якщо індекс недійсний.

const company = "techukraine.net";

console.log(company.charCodeAt(2));
console.log(company.charCodeAt(10));

slice(startIndex, endIndex)

Зріз методу повертає підрядок із рядка від startIndex до endIndex (не включаючи). String.slice(0, 6) повертає підрядок від 0-го індексу до 5-го індексу.

const company = "techukraine.net";

console.log(company.slice(0, 4));

Зріз методу також прийматиме аргумент sing. Якщо ви передаєте один аргумент методу slice, він поверне підрядок із заданого індексу до кінця рядка.

const company = "techukraine.net";

console.log(company.slice(4));

Зріз методу також прийматиме від’ємні індекси. Від’ємні індекси відраховуються з кінця рядка. Давайте розглянемо приклад, оскільки він є новим для більшості людей.

  Керуйте музичною бібліотекою з центру сповіщень iPhone

Дано рядок techukraine.net, негативні індекси є

G = -9, e = -8, e = -7, k = -6

і так далі…

Код string.slice(-9, -5) поверне Geek для наведеного вище прикладу.

const company = "techukraine.net";

console.log(company.slice(-9, -5));

Код string.slice(-5) поверне Flare для наведеного вище прикладу.

const company = "techukraine.net";

console.log(company.slice(-5));

Примітка: негативне індексування не працюватиме в IE8 і попередніх версіях.

substr(startIndex, length)

Метод substr подібний до методу зрізу. Єдина відмінність полягає в тому, що метод substr приймає довжину підрядка, яку потрібно витягти з вихідного рядка.

const company = "techukraine.net";

console.log(company.substr(4, 5));

Існує ще один метод під назвою substring, подібний до методу slice. Але підрядок методу не прийматиме від’ємні індекси. Спробуй.

  Як легко перенести дані з комп’ютера на телефон

замінити (підрядок, новапідрядок)

Метод replace замінює перший екземпляр підрядка на newSubString.

const statement = "Visit the site Google";

console.log(statement.replace("Google", "techukraine.net"));

indexOf(підрядок)

Метод indexOf повертає початковий індекс даного символу з рядка. Він поверне -1, якщо символ не присутній у рядку.

const company = "techukraine.net";

console.log(company.indexOf("Flare"));
console.log(company.indexOf("O"));

Метод indexOf прийме другий аргумент, який є індексом, з якого починається пошук заданого підрядка.

const company = "techukraine.net";

console.log(company.indexOf("e"));
console.log(company.indexOf("e", 5));

Існує інший метод під назвою lastIndexOf, схожий на метод indexOf. Єдина відмінність полягає в тому, що метод lastIndexOf шукає символ, починаючи з кінця рядка, і повертає індекс першого екземпляра символу. Спробуйте це для коду company.lastIndexOf(‘e’).

  7 найкращих програм для керування ІТ-активами для малого та середнього бізнесу

розділити (підрядок)

Метод split розбиває заданий рядок на підрядок і повертає частини у вигляді масиву.

const statement = "Visit, the, site, techukraine.net";

console.log(statement.split(" "));
console.log(statement.split(", "));

Висновок

Це ще не кінець. Ознайомтеся з іншими методами рядків із документації. Можуть бути й інші методи, корисні в окремих випадках.

Шукайте та використовуйте їх у своєму конкретному випадку, якщо його тут немає в списку.

Щасливого кодування 🙂

Далі ознайомтеся з деякими популярними фреймворками JavaScript.