​🧾 Методы строк в JavaScript (часть 1)

Методы строк помогают работать со строками.

Методы строк и свойства

Примитивные значения, такие как "Щипунов Андрей", не могут иметь свойств или методов (потому что они не являются объектами).

Но с помощью JavaScript методы и свойства также доступны для примитивных значений, поскольку JavaScript обрабатывает примитивные значения как объекты при выполнении методов и свойств.

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 2)

Длина строки

Свойство length возвращает длину строки.

var txt = "АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯ";
var sln = txt.length;

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

Метод indexOf() возвращает индекс (положение) на first вхождения указанного текста в строке.

Пример:

var str = "Пожалуйста, найдите, где происходит 'размещение'!";
var pos = str.indexOf("размещение");

JavaScript считает позиции с нуля.
0 - первая позиция в строке, 1 - вторая, 2 - третья и т.д.

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 3)

Метод lastIndexOf() возвращает индекс последнего вхождения указанного текста в строке.

Пример:

var str = "Пожалуйста, найдите, где происходит 'размещение'!";
var pos = str.lastIndexOf("размещение");

Оба indexOf(), и lastIndexOf() возвращают -1, если текст не найден.

Пример:

var str = "Пожалуйста, найдите, где происходит 'размещение'!";
var pos = str.lastIndexOf("размещение");

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 4)

Оба метода принимают второй параметр в качестве начальной позиции для поиска.

Пример:

var str = "Пожалуйста, найдите, где происходит 'размещение'!";
var pos = str.indexOf("размещение", 15);

Эти lastIndexOf() методы выполняют поиск в обратном направлении (от конца к началу), что означает: если второй параметр равен 15, поиск начинается с позиции 15 и выполняется поиск до начала строки.

Пример:

var str = "Пожалуйста, найдите, где происходит 'размещение'!";
var pos = str.lastIndexOf("размещение", 15);

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 5)

Поиск строки в строке
В search() методе ищет строку для указанного значения и возвращает позицию матча.

Пример:

var str = "Пожалуйста, найдите, где происходит 'размещение'!";
var pos = str.search("размещение");

Два метода, indexOf() и search(), равны?

Они принимают одни и те же аргументы (параметры) и возвращают одно и то же значение?

Эти два метода НЕ равны. Вот отличия:

• Метод search() не может принимать второй аргумент позиции начала.

• Метод indexOf() не может принимать мощные значения поиска (регулярные выражения).

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 6)

Извлечение строчных частей.

Есть 3 метода извлечения части строки:

1. slice(start, end)
2. substring(start, end)
3. substr(start, length)

1. Метод slice()
Метод slice() извлекает часть строки и возвращает извлеченную часть в новой строке.

Метод принимает 2 параметра: начальную позицию и конечную позицию (конец не включен).

В этом примере часть строки вырезается из позиции 7 в позицию 12 (13-1).

Пример:

var str = "Яблоко, Банан, Киви";
var res = str.slice(7, 13);

Результатом res будет:

Банан

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 7)

Помните: JavaScript считает позиции с нуля. Первая позиция - 0.

Если параметр отрицательный, позиция отсчитывается от конца строки

В этом примере часть строки вырезается из позиции -12 в позицию -6.

Пример:

var str = "Яблоко, Банан, Киви";
var res = str.slice(-12, -6);

Результатом res будет:

Банан

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 8)

Если вы опустите второй параметр, метод вырежет остальную часть строки

Пример:

var res = str.slice(7);

или, считая с конца.

Пример:

var res = str.slice(-12);

Отрицательные позиции не работают в Internet Explorer 8 и ранее.

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 9)

Метод substring():

Метод substring() похож на slice().

Разница в том, что substring() не может принимать отрицательные индексы.

Пример:

var str = "Яблоко, Банан, Киви";
var res = str.substring(7, 13);

Результатом res будет:

Банан

Если вы опустите второй параметр, substring() оставшаяся часть строки будет вырезана.

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 10)

Метод substr():

Метод substr() похоже на slice().

Разница в том, что второй параметр указывает длину извлеченной части.

Пример:

var str = "Яблоко, Банан, Киви";
var res = str.substr(7, 6);

Результатом res будет:

Банан

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 11)

Если вы опустите второй параметр, substr() оставшаяся часть строки будет вырезана.

Пример:

var str = "Яблоко, Банан, Киви";
var res = str.substr(7);

Результатом res будет:

Банан, Киви

Если первый параметр отрицательный, позиция отсчитывается от конца строки.

Пример:

var str = "Яблоко, Банан, Киви";
var res = str.substr(-4);

Результатом res будет:

Киви

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 12)

Замена содержимого строки
Метод replace() заменяет указанное значение с другим значением в строке.

Пример:

str = "Пожалуйста, посетите Microsoft!";
var n = str.replace("Microsoft", "Schoolsw3");

Метод replace() не изменяет строку она вызвана. Он возвращает новую строку.

По умолчанию replace() метод заменяет только первое совпадение:

Пример:

str = "Пожалуйста, посетите Microsoft и Microsoft!";
var n = str.replace("Microsoft", "Schoolsw3");

По умолчанию replace() метод чувствителен к регистру. Записать MICROSOFT (в верхнем регистре) не получится.

Пример:

str = "Пожалуйста, посетите Microsoft!";
var n = str.replace("MICROSOFT", "Schoolsw3");

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 13)

Чтобы заменить нечувствительность к регистру, используйте регулярное выражение с /i флагом (нечувствительность):

Пример:

str = "Пожалуйста, посетите Microsoft!";
var n = str.replace(/MICROSOFT/i, "Schoolsw3");

Обратите внимание, что регулярные выражения пишутся без кавычек.

Чтобы заменить все совпадения, используйте регулярное выражение с /g флагом (глобальное совпадение):

Пример:

str = "Пожалуйста, посетите Microsoft и Microsoft!";
var n = str.replace(/Microsoft/g, "Schoolsw3");

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 13)

Чтобы заменить нечувствительность к регистру, используйте регулярное выражение с /i флагом (нечувствительность):

Пример:

str = "Пожалуйста, посетите Microsoft!";
var n = str.replace(/MICROSOFT/i, "Schoolsw3");

Обратите внимание, что регулярные выражения пишутся без кавычек.

Чтобы заменить все совпадения, используйте регулярное выражение с /g флагом (глобальное совпадение):

Пример:

str = "Пожалуйста, посетите Microsoft и Microsoft!";
var n = str.replace(/Microsoft/g, "Schoolsw3");

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 14)

Преобразование в верхний и нижний регистр
Строка преобразуется в верхний регистр с помощью toUpperCase().

Пример:

var text1 = "Привет, мир!"; // Строка
var text2 = text1.toUpperCase(); // text2 к text1, преобразованный в верхний

Строка преобразуется в нижний регистр с помощью toLowerCase().

Пример:

var text1 = "Привет, мир!"; // Строка
var text2 = text1.toLowerCase(); // text2 к text1, преобразованный в нижний

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 15)

Метод concat():

Метод concat() объединяет две или более строк.

Пример:

var text1 = "Привет";
var text2 = "Мир";
var text3 = text1.concat(" ", text2);

Этот concat() метод можно использовать вместо оператора плюс. Эти две строки делают то же самое.

Пример:

var text = "Привет" + " " + "Мир!";
var text = "Привет".concat(" ", "Мир!");

Все строковые методы возвращают новую строку. Они не изменяют исходную строку.
Формально сказано: строки неизменяемы: строки нельзя изменить, их можно только заменить.

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Методы строк в JavaScript (часть 16)

Метод trim():

Метод trim() удаляет пробельные символы с обеих сторон строки:

Пример:

var str = " Привет, мир! ";
alert(str.trim());

Этот trim() метод не поддерживается в Internet Explorer 8 и ниже.

Если вам нужна поддержка IE 8, вы можете использовать replace() вместо этого регулярное выражение:

Пример:

var str = " Привет, мир! ";
alert(str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''));

Вы также можете использовать решение замены выше, чтобы добавить функцию обрезки в JavaScript String.prototype:

Пример:

if (!String.prototype.trim) {
String.prototype.trim = function () {
return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
};
}
var str = " Привет, мир! ";
alert(str.trim());

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Как найти подстроку в строке в JavaScript?

Метод charAt возвращает символ по указанному индексу.

Метод includes проверяет, содержит ли строка переданную подстроку. Возвращается true либо false. Вторым параметром возможно передать индекс в строке, с которого надо начать поиск, но это необязательно.

Метод search проверяет, присутствует ли в строке переданное значение либо регулярное выражение и возвращает индекс начала совпадения. В случае, если переданное значение не найдено, возвращается -1.

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev

​🧾 Замыкание в JavaScript (Часть 1)

JavaScript – язык с сильным функционально-ориентированным уклоном. Он даёт нам много свободы. Функция может быть динамически создана, скопирована в другую переменную или передана как аргумент другой функции и позже вызвана из совершенно другого места.

Мы знаем, что функция может получить доступ к переменным из внешнего окружения, эта возможность используется очень часто. Что произойдет, когда переменные изменятся? Ответим на эти и другие вопросы.

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

1. Функция sayHi использует внешнюю переменную name. Какое значение будет использовать функция при выполнении?

let name = "John";

function sayHi() {
alert("Hi, " + name);
}

name = "Pete";

sayHi(); // что будет показано: "John" или "Pete"?

Такие ситуации распространены и в браузерной и в серверной разработке. Выполнение функции может быть запланировано позже, чем она была создана, например, после какого-нибудь пользовательского действия или сетевого запроса.

📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev