Первый позволяет узнать, какой символ содержит строка под определенным индексом.
Второй позволяет узнать, какой код имеет символ строки под определенным индексом.
Рассмотрим пример с произвольным строковым значением переменной (или с произвольным объектом String ).
В JavaScript каждый символ имеет код, который может быть использован в некоторых случаях. Далее мы проработаем этот момент.
Для примера вернемся к букве «р» из предыдущего примера.
Она имеет Юникод U+0440 и HTML-код р
Теперь, при помощи метода charCodeAt выясним, какие коды имеют русские заглавные и строчные буквы?
2. При этом проверить, нет ли в имени помимо русских букв других символов.
3. Затем при написании имени, нужно будет пробовать вводить одну/несколько латинских букв вместо русских.
Для решения этой задачи нужно будет вспомнить тему циклов и просмотреть заметку логические операторы И и ИЛИ в Javascript. Также нужен будет метод prompt объекта Window.
Для составления условия нужен будет диапазон кодов для всех букв русского алфавита (заглавных и строчных). См. предыдущий пример.
Итак, в этом примере при помощи цикла while, условия ИЛИ и метода charCodeAt мы поочереди проверили каждую букву в имени на предмет попадания ее КОДа в диапазон кодов для всех букв русского алфавита.
Эту же задачу можно реализовать при помощи цикла for. Смотрите пример ниже.
Самые необходимые строковые и числовые методы в JavaScript
В этой статье, а скорее памятке, вы найдете все самые необходимые методы для работы со строками и числами (за исключением Math )в JavaScript, которые нужно просто знать, чтобы не городить огородов, а воспользоваться методами, доступными “из коробки”.
String
Вы также можете использовать восьмеричные и шестнадцатеричные числа:
Все другие, описанные ниже методы, это методы “из коробки”, которые работают на строках.
charAt()
Если вы зададите индекс, который не подходит по строке, то на выходе вы получите уже пустую строку.
charCodeAt()
Вызов toString() после него, отдаст шестнадцатеричное число, которое вы можете найти в любой Unicode таблице, такой как эта.
codePointAt()
Этот метод был представлен уже в ES2015, чтобы работать с Unicode символами, которые не могут быть представлены как единичная 16-ти битная Unicode единица и которым вместо этого нужно их две.
К примеру, этот китайский символ “𠮷” состоит из двух UTF-16 частей:
Комбинируем эти два unicode символа:
Вы можете получить тот же результат, но только используя codePointAt() :
Если вы создаете новый символ, комбинируя эти unicode символы:
concat()
Вы можете указывать сколько угодно аргументов и в таком случае, все эти аргументы будут объединены в строку.
endsWith()
Вы можете передать второй параметр с целым числом и endWith() будет рассматривать оригинальную строку, как если бы она этой заданной длины:
includes()
includes() также принимает второй опциональный параметр, целое число, которое указывает на позицию с которой начинать поиск.
indexOf()
Даёт позицию начала заданной строки str в строке, на которой применяется метод.
Вы можете передать второй параметр, чтобы указать точку старта:
lastIndexOf()
Даёт позицию последнего появления строки str в актуальной строке.
localeCompare()
Этот метод сравнивает строки и возвращает число (отрицательное или положительное), которое говорит, является ли данная строка меньше, равной или больше, чем строка переданная как аргумент, но в зависимости от языка.
Язык определяется настоящим местоположением или вы можете указать его, как второй аргумент:
Очень часто его используют для сортировки массивов:
Где бы вы обычно использовали:
Только тут мы можем это сделать с помощью localeCompare(), который позволит нам работать с алфавитами по всему миру.
Объект переданный как третий аргумент, может быть использован для передачи дополнительных условий. Посмотрите все возможные значения для этих условий на MDN.
match()
А вот работа с регулярными выражениями RegEx.
normalize()
Метод normalize() возвращает строку, нормализованную в соответствии с указанной формой, которую вы передаёте как параметр. ( NFC используется как стандарт, если она не указана в ручную).
padEnd()
Смысл этого метода в том, чтобы добавлять в строку символы и пробелы, пока она не достигнет заданной длины.
padEnd() был представлен в ES2017, как метод добавляющий символы в конец строки.
padStart()
Смысл этого метода в том, чтобы добавлять строки или символы как в предыдущем методе, но уже с самого начала строки:
repeat()
Этот метод был представлен в ES2015 и повторяет строки заданное количество раз:
Отдает пустую строку, если параметр не указан или параметр равен нулю. А в случае с отрицательным числом вы получите RangeError.
replace()
Отдаёт новую строку, не трогая оригинальную.
Вы можете передать регулярное выражение как первый аргумент:
replace() заменяет только первое упоминание, но а если вы будете использовать regex как поиск строки, то вы можете использовать ( /g ):
Второй параметр может быть функцией. Эта функция будет вызвана с заданным количеством аргументов, когда найдётся совпадение (или каждое совпадение в случае с regex /g ):
Отдающееся значение функции заменит совпадающую часть строки.
Это работает и для обычных строк, а не только для регулярок:
В случае c regex, когда выбираются группы, все эти значения будут переданы как аргументы прямо после параметра совпадения.
search()
Отдаёт расположение первого совпадения строки str в заданной строке.
Вы можете использовать регулярные выражения (и на самом деле, даже если вы передаёте строку, то внутренне оно тоже применяется как регулярное выражение).
slice()
Оригинальная строка не изменяется.
Если вы выставите первым параметром отрицательное число, то начальный индекс будет считаться с конца и второй параметр тоже должен быть отрицательным, всегда ведя отсчет с конца:
split()
Этот метод вырезает строку при её нахождении в строке на которой применяется метод (чувствительный к регистру) и отдаёт массив с токенами.
startsWith()
Этот метод допускает второй параметр, который позволит вам указать с какого символа вам надо начать проверку:
toLocaleLowerCase()
Этот метод отдаёт новую строку, которая представляет собой изначальную строку в нижнем регистре, в соответствии с нормами разметки указанной локали.
Собственно, первый параметр представляет локаль, но он опционален. Если его пропустить, то будет использоваться актуальная локаль:
Как и всегда, мы можем не осознавать все преимущества интернационализации, но я читал на MDN, что правила разметки текста в турецком языке отличаются от других языков, чьё описание основано на латинице.
toLocaleUpperCase()
Этот метод отдаёт новую строку, которая представляет собой изначальную строку в верхнем регистре, в соответствии с нормами разметки указанной локали.
Первым параметром указывается локаль, но это опционально, как и в случае с методом выше:
toLowerCase()
Этот метод отдаёт новую строку с текстом в нижнем регистре.
Не изменяет изначальную строку.
Не принимает параметры.
toString()
Отдает строку из заданного строчного объекта.
toUpperCase()
Отдаёт новую строку с текстом в верхнем регистре.
Не изменяет оригинальную строку.
Не принимает параметры.
Если вы передадите пустую строку, то он возвратит пустую строку.
Отдает новую строку удаляя пробелы вначале и в конце оригинальной строки.
trimEnd()
Отдаёт новую строку, удаляя пробелы только из конца оригинальной строки.
trimStart()
Отдаёт новую строку, удаляя пробелы из начала оригинальной строки.
valueOf()
Отдает строчное представление заданного строчного объекта:
Это тоже самое, что и toString()
Теперь пройдемся по числовым методам.
isInteger()
isNaN()
isSafeInteger()
parseFloat()
Парсит аргумент как дробное число и отдаёт его. Аргумент при этом является строкой:
Как вы видите Number.parseFloat() довольно гибок. Он также может конвертировать строки со словами, выделяя только первое число, но в этом случае строка должна начинаться с числа:
parseInt()
Парсит аргумент как целое число и отдаёт его:
Как вы видите Number.parseInt() тоже гибок. Он также может конвертировать строки со словами, выделяя первое число, строка должна начинаться с числа.
Вы можете передать второй параметр, чтобы указать систему счисления. Десятичная стоит по-дефолту, но вы можете применять восьмеричные и шестнадцатеричные числовые конверсии:
Email подписка!
Символьные классы
Для этого мы можем найти и удалить все, что не является числом. С этим нам помогут символьные классы.
Символьный класс – это специальное обозначение, которое соответствует любому символу из определённого набора.
Для начала давайте рассмотрим класс «цифра». Он обозначается как \d и в регулярном выражении соответствует «любой одной цифре».
Например, давайте найдём первую цифру в номере телефона:
Это был символьный класс для цифр. Есть и другие символьные классы.
Регулярное выражение может содержать как обычные символы, так и символьные классы.
Например, CSS\d соответствует строке CSS с цифрой после неё:
Также мы можем использовать несколько символьных классов:
Соответствие (каждому символьному классу соответствует один символ результата):
Обратные символьные классы
Для каждого символьного класса существует «обратный класс», обозначаемый той же буквой, но в верхнем регистре.
«Обратный» означает, что он соответствует всем другим символам, например:
Мы уже видели, как сделать чисто цифровой номер из строки вида +7(903)-123-45-67 : найти все цифры и соединить их.
Альтернативный, более короткий путь – найти нецифровые символы \D и удалить их из строки:
Точка – это любой символ
Или в середине регулярного выражения:
Обратите внимание, что точка означает «любой символ», но не «отсутствие символа». Там должен быть какой-либо символ, чтобы соответствовать условию поиска:
Точка как буквально любой символ, с флагом «s»
Но во многих ситуациях точкой мы хотим обозначить действительно «любой символ», включая перевод строки.
Но если регулярное выражение не учитывает пробелы, оно может не сработать.
Давайте попробуем найти цифры, разделённые дефисом:
Пробел – это символ. Такой же важный, как любой другой.
Нельзя просто добавить или удалить пробелы из регулярного выражения, и ожидать, что оно будет также работать.
Другими словами, в регулярном выражении все символы имеют значение, даже пробелы.
Итого
Существуют следующие символьные классы:
В кодировке Юникод, которую JavaScript использует для строк, каждому символу соответствует ряд свойств, например – какого языка это буква (если буква), является ли символ знаком пунктуации, и т.п.
Строки
В JavaScript любые текстовые данные являются строками. Не существует отдельного типа «символ», который есть в ряде других языков.
Внутренний формат для строк — всегда UTF-16, вне зависимости от кодировки страницы.
Кавычки
В JavaScript есть разные типы кавычек.
Строку можно создать с помощью одинарных, двойных либо обратных кавычек:
Ещё одно преимущество обратных кавычек — они могут занимать более одной строки, вот так:
Выглядит вполне естественно, не правда ли? Что тут такого? Но если попытаться использовать точно так же одинарные или двойные кавычки, то будет ошибка:
Одинарные и двойные кавычки в языке с незапамятных времён: тогда потребность в многострочных строках не учитывалась. Что касается обратных кавычек, они появились существенно позже, и поэтому они гибче.
Спецсимволы
Многострочные строки также можно создавать с помощью одинарных и двойных кавычек, используя так называемый «символ перевода строки», который записывается как \n :
В частности, эти две строки эквивалентны, просто записаны по-разному:
Есть и другие, реже используемые спецсимволы. Вот список:
Примеры с Юникодом:
Все спецсимволы начинаются с обратного слеша, \ — так называемого «символа экранирования».
Он также используется, если необходимо вставить в строку кавычку.
Здесь перед входящей в строку кавычкой необходимо добавить обратный слеш — \’ — иначе она бы обозначала окончание строки.
Разумеется, требование экранировать относится только к таким же кавычкам, как те, в которые заключена строка. Так что мы можем применить и более элегантное решение, использовав для этой строки двойные или обратные кавычки:
Это можно сделать, добавив перед ним… ещё один обратный слеш!
Лексический синтаксис
Спецсимволы
Спецсимволы не имеют визуального представления, однако используются для управления интерпретацией текста.
| Code point | Name | Abbreviation | Description |
|---|---|---|---|
| U+200C | Zero width non-joiner | Размещается между символами во избежание их соединений в лигатуры для некоторых языков (Wikipedia) | |
| U+200D | Zero width joiner | Размещается между символами, которые не могли бы нормально объединиться для того, чтобы символы отрисовывались, используя их соединительную форму в некоторых языках (Wikipedia) | |
| U+FEFF | Byte order mark | Используется вначале скрипта для того, чтобы пометить Юникод и порядок байтов (Wikipedia) |
Пробелы
Пробельные символы улучшают читабельность исходного текста и разделяет токены друг от друга. Пробельные символы обычно не обязательны для функционирования кода. Утилиты для уменьшения объёма кода часто удаляют пробельные символы, чтобы уменьшить объем кода.
| Code point | Name | Abbreviation | Description | Escape sequence |
|---|---|---|---|---|
| U+0009 | Character tabulation | Горизонтальная табуляция | \t | |
| U+000B | Line tabulation | Вертикальная табуляция | \v | |
| U+000C | Form feed | Символ контроля разрыва страницы (Wikipedia) | \f | |
| U+0020 | Space | Обычный пробел | ||
| U+00A0 | No-break space | |||
| Others | Other Unicode space characters | Другие символы в Юникоде на Википедии |
Окончание строк
В дополнение к пробельным символам, символы окончания строк тоже используются для читабельности исходного кода. Однако, в некоторых случаях, символы окончания строк могут влиять на выполнение JavaScript-кода, т.к. есть некоторые места, где они запрещены.
Окончания строк также затрагивают процесс автоматического проставления точки с запятой. Также окончания строк попадают под условия регулярных выражений при поиске \s класса.
В ECMAScript, в качестве окончания строк можно использовать только ниже перечисленные Юникод символы. Другие символы окончания строк будут интерпретированы, как пробельные символы (например, Next Line, NEL, U+0085 будут интерпретироваться, как пробельные символы).
| Code point | Name | Abbreviation | Description | Escape sequence |
|---|---|---|---|---|
| U+000A | Line Feed | Новая строка в UNIX системах. | \n | |
| U+000D | Carriage Return | Новая строка в Commodore и ранних Mac systems. | \r | |
| U+2028 | Line Separator | Wikipedia | ||
| U+2029 | Paragraph Separator |