Строки JavaScript

Строки JavaScript
it-academy.uz

Строки
Строки JavaScript используются для хранения текста и управления им.
Строка JavaScript - это ноль или более символов, записанных в кавычках.
it-academy.uz
Введение в javascript
var carName1 = "Volvo XC60"; // Double quotes
var carName2 = 'Volvo XC60'; // Single quotes
var x = "John Doe";
Вы можете использовать кавычки внутри строки, если они не соответствуют кавычкам, окружающим строку:
var answer1 = "It's alright";
var answer2 = "He is called 'Johnny'";
var answer3 = 'He is called "Johnny"';

Длина строки
Чтобы узнать длину строки, используйте встроенное свойство длины:
<br>var txt =</div></h3></h3><img onerror="this.setAttribute(&#39;data-error&#39;, 1)" width="720" height="540" alt="Длина строки Чтобы узнать длину строки, используйте встроенное свойство длины: var txt" loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_480x360/imagesDir/jpg/1090763/slide-3.jpg 480w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_720x540/imagesDir/jpg/1090763/slide-3.jpg 720w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_960x720/imagesDir/jpg/1090763/slide-3.jpg 960w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_1440x1080/imagesDir/jpg/1090763/slide-3.jpg 1440w" src="/_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_1440x1080/imagesDir/jpg/1090763/slide-3.jpg" class="slides-image"><!----><div class="slides-content">"ABCDEFGHIJKLMNOPQRSTUVWXYZ";<br>var sln = txt.length;<br>document.getElementById("demo").innerHTML = sln;<br>
Пропуск символов
Поскольку строки должны быть записаны в кавычках, JavaScript неправильно поймет эту строку:
var x = "We are the so-called "Vikings" from the north.";
Строка будет перерезана до "We are the so-called ".
Решение избежать этой проблемы - использовать escape-символ обратной косой черты.
Управляющий символ обратной косой черты (\) превращает специальные символы в строковые символы:

Пропуск символов
<br>var x = "We are the so-called \"Vikings\" from the</div></h3></h3><img onerror="this.setAttribute(&#39;data-error&#39;, 1)" width="720" height="540" alt="Пропуск символов var x = &quot;We are the so-called \&quot;Vikings\&quot; from the north.&quot;; document.getElementById(&quot;demo&quot;).innerHTML = x;" loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_480x360/imagesDir/jpg/1090763/slide-4.jpg 480w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_720x540/imagesDir/jpg/1090763/slide-4.jpg 720w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_960x720/imagesDir/jpg/1090763/slide-4.jpg 960w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_1440x1080/imagesDir/jpg/1090763/slide-4.jpg 1440w" src="/_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_1440x1080/imagesDir/jpg/1090763/slide-4.jpg" class="slides-image"><!----><div class="slides-content">north.";<br>document.getElementById("demo").innerHTML = x; <br>

Пример 2
<br>var x = 'It\'s alright.';<br>document.getElementById("demo").innerHTML = x; <br>
var x = "The character \\ is called backslash.";
В JavaScript действительны шесть других escape-последовательностей:
Приведенные выше 6 escape-символов изначально были разработаны для управления пишущими машинками, телетайпами и факсами. Они не имеют смысла в HTML.

Прерывание длинных строк кода
Для лучшей читаемости программисты часто избегают строк кода длиннее 80 символов.
Если оператор JavaScript не умещается в одной строке, лучше всего его прервать после оператора:
document.getElementById("demo").innerHTML = \
"Hello Dolly!";

Строки могут быть объектами
Обычно строки JavaScript предоставляют собой примитивные значения, созданные из литералов:
var firstName = "John";
Наши строки могут быть устойчивыми как объекты с также ключевым словом new:
var firstName = new String("John");
var y = new String("John");
// typeof x will return string
// typeof y will return object
Не создавайте строки как объекты. Это снижает скорость выполнения. Ключевое слово усложняет код. Это может привести к неожиданным результатам:

Пример 3
var x = "John";
var y = new String("John");
// (x == y) is true because x and y have equal values
var x = "John";
var y = new String("John");
// (x === y) is false because x and y have different types (string and object)
var x = new String("John");
var y = new String("John");
// (x == y) is false because x and y are different objects
var x = new String("John");
var y = new String("John");
// (x === y) is false because x and y are different objects
Обратите внимание на разницу между (x == y) и (x === y).
Сравнение двух объектов JavaScript всегда возвращает false.

Строковые методы JavaScript
Строковые методы помогают работать со строками.
Строковые методы и свойства
Примитивные значения, такие как «Джон Доу», не имеют свойств или методов (потому что они не являются объектами).
С помощью JavaScript методы и свойства также доступны для примитивных значений, потому что JavaScript обрабатывает примитивные значения как объекты при выполнении методов и свойств.
Длина строки
lengthСвойство возвращает длину строки:
<br>var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";<br>var sln = txt.length;<br>document.getElementById("demo").innerHTML = sln;<br>

Поиск строки в строке
indexOf() метод возвращает позицию первого вхождения указанного текста
var str = "Please locate where 'locate' occurs!";
var pos = str.indexOf("locate");
JavaScript считает позиции с нуля.
0 - первая позиция в строке, 1 - вторая, 2 - третья ...
Метод lastIndexOf () возвращает индекс последнего вхождения указанного текста в строку:
<br>var str = "Please locate where 'locate' occurs!";<br>var pos = str.lastIndexOf("locate");<br>document.getElementById("demo").innerHTML = pos;<br>

Методы
И indexOf (), и lastIndexOf () возвращают -1, если текст не найден.
h2>JavaScript String Methods
Both indexOf(), and lastIndexOf() return -1 if the text is not found:
<br>var str = "Please locate where 'locate' occurs!";<br>var pos = str.indexOf("John");<br>document.getElementById("demo").innerHTML = pos;<br>
Оба метода принимают второй параметр в качестве начальной позиции для поиска:
var str = "Please locate where 'locate' occurs!";
var pos = str.indexOf("locate", 15);
Методы lastIndexOf () выполняют поиск в обратном направлении (от конца к началу), что означает: если второй параметр равен 15, поиск начинается с позиции 15 и выполняется до начала строки.

Поиск строки в строке
var str = "Please locate where 'locate' occurs!";
var pos = str.search("locate");
Метод search () ищет в строке указанное значение и возвращает позицию совпадения:
Ты заметил?
Два метода, indexOf () и search (), равны?
Они принимают одни и те же аргументы (параметры) и возвращают одно и то же значение?
Эти два метода НЕ равны. Вот отличия:
Метод search () не может принимать второй аргумент начальной позиции.
Метод indexOf () не может принимать мощные поисковые значения (регулярные выражения).
Вы узнаете больше о регулярных выражениях в следующей главе.

Извлечение части строк
Есть 3 метода извлечения части строки:
slice(start, end) (начало, конец)
substring(start, end) (начало, конец)
substr(start, length) (начало, длина)
slice () извлекает часть строки и возвращает извлеченную часть в новой строке.
Метод принимает 2 параметра: начальную позицию и конечную позицию (конец не включен).
В этом примере часть строки вырезается из позиции 7 до позиции 13:
var str = "Apple, Banana, Kiwi";
var res = str.slice(7, 13);
Помните: JavaScript считает позиции с нуля. Первая позиция - 0.

строки
Если параметр отрицательный, позиция отсчитывается от конца строки.
В этом примере часть строки вырезается из позиции -12 в позицию -6:
var str = "Apple, Banana, Kiwi";
var res = str.slice(-12, -6);
Отрицательные позиции не работают в Internet Explorer 8 и ранее.
Метод substring ()
substring () похожа на slice ().
var str = "Apple, Banana, Kiwi";
var res = str.substring(7, 13);
Если вы опустите второй параметр, substring () вырежет оставшуюся часть строки.

Метод substr ()
substr () похожа на slice ().
Разница в том, что второй параметр указывает длину извлеченной части.
var str = "Apple, Banana, Kiwi";
var res = str.substr(7, 6);
var str = "Apple, Banana, Kiwi";
var res = str.substr(7);
Banana
Banana, Kiwi
Если первый параметр отрицательный, позиция отсчитывается от конца строки.
var str = "Apple, Banana, Kiwi";
var res = str.substr(-4);
Kiwi

Замена содержимого строки
Метод replace () заменяет указанное значение другим значением в строке:
str = "Please visit Microsoft!";
var n = str.replace("Microsoft", "W3Schools");
Метод replace () не изменяет строку, для которой он вызывается. Возвращает новую строку.
По умолчанию метод replace () заменяет только первое совпадение:
str = "Please visit Microsoft and Microsoft!";
var n = str.replace("Microsoft", "W3Schools");
По умолчанию метод replace () чувствителен к регистру. Записать MICROSOFT (в верхнем регистре) не получится:

Строка преобразуется в нижний регистр с помощью toLowerCase ():
var text1 = "Hello World!"; // String
var text2 = text1.toLowerCase(); // text2 is text1 converted to lower
Метод concat ()
concat () объединяет две или более строк:
var text1 = "Hello";
var text2 = "World";
var text3 = text1.concat(" ", text2);
<br>var text1 = "Hello";<br>var text2 = "World!";<br>var text3 = text1.concat(" ",text2);<br>document.getElementById("demo").innerHTML = text3;<br>
Все строковые методы возвращают новую строку. Они не изменяют исходную строку.
Формально сказано: строки неизменяемы: строки не могут быть изменены, их можно только заменить.

String.trim ()
Метод trim () удаляет пробелы с обеих сторон строки:
var str = " Hello World! ";
alert(str.trim());
Метод trim () не поддерживается в Internet Explorer 8 и более ранних версиях.
Вы также можете использовать решение для замены выше, чтобы добавить функцию обрезки в JavaScript String.prototype:
if (!String.prototype.trim) {
String.prototype.trim = function () {
return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
};
}
var str = " Hello World! ";
alert(str.trim());

javaScript String Padding
В ECMAScript 2017 добавлено два метода String: padStart и padEnd для поддержки заполнения в начале и в конце строки.
let str = "5";
str = str.padStart(4,0);
// result is 0005
let str = "5";
str = str.padEnd(4,0);
// result is 5000
Заполнение строк не поддерживается в Internet Explorer.
Firefox и Safari были первыми браузерами с поддержкой строкового заполнения JavaScript.

Извлечение строковых символов
Есть 3 метода извлечения строковых символов:
charAt (позиция)
charCodeAt (позиция)
Доступ к собственности []
var str = "HELLO WORLD";
str.charAt(0); // returns H
Метод charCodeAt ()
Метод charCodeAt () возвращает юникод символа по указанному индексу в строке:
Метод возвращает код UTF-16 (целое число от 0 до 65535).
var str = "HELLO WORLD";
str.charCodeAt(0); // returns 72

Доступ к свойствам
ECMAScript 5 (2009) разрешает доступ к свойствам [] для строк:
var str = "HELLO WORLD";
str[0]; // returns H
Доступ к свойствам может быть немного непредсказуемым:
Не работает в Internet Explorer 7 или более ранней версии.
Это делает строки похожими на массивы (но это не так).
Если символ не найден, [] возвращает значение undefined, а charAt () возвращает пустую строку.
Он доступен только для чтения. str [0] = "A" не выдает ошибки (но не работает!).
var str = "HELLO WORLD";
str[0] = "A"; // Gives no error, but does not work
str[0]; // returns H
Если вы хотите работать со строкой как с массивом, вы можете преобразовать ее в массив.

Преобразование строки в массив
Преобразование строки в массив
Строку можно преобразовать в массив с помощью метода split ():
var txt = "a,b,c,d,e"; // String
txt.split(","); // Split on commas
txt.split(" "); // Split on spaces
txt.split("|"); // Split on pipe
Если разделитель опущен, возвращаемый массив будет содержать всю строку в индексе [0].
Если разделитель "", возвращаемый массив будет массивом отдельных символов:
var txt = "Hello"; // String
txt.split(""); // Split in characters

Методы String HTML Wrapper
Методы оболочки HTML возвращают строку, заключенную в соответствующий тег HTML.
Это нестандартные методы, и они могут работать не во всех браузерах.
anchor () Создает привязку
big () Отображает строку с использованием большого шрифта
blink () Отображает мигающую строку
bold () Отображает строку жирным шрифтом
fixed () Отображает строку с использованием шрифта с фиксированным шагом
fontcolor () Отображает строку с использованием указанного цвета
fontsize () Отображает строку заданного размера
курсив () Отображает строку курсивом
link () Отображает строку как гиперссылку
small () Отображает строку мелким шрифтом
strike () Отображает строку с зачеркиванием
sub () Отображает строку как нижний текст
sup () Отображает строку в виде надстрочного текста

Строковые методы
Описание метода
charAt () Возвращает символ по указанному индексу (позиции)
charCodeAt () Возвращает Unicode символа по указанному индексу
concat () Объединяет две или более строк и возвращает новые соединенные строки
endWith () Проверяет, заканчивается ли строка указанной строкой / символами
fromCharCode () Преобразует значения Unicode в символы
includes () Проверяет, содержит ли строка указанную строку / символы
indexOf () Возвращает позицию первого найденного вхождения указанного значения в строке
lastIndexOf () Возвращает позицию последнего найденного вхождения указанного значения в строке
localeCompare () Сравнивает две строки в текущей локали
match () Ищет в строке совпадение с регулярным выражением и возвращает совпадения.
repeat () Возвращает новую строку с указанным количеством копий существующей строки
replace () Ищет в строке указанное значение или регулярное выражение и возвращает новую строку, в которой указанные значения заменяются
search () Ищет в строке указанное значение или регулярное выражение и возвращает позицию совпадения.
slice () извлекает часть строки и возвращает новую строку
split () Разбивает строку на массив подстрок
startWith () Проверяет, начинается ли строка с указанных символов
substr () Извлекает символы из строки, начиная с указанной начальной позиции и до указанного количества символов.
substring () Извлекает символы из строки между двумя указанными индексами
toLocaleLowerCase () Преобразует строку в строчные буквы в соответствии с локалью хоста
toLocaleUpperCase () Преобразует строку в прописные буквы в соответствии с локалью хоста
toLowerCase () Преобразует строку в строчные буквы
toString () Возвращает значение объекта String
toUpperCase () Преобразует строку в прописные буквы
trim () Удаляет пробелы с обоих концов строки
valueOf () Возвращает примитивное значение объекта String