→ Javascript: робота з рядками, функції. Javascript: робота з рядками, функції Методи роботи з рядками javascript

Javascript: робота з рядками, функції. Javascript: робота з рядками, функції Методи роботи з рядками javascript

Тип даних рядок (string)використовується для представлення тексту. Відповідно, значення типу string є текст. Будь-який текст у JavaScript є рядком.

Кавички

Рядки JavaScript повинні бути укладені в лапки. У JavaScript існує три види лапок: подвійні (" "), одинарні (" ") і зворотні (``):

"Рядок у подвійних лапках" "Рядок у одинарних лапках" `Рядок у зворотних лапках`

Вигляд лапок на початку та в кінці рядка повинен збігатися.

Рядки можуть складатися з нуля та більше символів:

"" // Порожній рядок "Рядок" // Не пустий рядок

Рядки з подвійними та одинарними лапками нічим не відрізняються між собою по функціоналу - вони можуть містити лише текст та послідовності, що управляють. А ось рядки зі зворотними лапками мають ширший функціонал. Такі рядки можуть містити так звані підстановки, що позначаються знаком долара та фігурними дужками$ (Вираз) . Підстановки можуть містити будь-які довільні вирази:

Let стор = "Світ!"; let стор2 = `Привіт, $ (стор)`; // Використання змінної рядку alert(стр2); // Привіт, Світ! alert(`2 + 3 = $(2 + 3).`); //2+3=5.

Вираз, розташований у підстановці ($(...)) обчислюється, і його результат стає частиною рядка.

Рядки у зворотних лапках можуть займати більше одного рядка, зберігаючи всі пробілові символи:

Let числа = Числа: 1 2; alert(числа); // Числа: // 1 // 2

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

Рядки, укладені в одні лапки, можуть містити інші лапки:

"одинарні "лапки" та `зворотні` всередині подвійних" "а тут "так" і `так`!" а тут "так" і "так"!

Для зручності великі рядкові літерали можна розбивати на кілька рядків, закінчуючи кожен рядок, крім останнього, символом \ :

Alert("це все одна \ довга \ рядок"); // це все один довгий рядок alert ("це все один довгий рядок"); // це все один довгий рядок alert(`це все один \ довгий \ рядок`); // це все один довгий рядок

Кодування символів рядка

Незалежно від того, яке кодування встановлено для сторінки, JavaScript для рядків завжди використовується кодування UTF-16.

У JavaScript рядок - це незмінна, впорядкована послідовність 16-бітових значень, кожне з яких представляє символ Unicode. Для представлення символів Unicode JavaScript використовується кодування UTF-16. Символи включають букви, цифри, знаки пунктуації, спеціальні символи та пробельні символи.

Довжина рядка

Довжина рядка- це кількість 16-бітних значень (а не самих символів), що містяться в ній. Довжина рядка містить властивість length:

Alert("Привіт".length); // 6

Символи, кодові пункти яких не вміщуються в 16 біт, обробляються відповідно до правил кодування UTF-16 як послідовності двох 16-бітних значень. Це означає, що рядок, що має довжину, що дорівнює 2 (два 16-бітових значення), насправді може представляти єдиний символ:

Alert("a".length); // 1 alert("𝑒".length); // 2

Нумерація та доступ до символів рядка

Як вже було сказано, рядок є впорядкованою послідовністю 16-бітних значень, кожному з яких відповідає певний символ. Нумерація 16-бітних значень у рядку починається з нуля, тобто перше 16-бітове значення знаходиться під індексом 0, друге - під індексом 1 і т.д. Індекс - це порядковий номер.

Отримати символ рядка (який складається з одного 16-бітного значення) можна за допомогою індексу, укладеного в квадратні дужки [індекс] :

Let стор = "Привіт"; alert(стор); // П alert (стор); // У

Щоб за допомогою індексів звернутися до символу, що складається з двох 16-бітових значень, потрібно, використовуючи конкатенацію, написати ці індекси так, щоб у результаті вийшла послідовність двох 16-бітових значень:

Let стор = "𝑒"; alert(стор + стор); // "𝑒"

Рядки незмінні

У JavaScript рядки незмінні. Це означає, що у вже існуючому рядку не можна змінювати жодних символів або додавати до нього щось нове.

Так як рядки незмінні, то методи, що використовуються для роботи з рядками, повертають нові рядки, а не змінюють той рядок, щодо якого вони були викликані:

Let стор = "Привіт!"; alert(стор.toUpperCase()); // "HELLO" - нове значення, що повертається методом alert(стр); // "hello" - початковий рядок не змінено

Щоб змінити рядок, можна створити новий рядокі записати її в ту саму змінну замість старого рядка:

