Yutex - Платный хостинг PHP.
Advego.ru - система покупки и продажи контента для сайтов, форумов и блогов

Технические фишки инфобизнеса 2014

Статьи для сайтов!!!
Метод slice - Копирование из строки charAt и charCodeAt - Возвращаем символ и КОД символа Метод search - Регулярные выражения - Цифра

Методы charAt и charCodeAt в JavaScript - Возвращаем символ и КОД символа строки по его индексу

Свойства и методы строковых объектов - Объект String

Урок №5 charAt и charCodeAt - Возвращаем символ и КОД символа

Количество просмотров: 998

Рассмотрим работу двух методов объекта String - это методы charAt и charCodeAt.

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

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

Метод charAt - Возвращаем символ строки

Метод charAt - Возвращаем символ строки

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

Напомним: каждый элемент (символ) строки имеет порядковый номер - индекс. При этом отсчет ведется с 0.

Рассмотрим пример с произвольным строковым значением переменной (или с произвольным объектом String).

<script type="text/javascript">

var name = "Воронеж";

document.write(name.charAt(2)); /* Выводим на экран символ строки под индексом 2 */

</script>

Итак, в этом примере мы вывели на экран 3-й символ строки - букву «р», имеющую индекс 2 (отсчет символов ведется с 0).

Метод charCodeAt - Возвращаем КОД символа строки

Метод charCodeAt - Возвращаем КОД символа строки

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

В JavaScript каждый символ имеет код, который может быть использован в некоторых случаях. Далее мы проработаем этот момент...

А сейчас вернемся к предыдущему примеру и посмотрим, как работает метод charCodeAt.

<script type="text/javascript">

var name = "Воронеж";

document.write(name.charCodeAt (2)); /* Выводим на экран КОД символа строки под индексом 2 */

</script>

При помощи метода charCodeAt мы вывели на экран код 3-го символа строки (имеющего индекс 2), то есть код буквы «р» - это число «1088».

Юникод U+ и HTML-код символов - Коды букв русского алфавита

Юникод U+ и HTML-код символов - Коды   букв русского алфавита

Наверное, некоторым из Вас не ясно, о каком коде шла речь, когда мы рассматривали метод charCodeAt?

Любой символ: знаки препинания, заглавные и строчные русские и латинские буквы и т.д. - все они имеют свой код в кодировке Unicode, а также HTML-код.

Для примера вернемся к букве «р» из предыдущего примера.

Она имеет Юникод U+0440 и HTML-код &#1088;

Так вот JavaScript в результате работы метода charCodeAt, выдает нам именно цифровую часть HTML-кода указанного символа.

Теперь, при помощи метода charCodeAt выясним, какие коды имеют русские заглавные и строчные буквы?

<script type="text/javascript">

var letter_UP = "АЯ";
var letter_DOWN = "ая";

var first_letter_UP = letter_UP.charCodeAt(0); /* Заносим в переменную код заглавной буквы А */
var last_letter_UP = letter_UP.charCodeAt(1); /* Заносим в переменную код заглавной буквы Я */
document.write("Русские ЗАГЛАВНЫЕ буквы имеет код, начиная с " + first_letter_UP + " и заканчивая " + last_letter_UP);

document.write("<p>");

var first_letter_DOWN = letter_DOWN.charCodeAt(0); /* Заносим в переменную код буквы а */
var last_letter_DOWN = letter_DOWN.charCodeAt(1); /* Заносим в переменную код буквы я */
document.write("Русские строчные буквы имеет код, начиная с " + first_letter_DOWN + " и заканчивая " + last_letter_DOWN);

document.write("<p>");

document.write("Таким образом, коды ВСЕХ русских букв находятся в диапазоне от <strong> " + first_letter_UP + " </strong> и до <strong> " + last_letter_DOWN + " </strong> ВКЛЮЧИТЕЛЬНО");

</script>

Методы charAt и charCodeAt - Рассмотрим реальный пример

Методы charAt и charCodeAt - Рассмотрим реальный пример

Рассмотрим реальный пример использования методов charAt и charCodeAt. Необходимо написать код, который будет делать следующее:

1. Нужно попросить у пользователя ввести Имя русскими буквами (любыми - строчными или заглавными).

2. При этом проверить, нет ли в имени помимо русских букв других символов.

3. Затем при написании имени, нужно будет пробовать вводить одну/несколько латинских букв вместо русских.

Для решения этой задачи нужно будет вспомнить тему циклов и урок множественных условий. Также нужен будет метод prompt объекта Window.

Для составления условия нужен будет диапазон кодов для всех букв русского алфавита (заглавных и строчных). См. предыдущий пример.

<script type="text/javascript">

var name = "АнтоQ"; /* Делаем намеренно в Имени ошибку - это буква Q */

document.write("Вы ввели имя <strong> , " + name + " </strong> <p>");


/* Составляем цикл */

var i = 0; /* Создаём переменную i - это счётчик. i = 0, так как 0 - это индекс первой буквы имени */

while (i < name.length) /* Условие - пока i меньше длины имени */

/* Выполняем действие */

{

if(name.charCodeAt(i) < 1040 || name.charCodeAt(i) > 1103) /* Если КОД текущего символа в имени не попадает в диапазон кодов для букв русского алфавита, то выводим об этом сообщение... */

{
document.write("В имени присутствует недопустимый символ <strong>" + name.charAt(i) + "</strong>. Используйте только русские буквы!<p>"); /* Выводим недопустимый символ */
}


i++; /* Прибавляем к счетчику единицу */

}

</script>

Итак, в этом примере при помощи цикла while, условия ИЛИ и метода charCodeAt мы поочереди проверили каждую букву в имени на предмет попадания ее КОДа в диапазон кодов для всех букв русского алфавита.

А при помощи метода charAt - вывели на экран недопустимый символ.

Для себя, я решил туже самую задачу реализовать при помощи цикла for. См. пример ниже...

<script type="text/javascript">

var name = "АнтоQ";

document.write("Вы ввели имя <strong> , " + name + " </strong> <p>");

for (var i = 0; i < name.length; i++) /* Используем цикл for */

if(name.charCodeAt(i) < 1040 || name.charCodeAt(i) > 1103)

{
document.write("В имени присутствует недопустимый символ <strong>" + name.charAt(i) + "</strong>. Используйте только русские буквы!<p>");
}

</script>

И, наконец, добавим метод prompt. Попробуйте в результате самостоятельно ввести любое имя, добавив в него несколько латинских букв.

<script type="text/javascript">

var name = prompt("Введите Ваше имя"); /* Создаем поле для ввода Имени */

document.write("Вы ввели имя <strong> , " + name + " </strong> <p>");

for (var i = 0; i < name.length; i++)

if(name.charCodeAt(i) < 1040 || name.charCodeAt(i) > 1103)

{
document.write("В имени присутствует недопустимый символ <strong>" + name.charAt(i) + "</strong>. Используйте только русские буквы!<p>");
}

</script>

Домашнее задание - Методы charAt и charCodeAt

Домашнее задание - Методы charAt и charCodeAt

Теперь решим Домашнее задание. Оно будет сложнее, чем предыдущие примеры, но тем и интереснее.

Здесь также нужно будет вспомнить тему Массивов.

У вас есть массив: var students = ["Илья","Greg", "Алина"]; Вам надо пройтись по каждому элементу этого массива и выяснить в каком элементе массива есть буквы, которые не попадают в диапазон русских букв.

Подсказка. При решении нужно использовать цикл внутри цикла. В первом цикле вы перебираете элементы массива, а во внутреннем цикле уже каждый символ текущего элемента массива. Для внутреннего цикла можете назвать счетчик var j = 0;

Давайте немного изменим массив: в имени «Илья» букву «я» заменим на «q».

<script type="text/javascript">

var students = ["Ильq","Greg", "Алина"];

var i = 0;

while (i < students.length) /* Создаем цикл, который перебирает элементы массива, т.е. имена студентов */
{
var name = students[i];
document.write(name + "<p>"); /* Выводим на экран текущее имя студента*/

var j = 0;
while (j < name.length) /* Создаем внутренний цикл, который перебирает символы текущего имени*/
{
/* Далее в условии проверяем текущий символ имени на предмет его попадания в диапазон кодов для букв русского алфавита */
if (name.charCodeAt(j) < 1040 || name.charCodeAt(j) > 1103)
{
document.write("В имени " + name + " введен недопустимый символ " + name.charAt(j) + "<p>");
}

j++;
}

i++;
}

</script>

Далее я привожу еще одно решение этого Домашнего задания. Оно реализовано при помощи цикла for.

Здесь за счет цикла for (и не только) оптимизирован код.

<script type="text/javascript">

var students = ["Ильq","Greg", "Алина"];

for(i = 0; i < students.length; i++) /* Цикл перебирает элементы массива */
{
document.write(students[i] + "<p>") /* Выводим на экран текущее имя студента*/

for(j = 0; j < students[i].length; j++) /* Цикл перебирает символы текущего имени */
{
if(students[i].charCodeAt(j) < 1040 || students[i].charCodeAt(j) > 1103)
document.write(students[i].charAt(j) + " - это неверный символ <p>")
}

}

</script>

Главная Изучаем JavaScript charAt и charCodeAt - Возвращаем символ и КОД символа Метод search - Регулярные выражения - Цифра

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

Комментариев нет...

Добавить комментарий:

Ваше Имя:*
Комментарий:*
Ответьте на вопрос: *
Сколько дней в Високосном году?
* - поля обязательные для заполнения.
JavaScript
Частота просмотра уроков
Дизайн сайтов
ПОИСК ПО САЙТУ:

Моё имя Антон. Связаться со мною Вы можете по e-mail: averagev@mail.ru