Меню
✘Скрыть меню
Меню заработка
✘Скрыть меню
Загрузка.. nostroma.online from NOSTROMA - best life and beautiful workЭто ужасно тяжелая работа — ничего не делать – Оскар УайльдРешающую роль в работе играет не всегда материал, но всегда мастер – Максим ГорькийЯ слишком энергичен, чтобы работать – Марсель АшарЧто привлекло меня в карьере писателя? Отсутствие бумажной работы.Одни люди работают только для того чтобы работать, другие – для того, чтобы иметь возможность не работать в будущем.Занятие ерундой на рабочем месте развивает боковое зрение, слух и бдительность в целомСтоит статýя в лучах заката с огромным буем, в руках - граната.Друзья, если вы попались на лохотрон, не будьте эгоистами - предупредите других о таком сайте!Секрет гения — это работа, настойчивость и здравый смысл. Томас Эдисон
Меню заработка

Курсы JavaScript

Урок 10. Строки и регулярные выражения в JavaScript. Метод replace.


Строки в JavaScript

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

	var string = "Привет, мир!"; // строка
	var string2 = "25"; //  и это строка
	var string2 = "false"; //  и это тоже строка
	

Когда происходит сравнение строк, то две строки считаются одинаковы, если они одинаковой длины и все символы в них совпадают по индексам.

Познакомимся с двумя новыми методами для работы со строковым типом данных:
1. substr - собирает новую строку из исходной, начиная с указанной стартовой метки и заканчивая указанной конечной меткой или до конца исходной строки.

Синтаксис метода: var sub = string.substr(start, length);

string - исходная строка
start - начальная позиция, начиная от нулевого символа исходной строки. Если значение меньше ноля, то отсчёт ведётся от конца строки.
length - сколько символов требуется брать от метки start. Если этот параметр не указан, то меткой считается конец строки (либо начало - при отрицательном start)
Пример:

	var string = "Александр";
	var sub = string.substr(0, 5);
	
	console.log(sub);
	// Выведет "Алекс"
	


2. substring - имеет тот же синтаксис и делает тоже самое, но вторым параметром указывается номер символа исходной строки, до которого формируется новая строка (отсчёт ведется от 0-го символа), не включая этот символ.

	var string = "Александр";
	var sub = string.substring(0, 5);
	
	console.log(sub);
	// Выведет "Алекс"
	

Таким образом, эти два метода различаются только вторым параметром - в substring он указывает конечный символ, а в substr - длину строки:

	var string = "Александр";
	var substr = string.substr(1, 5);
	var substring = string.substring(1, 5);
	
	console.log(substr);
	// Выведет "лекса"
	
	console.log(substring);
	// Выведет "лекс"
	

Регулярные выражения

Регулярные выражения задают правила для проверки строк. Это огромная отдельная тема и здесь мы только слегка коснёмся её. Регулярные выражения - это не только поиск и замена в строках, но и роутинг маршрутов при наборе URL.

Познакомимся с методом test, который используется для сверки строки с регулярным выражением.

Синтаксис метода: regexp.test(str);

regexp - шаблон регулярного выражения
str - строка для сверки с шаблоном

	var string = "Aleksandr";
	/[^A-Za-z]/.test(string);
	
	// false
	

Между слешами в квадратных скобках указано регулярное выражение, в котором указано, что от начала строки (^) должны быть только английские символы. В случае, если строка совпала с шаблоном регулярного выражения, метод test вернёт false, что означает в данном случае отсутствие несоответствий.

Этим выражением можно проверять строки на наличие нежелательных символов, например, при заполнении полей ввода на сайте. В следующем примере мы проверяем поле ввода при отправки формы, в котором должны быть только английские символы и ничего больше:

<!DOCTYPE html>
	<html>
		<head>
			<meta charset="utf-8">
			<title>Проверка полей ввода</title>
			<script>
				window.addEventListener("submit", check);
				
				function check(){
					/* Создаём переменную input, в которую получаем значение,
					введённое в поле ввода. Это осуществляется через
					метод value */
					var input = document.querySelector("#inp").value;
					
					if(/[^A-Za-z]/.test(input) == true){
						alert("Недопустимые символы!");
					} else{alert("Все вимволы английские");}
				}
			</script>
		</head>
		<body>
		
		<h1>Проверка поля ввода при отправке</h1>
		
		<form>
			<input type="text"  id="inp"  />
			<input type="submit" />
		</form>
		
		</body>
	</html>
Показать в браузере (откроется в новой вкладке)

Обратите внимание, что в этом примере мы задали событие submit для функции-слушателя - это событие происходит, когда пользователь нажимает кнопку "Отправить".

Для проверки полей при отправки формы применяется событие onsubmit, которое прописывается в виде атрибута, значением которого указывается нужный скрипт. Либо метод JS form.onsubmit, например, form.onsubmit = check; - где check функция (без круглых скобок), которая будет осуществлять проверку формы.

Метод replace

Метод replace позволяет указать строку замены или функцию обратного вызова, которая её возвращает.

Синтаксис метода: var str = string.replace(regexp, newString|function); где -

string - исходная строка, в которой производится поиск и замена
regexp - регулярное выражение или строка для поиска
newString|function - новая подстрока или функция, возвращающая её


	var str = "строка и ещё строка";
	str.replace("строка", "замена");
	
	/* "замена и ещё строка" */
	

Для глобального поиска используется регулярное выражение:


	var str = "строка и ещё строка";
	str.replace(/строка/g, "замена");
	
	/* "замена и ещё замена" */
	

Комментарии

Введите Ваше имя:*

Введите e-mail:

Ваш комментарий:*

* Обязательные поля