Let стор = "Рядок"; стор = стор.toUpperCase(); alert(стор); // "РЯДК"

Керуючі послідовності

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

У таблиці нижче представлені послідовності, що управляють:

Послідовність Значення
\0 Символ NUL - порожній символ ("u0000").
\t Горизонтальна табуляція ("u0009").
\n Переклад на новий рядок ("u000A").
\b Повернення на одну позицію - те, що відбувається при натисканні на клавішу backspace ("u").
\r Повернення каретки ("D").
\f Переклад сторінки - очищення сторінки ("uC").
\v Вертикальна табуляція ("B").
\" Подвійна лапка ("u").
\" Одинарна лапка ("u").
\\ Зворотний слеш ("C").
\xNN Номер символу із набору символів ISO Latin-1, заданий двома шістнадцятковими цифрами (N - шістнадцяткова цифра 0-F). Наприклад, "x41" (це код літери "A").
\uNNNN Номер символу з набору символів Unicode, заданий чотирма шістнадцятковими цифрами (N - шістнадцяткова цифра 0-F). Наприклад, "\u0041" (це код літери "A"s).

Керуючі послідовності можуть знаходитися в будь-якому місці рядка:

Alert("Грецька літера сигма: \u03a3."); // Грецька літера сигма:? alert("Многорядкова\nрядок") // Багаторядкова // рядок alert("всередині використовуються "подвійні" лапки"); // усередині використовуються "подвійні" лапки

Якщо символ передує будь-якому символу, відмінному від наведених у таблиці, то він просто ігнорується інтерпретатором:

Alert("k"); // "k"

Символи Unicode, що вказуються за допомогою керуючої послідовності, можна використовувати не тільки всередині рядкових літералів, але і в ідентифікаторах:

Let a\u03a3 = 5; alert(a); // 5

Конкатенація

Конкатенація - це об'єднання двох або більше рядків в одну велику. Об'єднання відбувається за допомогою оператора + (плюс). При конкатенації кожен наступний рядок додається до кінця попереднього:

Var str1 = "Hello"; var str2 = "World!"; document.write(str1 + str2 + "
"); // "Hello World!" document.write(str1 + "World!"); Спробувати »

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

Var str1 = "Hello"; alert(str1 + 1); // "Hello 1" alert (true + str1); // "trueHello" alert(str1 + NaN); // "Hello NaN"

Привіт! У цьому уроці розглянемо як у JavaScript можна створити рядок та функції для роботи з рядками. У принципі JavaScript будь-яка текстова змінна є рядком, оскільки JavaScript є не строго типізованим мовою програмування (про типи даних читайте ). І також для роботи з рядками використовується клас String:

Var name1 = "Tommy";

Так і використовувати конструктор String:

Var name1 = новий String("Tommy");

В основному використовується перший метод напевно тому що він більш короткий.

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

Довжина рядка

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

Var hello1 = "привіт світ"; document.write("У рядку "" + hello + "" " + hello1.length + " символів");

Пошук у рядку

Для того щоб знайти в рядку деякий підрядок застосовуються функції indexOf() (повертає індекс першого входження підрядка) та lastIndexOf() (повертає індекс останнього входження підрядка). Ці функції приймають два аргументи:

  • Підрядок, який власне і треба знайти
  • Необов'язковий аргумент, який показує, з якого символу потрібно проводити пошук підрядки у рядку

Обидві функції повертають число, яке є індексом символу, з якого в рядку починається підрядок. Якщо підрядок не знайдено, то повернеться число -1. Тому дані функції використовуються в логічних операторах , тому що як правило треба просто перевірити, чи містить рядок підрядок чи ні, то в цьому випадку результат роботи цих функцій порівнюється з -1.

Var str1 = "Привіт Васю!"; var podstr = "Петя"; if(str.indexOf(podstr) == -1)( document.write("Подстрока не найдена."); ) else ( document.write("Подстрока знайдена."); )

У прикладі буде виведено повідомлення «Підрядок не знайдено», оскільки рядок «Петя» не міститься у рядку «Привіт Васю!».

Функції includes, startsWith, endsWith

Більше сучасний метод str.includes(substr, pos) повертає true, якщо у рядку str є підрядок substr, або false, якщо ні.

Це - правильний вибірякщо нам необхідно перевірити, чи є збіг, але позиція не потрібна:

Alert("Widget with id".includes("Widget")); // true alert("Hello".includes("Bye")); // false

Необов'язковий другий аргумент str.includes дозволяє розпочати пошук із певної позиції:

Alert("Midget".includes("id")); // true alert("Midget".includes("id", 3)); // false, пошук розпочато з позиції 3

Методи str.startsWith і str.endsWith перевіряють, відповідно, чи починається і закінчується рядок певним рядком:

Alert("Widget".startsWith("Wid")); // true, "Wid" - початок "Widget" alert ("Widget". EndsWith ("get")); // true, "get" - закінчення "Widget"

Вибір підрядка

Для вирізання з рядка підрядка використовуються такі функції як substr() і substring().

Функція substring() приймає 2 аргументи:

  • стартова позиція символу в рядку, починаючи з якого буде проведено обрізання рядка
  • кінцева позиція, до якої треба обрізати рядок
var hello1 = "привіт світ. До побачення світ"; var world1 = hello1.substring(7, 10); //з ​​7-го по 10-й індекс document.write(world1); // Світ

Функція substr() також як один параметр приймає стартовий індекс підрядка, а ось як другий - довжину підрядка:

Var hello1 = "привіт світ. До побачення світ"; var bye1 = hello1.substr(12, 2); document.write(bye1);//До

Та й якщо другий параметр не вказувати, то рядок буде обрізаний до кінця:

Var hello1 = "привіт світ. До побачення світ"; var bye1 = hello1.substr(12); document.write(bye1); //поки світ

Управління регістром букв

Для зміни регістру літер, тобто щоб зробити всі літери маленькими або великими, використовуються функції toLowerCase() (для переведення символів у нижній регістр, тобто всі літери будуть маленькими) та toUpperCase() (для перекладу символів у верхній регістр, тобто усі літери будуть більшими).

Var hello1 = "Привіт Джим"; document.write(hello1.toLowerCase() + "
"); //Привіт джим document.write(hello1.toUpperCase() + "
"); // ПРИВІТ ДЖИМ

Отримання символу за його індексом

Для того, щоб знайти певний символу рядку за його індексом застосовуються функції charAt() і charCodeAt(). Обидві ці функції як аргумент приймають індекс символу:

Var hello1 = "Привіт Джим"; document.write(hello1.charAt(3) + "
"); //в document.write(hello1.charCodeAt(3) + "
"); //1080

Але тільки якщо як результат своєї роботи функція charAt() поверне сам символ, то функція charCodeAt() поверне числовий Юнікод код цього символу.

Видалення прогалин

Для видалення прогалин у стоку використовується функція trim():

Var hello1 = "Привіт Джим"; var beforeLen = hello1.length; hello1 = hello1.trim(); var afterLen = hello1.length; document.write("Довжина рядка до: " + beforeLen + "
"); //15 document.write("Довжина рядка після: " + afterLen + "
"); //10

Об'єднання рядків

Функція concat() дозволяє об'єднати 2 рядки:

Var hello1 = "Привіт"; var world1 = "Вася"; hello1 = hello1.concat(world1); document.write(hello); //Привіт Вася

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

Функція replace() дозволяє замінити один підрядок на інший:

Var hello1 = "Добрий день"; hello1 = hello1.replace("день", "вечір"); document.write(hello1); //Добрий вечір

Перший аргумент функції показує, який саме підрядок треба замінити, а другий аргумент - на який власне підрядок треба замінити.

Поділ рядка на масив

Функція split() дозволяє розділити рядок на масив підрядків, використовуючи певний роздільник. Як воно можна використовувати рядок, який передавати в метод:

Var mes = "Сьогодні була чудова погода"; var stringArr = mes.split(" "); for(var str1 in stringArr) document.write(stringArr + "
");

Порівняння рядків

Також при порівнянні рядків слід враховувати регістр літер. Велика літера менша за маленьку, а літера її поза алфавітом взагалі.

ЗАВДАННЯ

Заміна регістру останньої літери у рядку

Напишіть функцію lastLetterStr(str), яка замінюватиме регістр останньої літери, роблячи її великою.

Перевірка на спам

Напишіть функцію provSpam(str), яка перевірятиме рядок на наявність підрядків: «spam», «sex», «xxx». І повертати true, якщо є дані підрядки і false в іншому випадку.

Знайти число

Напишіть функцію extrNum(str), яка з рядка отримує число, якщо рядок містить число і функція повертає число. Наприклад, є рядок «120грн» потрібно повернути з рядка 120.

І на закріплення дивіться відео по роботі з рядками JavaScript.

Як семантичні «каркаси» використання функцій та конструкцій для обробки рядків становлять особливий інтерес для програмування процесів обробки інформації за її змістовим змістом. Мовою JavaScript функції роботи з рядками можна комбінувати у власні смислові конструкції, спрощуючи код і формалізуючи предметну область завдання.

У класичному варіанті обробка інформації – це, перш за все, рядкові функції. Кожна функція та конструкція мови має свої особливості у синтаксисі та семантиці JavaScript. Методи роботи з рядками тут мають свій стиль, але у звичайному застосуванні це просто синтаксис у межах простої семантики: пошук, заміна, вставка, витяг, контенкація, зміна регістру.

Опис рядкових змінних

Для оголошення рядка використовується конструкція var.Можна відразу задати її значення або формувати його під час виконання алгоритму. Для рядка можна використовувати одинарні або подвійні лапки. Якщо в ній має бути лапка, її необхідно екранувати символом \.

Рядок, позначений вимагає екранування внутрішніх подвійних лапок. Аналогічно та, що позначена одинарними, критична до наявності всередині одинарних лапок.

У цьому прикладі у рядку «str_dbl» перелічені корисні спеціальні символи, які можна використовувати у рядку. При цьому сам символ \ екранується.

Рядок - це завжди масив

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

  • str_isV => "V";
  • str_chr => """;
  • str_dbl => "a".

Тобто символи рядка доступні як елементи масиву, кожен спеціальний символ - це один символ. Екранування – це елемент синтакісу. У реальний рядок ніякий екран не поміщається.

Використання функції charAt() дає аналогічний ефект:

  • str_isV.charAt(3) => "V";
  • str_chr.charAt(1) => """;
  • str_dbl.charAt(5) => "a".

Програміст може використати будь-який варіант.

Основні рядкові функції

У JavaScript виконано дещо інакше, ніж в інших мовах. До імені змінної (або рядка) через точку записується ім'я функції. Зазвичай малі функції називають способами в стилі синтаксису мови, але перше слово звичніше.

Найважливіший метод рядка (правильніше - властивість) - його довжина.

  • var xStr = str_isV.length + "/" + str_chr.length + "/" + str_dbl.length.

Результат: 11/12/175 за рядками наведеного вище опису.

Найважливіша мала рядок функцій - поділ рядка на масив елементів і злиття масиву в рядок:

  • split(s [, l]);
  • join(s).

У першому випадку рядок розбивається за символом-розділювачем "s" на масив елементів, в якому кількість елементів не перевищує значення "l". Якщо кількість не задано, то розбивається весь рядок.

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

Примітна особливість цієї пари: розбиття можна проводити по одному роздільнику, а злиття - по іншому. У цьому контексті в JavaScript робота з рядками може бути виведена за межі синтаксису мови.

Класичні малі функції

Звичайні функції обробки рядків:

  • пошук;
  • вибірка;
  • заміна;
  • перетворення.

Представлені методами: indexOf(), lastIndexOf(), toLowerCase(), toUpperCase(), concan(), charCodeAt() та іншими.

У JavaScript робота з рядками представлена ​​безліччю функцій, але вони або дублюють один одного, або залишені для старих алгоритмів та сумісності.

Наприклад, використання методу concat() припустимо, але простіше написати:

  • str = str1 + str2 + str3;

Застосування функції charAt() теж має сенс, тоді як застосування charCodeAt() має реальне практичне значення. Аналогічно, для JavaScript перенесення рядка має особливе значення: у контексті виведення на екран, наприклад, у повідомленні alert() - це \n, у конструкції формування контенту сторінки
». У першому випадку це просто символ, а в другому рядок символів.

Рядки та регулярні вирази

У JavaScript робота з рядками включає механізм регулярних виразів. Це дозволяє виконувати всередині браузера складні пошуки, вибірки та перетворення рядків без звернення до сервера.

Метод matchзнаходить, а replaceзамінює знайдений збіг необхідним значенням. Регулярні вирази реалізовані в JavaScript високому рівні, По суті своїй, є складними, а через специфіку застосування переносять центр тяжіння з сервера в браузер клієнта.

При застосуванні методів match, searchі replaceслід не лише приділити належну увагу тестуванню на всьому спектрі допустимих значень вихідних параметрів та рядків, але й оцінити навантаження на браузер.

Приклади регулярних виразів

Область застосування регулярних виразів для обробки рядків велика, але вимагає великої акуратності та уважності від розробника. В першу чергу регулярки знаходять застосування під час тестування введення користувача в полях форм.

Тут представлені функції, які перевіряють, чи введення містить ціле число (schInt) або число речовинне (schReal). Наступний приклад показує, наскільки ефективно обробляти рядки, перевіряючи їх на наявність лише допустимих символів: schText – лише текст, schMail – правильна адреса електронної пошти.

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

Слід особливо відзначити, що далеко не завжди слід виконувати завдання, як воно поставлене. Зокрема щодо перевірки цілих чисел і речових: можна обійтися не класичними малими методами, а звичайними конструкціями синтаксису.

Об'єктно-орієнтовані рядки

У JavaScript робота з рядками представлена ​​широким асортиментом функцій. Але це не є вагомою основою для використання їх у первозданному вигляді. Синтаксис та якість функцій бездоганні, але це універсальне рішення.

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

Ідеальне рішення завжди полягає в тому, щоб інтерпретувати дані щодо їхнього змісту.

Представляючи кожен параметр як об'єкта, можна сформулювати функції до роботи з ним. Завжди йдеться про обробку символів: числа чи рядки – це конкретним чином організовані послідовності символів.

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

Усі ситуації не завжди можна передбачити. Це важливий момент у програмуванні. Рідкісний алгоритм не вимагає доопрацювання, а в більшості випадків доводиться систематично коригувати функціонал.

Формалізація оброблюваної рядкової інформації як об'єкта покращує читабельність коду, дозволяє вивести його до рівня смислової обробки. Це інший ступінь функціональності та значно найкраща якістькоду за більшої надійності розробленого алгоритму.

У цій статті йдеться про те, що таке рядки у JavaScriptта методи роботи з ними.

Рядки - це просто групи символів, такі як JavaScript, Hello world! », «http://www.quirksmode.org» або навіть «14». Для програмування на JavaScript Вам необхідно знати, що таке рядки і як з ними працювати, тому що використовувати їх доведеться дуже часто. Багато речей, таких як URL-сторінки, значення CSS-параметрів та елементів введення форм – все є рядками.

Спочатку постараюся пояснити роботи з рядками, потім — різницю між JavaScript. Навіть якщо у вас є досвід програмування іншою мовою, уважно прочитайте цю частину. Наприкінці я розповім про найважливіші рядків у JavaScript.

Основи роботи з рядками

Давайте розглянемо основи роботи з рядками JavaScript.

Використання лапок

Коли Ви оголошуєте рядки у JavaScriptабо працюєте з ними, завжди укладайте їх в одинарні або подвійні лапки. Цим Ви пояснюєте браузеру, що він має справу з рядком. Не змішуйте використання лапок у коді, якщо Ви почали рядок з одинарної лапки, а закінчили подвійний, JavaScript не зрозуміє, що Ви мали на увазі. Як правило, я використовую одинарні лапкидля роботи з рядками, так як подвійні лапки я вирішив використовувати для HTML, а одинарні - для JavaScript. Звичайно, Ви можете робити все по-іншому, але я раджу вам вигадати подібне правило для себе.

Давайте представимо два рядки, які ми будемо використовувати протягом усієї статті:

Var a = "Hello world!"; var b = "I am a student.";

Зараз ми оголосили дві змінні, «a» і «b», і надали їм рядкові значення. Після цього ми можемо з ними працювати, але спочатку вирішимо одну проблему: скажімо, я написав:

Var b = "I"m a student.";

Рядок містить у собі зайву одинарну лапку, і JavaScript думає, що рядок закінчено і виводить повідомлення про помилку, не розуміючи, що слідує далі. Тому Вам потрібно екранувати лапку, повідомляючи браузеру, що її слід розглядати як символ, а чи не як закінчення рядка. Це здійснюється за допомогою «зворотного слішу» перед лапкою:

Var b = "I"m a student.";

Зауважте, що Ви можете вставляти в рядок подвійні лапки без екранування. Так як Ви використовуєте одинарні лапки, як початок і кінець рядка,

Var b = "I"m a "student".";

сприймається без проблем. Подвійні лапки автоматично розглядаються як частини рядка, а не команди.

Вбудовані функції

Після визначення рядків можна розпочати їх використання. Наприклад, Ви можете з'єднати один рядок з іншим, або взяти з рядка "b" підрядок, що складається з другого-четвертого символів і вставити їх у середину рядка "a", або визначити який символ коштує дванадцятим в "a", скільки символів в "b", чи є в них буква " q» і т.д.

Для цього можна використовувати вбудовані функції, які JavaScript визначає для кожного рядка. Одна з них – «length» – повертає довжину рядка. Тобто якщо Ви хочете обчислити довжину Hello world!, напишіть:

Var c = "Hello world!".

Раніше ми надали цей рядок змінної «а». Таким чином, Ви зробили змінну "a" рядком, тому до неї теж застосовна функція "length", і наступна операція дасть такий же результат:

Var c = a.length;

Запам'ятайте, що Ви можете використовувати "length" для будь-якого рядка - це вбудована функція. Ви можете обчислити довжину будь-якого рядка, наприклад: "location.href" або "document.title" або оголошеної Вами.

Нижче наведено список поширених вбудованих методів і властивостей.

Рядки та числа

У деяких мовах програмування від Вас потрібно вказувати, чи є змінна числом або рядком, перш ніж робити з нею щось ще. JavaScript простіше відноситься до різниці між рядками та числами. Фактично Ви навіть можете складати числа з рядками:

Var c = a + 12;

У деяких мовах програмування обробка такого рядка призведе до помилки. Все ж таки «a» - це рядок, а «12» - число. Однак JavaScript намагається вирішити проблему, припускаючи, що «12» теж рядок. Таким чином "с" приймає значення "Hello world!12". Значить, якщо Ви використовуєте «+» з рядком і числом, JavaScript намагається зробити з рядка. Якщо ж Ви застосовуєте математичні операції до рядка, JavaScript намагається перетворити її на число. За відсутності можливості переведення рядка в число (наприклад, через наявність у ньому букв), JavaScript повертає NaN - "Not a Number - не є числом".

Нарешті, JavaScript немає різниці між цілими величинами і числами з плаваючою точкою.

Число → рядок

Для перетворення числа в рядоквведіть:

Var c = (16 * 24) / 49 + 12; d = c.toString();

Після цього Ви можете застосовувати до d всі строкові методи, а c все ще містить число.

Рядок → число

Якщо Ви хочете перетворити рядок на число, спочатку переконайтеся, що він складається лише із символів 0—9 . Для цього я просто множу рядок на 1 .

Var c = "1234"; d = c*1;

Оскільки множення здійснюється тільки з числами, JavaScript перетворює рядок на число, якщо це можливо. В іншому випадку, результат - NaN.

Зауважимо, якщо написати:

Var c = "1234"; d = c + 0;

Результатом буде "12340", тому що JavaScript використовує "+" для з'єднання рядків, а не їх складання.

Строкові властивості та методи

То що ми можемо робити з рядками? Об'єднання – це особливий випадок, але всі інші команди (методи) можуть використовуватися з будь-яким рядком за допомогою конструкції:

Ім'я_рядки.метод();

Список вбудованих методів JavaScript для роботи з рядками

Конкатенація - об'єднання рядків

По-перше, Ви можете об'єднати рядки, склавши їх разом, ось так:

Document.write(a + b);

в результаті вийде: Hello world! I am a student. ». Але, звичайно, Ви хочете, щоб між пропозиціями був пробіл. Для цього запишемо код так:

Document.write(a + " " + b);

Так ми з'єднаємо три рядки: "а", """ (один пробіл) і "b", в результаті отримавши: "Hello world! I am a student. »

Ви можете використовувати навіть числа або обчислення, наприклад:

Document.write (a + 3 * 3 + b);

Зараз ми з'єднуємо рядок «а», потім результат виразу «3 * 3», що розглядається як рядок, і «b», отримуючи: «Hello world!9 I am a student. »

При використанні додавання потрібно бути уважним. Команда

Document.write (a + 3 + 3 + b);

з'єднує 4 рядки: "а", "3", "3" і "b", тому що "+" в даному випадкуозначає «з'єднати рядки», а не «скласти» і в результаті: Hello world!33 I am a student. ». Якщо Ви бажаєте скласти 3 та 3 перед створенням рядка, використовуйте дужки.

Document.write (a + (3 + 3) + b);

Даний вираз поєднує рядок «а», результат виразу «3 + 3» і «b», в результаті: «Hello world!6 I am a student. ».

indexOf

Один з найбільш широко використовуваних інтегрованих способів це «indexOf». Кожен символ має свій індекс, що містить номер його позиції у рядку. Зауважимо, що індекс першого символу - 0, другого - 1 і т. д. Таким чином, індекс символу "w" у терміні "а" - 6 .

Використовуючи «indexOf», ми можемо вивести індекс символу. Напишіть « .indexOf(" ") після назви рядка і вставте шуканий символ між лапками. Наприклад:

Var a = "Hello world!"; document.write(a.indexOf("w"));

поверне 6 . Якщо символ зустрічається кілька разів, метод повертає перше входження. Тобто

Document.write(a.indexOf("o"));

поверне 4 , тому що це індекс першої «o» у рядку.

Ви також можете знайти комбінацію символів. (Звичайно, це теж рядок, але, щоб уникнути плутанини, я не називатиму її так). "indexOf" повертає позицію першого символу комбінації. Наприклад:

Document.write(a.indexOf("o w"));

теж поверне 4 тому, що це індекс «o».

Більш того, можливий пошук символу після певного індексу. Якщо Ви введете

Document.write(a.indexOf("o", 5));

то отримаєте індекс першої «o», що йде за символом з індексом 5 (це пробіл), тобто результат буде - 7 .

Якщо символ або комбінація не зустрічається в рядку, "indexOf" поверне "-1". Це, по суті, найпопулярніше застосування indexOf: перевірка існування певної комбінації символів. Воно є ядром скрипта, що визначає браузер. Для визначення IE Ви берете рядок:

Navigator.userAgent;

і перевіряєте, чи містить вона «MSIE»:

If(navigator.userAgent.indexOf("MSIE") != -1) ( // Будь-які дії з Internet Explorer )

Якщо індекс "MSIE" - не "-1" (якщо "MSIE" зустрічається десь у рядку), то поточний браузер - IE.

lastIndexOf

Також існує метод «lastIndexOf», який повертає останнє входження символу чи комбінації. Він діє протилежно "indexOf". Команда

Var b = "I am a student."; document.write(b.lastIndexOf("t"));

поверне 13 , тому що це індекс останньої t у рядку.

charAt

Метод «charAt» повертає символ, що стоїть на цій позиції. Наприклад, коли Ви вводите

Var b = "I am a student."; document.write(b.charAt(5));

в результаті виходить «a», оскільки це символ на шостій позиції (пам'ятайте, що індекс першого символу починається з 0).

length

Метод "length" повертає довжину рядка.

Var b = "I am a student."; document.write(b.length);

поверне «15». Довжина рядка на 1 більша, ніж індекс останнього символу.

split

split - це спеціальний метод, що дозволяє розділити рядок за певними символами. Використовується, коли результат необхідно заносити до масиву, а не до простої змінної. Давайте розділимо "b" за пробілами:

Var b = "I am a student." var temp = новий Array(); temp = b.split(" ");

Тепер рядок розбитий на 4 підрядки, які поміщаються в масив temp. Самі прогалини зникли.

Temp = "I"; temp = "am"; temp = "a"; temp="student";

Метод substring використовується для виділення частини рядка. Синтаксис методу: ". substring (перший_індекс, останній_індекс)". Наприклад:

Var a = "Hello world!"; document.write(a.substring(4, 8));

поверне "o wo", від першої "o" (індекс 4) до другої (індекс 7). Зауважте, що «r» (індекс 8) не є частиною підрядка.

Також можна написати:

Var a = "Hello world!"; document.write(a.substring(4));

Це дасть цілу підрядку «o world! », починаючи від символу з індексом 4 до кінця рядка.

substr

Також є метод "substr", який працює трохи по-іншому. Як другий аргумент він використовує не номер індексу, а кількість символів. Тобто

Document.write(a.substr(4, 8));

повертає 8 символів, починаючи від символу з індексом 4 ("o"), тобто в результаті отримуємо: "o world!" »

доLowerCase і toUpperCase

Нарешті, 2 методи, які іноді можуть стати Вам у нагоді: «toLowerCase» переводить весь рядок у нижній регістр, а «toUpperCase» — у верхній.

Var b = "I am a student."; document.write(b.toUpperCase());

В результаті отримаємо "I AM A STUDENT". ».

Вітаю всіх, хто ґрунтовно вирішив вивчити прототипно-орієнтовану мову. Минулого я розповів вам про , а сьогодні ми розбиратимемо рядки JavaScript-а. Так як у цій мові всі текстові елементи є рядками (немає окремого формату для символів), ви можете самі здогадатися, що цей розділ займає значну частину у вивченні синтаксису js.

Саме тому в цій публікації я розповім вам, як створюються малі елементи, які методи та властивості для них передбачені, як правильно конвертувати рядки, наприклад, перетворювати на число, яким чином можна отримати потрібне підрядження та багато іншого. На додаток до цього я прикріплю приклади програмного коду. А тепер уперед за справу!

Синтаксис малих змінних

У мові js всі змінні оголошуються за допомогою ключового слова var, а в залежності від формату оформлення параметрів визначається тип оголошеної змінної. Як ви пам'ятаєте з JavaScript, у JavaScript-і відсутня сувора типізація. Саме тому в коді і ось така ситуація.

При ініціалізації змінних значенняможуть бути обрамлені в подвійні, одинарні, а починаючи з 2015 року та в скошені одинарні лапки. Нижче наведено приклади кожного способу оголошення рядків.

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

З його допомогою можна спокійно здійснювати перенесення рядка і це буде виглядати так:

alert (`кілька

переношу

А ще третій спосіб дозволяє використовувати конструкцію $(…). Такий інструмент потрібний для вставки інтерполяції. Не лякайтеся, зараз розповім, що це таке.

Завдяки $(…) у рядки можна вставляти не тільки значення змінних, а ще й виконувати з ними арифметичні та логічні операції, Викликати методи, функції і т.д. Усе це називається одним терміном – інтерполяція. Ознайомтеся із прикладом реалізації цього підходу.

1 2 3 var pen = 3; var pencil = 1; alert(`$(pen) + $(pencil*5) = $(pen + pencil)`);

var pen = 3; var pencil = 1; alert(`$(pen) + $(pencil*5) = $(pen + pencil)`);

У результаті екран виведеться вираз: «3 + 1*5 = 8».

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

Поговоримо трохи про спеціальні символи

У багатьох мовах програмування є спеціальні символи, які допомагають керувати текстом у рядках. Найвідоміший серед них – це перенесення рядка (\n).

Всі аналогічні інструменти спочатку починаються зі зворотного слєша (\) і після йдуть букви англійського алфавіту.

Нижче я прикріпив невелику табличку, де перелічені деякі спеціальні символи.

Запасаємось важким арсеналом методів та властивостей

Розробниками мови було передбачено безліч методів та властивостей для спрощення та оптимізації роботи з рядками. А з випуском нового стандарту під назвою ES-2015 минулого року, цей список поповнився новими інструментами.

Length

Почну з найпопулярнішої властивості, яка допомагає дізнатися довжину значень малих змінних. Це length. Він використовується таким чином:

var string = "Єдинороги";

alert (string.length);

У відповіді буде виведено число 9. Також цю властивість можна застосовувати і до самих значень:

"Єдинороги". length;

Результат не зміниться.

charAt()

Цей метод дозволяє витягти певний символ із тексту. Нагадую, що нумерація починається з нуля, тому щоб витягнути перший символ з рядка, необхідно прописати такі команди:

var string = "Єдинороги";

alert(string.charAt(0));.

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

Від toLowerCase() до toUpperCase()

Ці методи керують регістром символів. Під час написання коду «Контент».

доUpperCase()все слово буде відображено великими літерами.

Для протилежного ефекту варто використовувати Контент. доLowerCase ().

indexOf()

Затребуваний і необхідний засіб для пошуку підрядка. Як аргумент потрібно вписати слово або фразу, яку необхідно знайти, а метод повертає позицію знайденого елемента. Якщо ж не знайдений текст, користувачеві повернеться «-1».

1 2 3 4 var text = "Організувати пошук кольорів!"; alert(text.indexOf("колір")); //19 alert(text.indexOf(" ")); //12 alert(text.lastIndexOf(" ")); //18

var text = "Організувати пошук кольорів!"; alert(text.indexOf("колір")); //19 alert(text.indexOf(" ")); //12 alert(text.lastIndexOf(" ")); //18

Зауважте, що lastIndexOf() виконує ті ж дії, тільки пошук здійснюється з кінця пропозиції.

Вилучення підрядків

Для цього дії в js було створено три приблизно однакові методи.

Розберемо спочатку substring (start, end)і slice (start, end). Працюють однаково. Перший аргумент визначає початкову позицію, з якої почнеться вилучення, а другий відповідає за кінцевий пункт зупинки. В обох методах рядок виймається, не включаючи символ, розташований на позиції end.

var text = "Атмосфера"; alert(text.substring(4)); // виведе "сфера" alert(text.substring(2, 5)); / / Відобразить "мос" alert (text.slice (2, 5)); //Відобразить «мос»

А тепер розберемо третій метод, який називається substr(). У ньому також потрібно прописувати 2 аргументи: startі length.

Перший вказує початкову позицію, а другий – кількість символів, які потрібно одержати. Щоб відстежити різницю між цими трьома інструментами, я скористався з минулого прикладу.

var text = "Атмосфера";

alert (text.substr (2, 5)); //Відобразить «мосфі»

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

Replase ()

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

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

var text = "Атмосфера Атмосфера"; var newText = text.replace("Атмо","Страто") alert(newText) // Результат: Стратосфера Атмостфера

А в цій програмній реалізації через прапор регулярного вираження “g” буде виконано глобальну заміну.

var text = "Атмосфера Атмосфера"; var newText = text.replace(/Атмо/g,"Страто") alert(newText) // Результат: Стратосфера Стратосфера

Займемося конвертацією

У JavaScript передбачено лише три види перетворення типів об'єктів:

  1. Числове;
  2. Строкове;
  3. Логічне.

У поточній публікації я розповім про 2 з них, оскільки знання про них потрібні для роботи з рядками.

Числове перетворення

Щоб значення елемента явно перетворити до числового вигляду, можна використовувати Номер (value).

Є й коротший вираз: +«999».

var a = Number («999»);

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

Виконується функцією alert, а також явним викликом String (text).

 

 
Це цікаво: