ресурс для начинающих веб-разработчиков
комплексные веб-услуги по созданию сайтов

Справочный материал по основным языкам программирования и верстки сайтов.

Готовая методика создания простых и сложных динамичных сайтов, с использованием PHP и MySQL.

Использование веб-редактора Adobe Dreamweaver в разработке сайтов.

Использование графических редакторов Adobe Flash, Adobe Photoshop, Adobe Fireworks в подготовке веб-графики.

Разработка веб-сайтов под "ключ".

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

Строки. Создание строкового объекта. Объединение строк. Методы строковых объектов

Строки

Для обработки символьных строк в JavaScript используется метод встроенного объекта String (строка). С помощью этого объекта можно создать строку, как строковой объект. Дело в том, что в большинстве случаев для этого достаточно использовать обычную переменную и оператор присвоения строкового значения. При этом интерпретатор все равно создаст экземпляр (копию) строкового объекта, свойства и методы которого доступны из програмного кода.

Создание строкового объекта

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

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

имя_переменной = new String("строковое_значение")

Например:

myString=new String("Привет, всем!")

Однако можно создать строковый объект и с помощью обычного оператора присвоения:

имя__переменной = "строковое_значение"

или

var имя переменной = "строковое_значение"

Например:

myString = "Привет, всем!"

или

var myString = "Привет, всем!"

Какой бы способ не использовался для инициализации строковой переменной, она становится доступной для всех объектов String.

Давайте это проверим. Для этого создадим документ и применим в нем строковой объект.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Строковой объект</title>
<script language="JavaScript">
var myString=new String ("Спасибо за информацию");
alert(myString)
</script>
</head>

<body>
<form action="" method="get">
<input name="" type="button" value="Отправить" onClick="alert(myString)">
</form>
</body>
</html>

В окне веб-браузера это выглядит ТАК.

Изменим переменные.

<script language="JavaScript">
var myString="Спасибо за информацию";
alert(myString)
</script>

или

<script language="JavaScript">
myString="Спасибо за информацию";
alert(myString)
</script>

Результам не изменится. Проверьте.

Доступ к свойствам и методам строкового объекта обеспечивается обеспечивается и такими выражениями

:

строка.свойство
String.свойство
строка.метод ([параметры])
String.метод ([параметры])

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

Рассмотрим три способа использования свойства length строкового объекта, значением которого является длина строки (количество символов в строке)

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Строковые объекты</title>
<script language="JavaScript">
myString="Привет всем! ";
myString.length
alert(myString+myString.length)
</script>
</head>

<body>
</body>
</html>

В данном примере строковой объект

myString="Привет всем! "; myString.length

содержит 13 символов.

В окне веб-браузера это выглядит ТАК.

Точно так же будет выглядеть страница если мы введем выражение

"Привет всем! ".length

или

<script language="JavaScript">
function myStr (){
myString="Привет всем! ";
return myString
}
myStr().length
alert(myStr ()+myStr().length)
</script
>

Результат будет такой же.

Рассмотрим свойства объекта String.

  • length – длина или количество символов(включая прбелы) в строке.
  • prototype — свойство (прототип), позволяющее добавить новые свойства и методы ко всем создаваемым строковым объектам, если уже существующих окажется недостаточно
  • .

Рассмотрим пример.

Создаем новый метод для всех строковых объектов. Содержание этого метода определяется пользовательской функцией.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Строковые объекты</title>
<script language="JavaScript">
function myStr (){
myString="Привет всем! ";
return myString
}
String.prototype.myString=myStr()
myfre="Изучайте JavaScript и вы не пожалеете! "
myfre=myfre.myString+myfre
myfre.length
alert(myfre+ myfre.length)
</script>
</head>

<body>
</body>
</html>

Где,

myStr()-функция нового метода;

String.prototype.myString=myStr() - прототип, после добавления нового метода

В окне веб-браузера это выглядит ТАК.

Объединение строк

Соединение двух строк в одну называется объединением строк или конкатенацией строк. Для этого мы используем оператор сложения + . Если текст большой и громоздкий, то процесс приходится разбивать на несколько этапов. Объединяемыми фрагментами могут выступать строковой текст (строка в кавычках) или строковые переменные.

Например.

var mps="Привет всем! "
mps=mps+ "Изучайте JavaScript и вы не пожалеете!"
mps=mps+ "Желаем успехов!"
и т.д

.

Другой оператор, оператор дополнения, предлагает более компактную форму записи. Символ этого оператора – это знак "плюс" + и знак равенства = , не разделенные пробелом (+=). Использование этого оператора эквивалентны добавлению к переменной, стоящей слева от оператора, того выражения, которое находится справа от оператора. Поэтому команды из приведенного выше примера будут упрощены.

var mps="Привет всем! ";
mps+= "Изучайте JavaScript и вы не пожалеете!";
mps+= "Желаем успехов!";

При необходимости можно поступить еще проще.

var mps="Привет всем! ";
mps+= "Изучайте JavaScript и вы не пожалеете!"+"Желаем успехов!";

Оператор приращения удобно использовать, когда для его отображения в текущем документе или другом окне нужно собрать вместе фрагменты текста HTML.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Строковые объекты</title>
<script language="JavaScript">
var mps="Привет всем! "

mps=mps+ "Изучайте JavaScript и вы не пожалеете! "

mps=mps+ "Желаем успехов!"
document.write(mps+"<br>");

var mps="Привет всем! ";

mps+= "Изучайте JavaScript и вы не пожалеете!";

mps+= "Желаем успехов!";
document.write(mps+"<br>")
var mps="Привет всем! ";
mps+= "Изучайте JavaScript и вы не пожалеете!"+"Желаем успехов!"
document.write(mps)
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это выглядит ТАК.

Методы строковых объектов

Из всех объектов JavaScript объект String имеет наиболее богатый выбор методов. Многие из этих методов используются для извлечения фрагментов строк. Другая группа, которая применяется значительно реже, задается с помощью стилевых дескрипторов (эквивалент дескрипторов, определяющих рамер шрифта, стиль и др. параметры в сценарии).

Рассмтрим эти методы.

  • charAt(индекс) – возвращает символ, занимающий в строке указанную позицию.
  • строка.charAt(индекс)

    Возвращает односимвольную или пустую строку.

    Параметр индекс является числом, индекс первого символа равен 0.

    Рассмотрим пример.

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Строковые объекты</title>
    <script language="JavaScript">
    var mps="Привет всем!";
    mps.charAt(1)
    mps.length
    document.write(mps+"<br>"+mps.charAt(1)+"<br>"+mps.length+"<br><br>")

    var mps="Привет всем!";
    mps.charAt(6)
    mps.length
    document.write(mps+"<br>"+mps.charAt(6)+"<br>"+mps.length+"<br><br>")

    var mps="Привет всем!";
    mps.charAt(mps.length-1)
    mps.length-1
    document.write(mps+"<br>"+mps.charAt(mps.length-1)+"<br>"+mps.length)
    </script>
    </head>

    <body>
    </body>
    </html>

    Разберем скрипт.

    mps.charAt(1);

    возвращает значение р, т.к. индексация начинается с 0.

    mps.charAt(6);

    возвращает значение 0, т.к. на шестой индекс выпадает пробел.

    mps.charAt(mps.length-1);

    возвращает значение !, т.к. ! является 12 символом(length-1=12).

    В окне веб-браузера это выглядит ТАК.

  • charCodeAt ([индекс]) – преобразует символ в указанной позиции строки в его числовой эквивалент (код).
  • строка.charCodeAt ([индекс])

    Возвращает число.

    Рассмотрим пример.

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Строковые объекты</title>
    <script language="JavaScript">
    var mps="Привет всем!";
    mps.charCodeAt()
    mps.length
    document.write(mps+"<br>"+mps.charCodeAt()+"<br>"+mps.length+"<br><br>")

    mps.charCodeAt(1)
    mps.length
    document.write(mps+"<br>"+mps.charCodeAt(1)+"<br>"+mps.length+"<br><br>")

    mps.charCodeAt(25)
    mps.length
    document.write(mps+"<br>"+mps.charCodeAt(25)+"<br>"+mps.length+"<br><br>")

    "Я".charCodeAt(0)
    "Я".length
    document.write("Я"+"<br>"+"Я".charCodeAt(0)+"<br>"+"Я".length+"<br><br>")
    </script>
    </body>
    </html>

    Разберем скрипт.

    mps.charCodeAt()— возвращает значение 1055

    mps.charCodeAt(1)— возвращает значение 1088

    mps.charCodeAt(25)— возвращает значение NaN

    "Я".charCodeAt(0)— возвращает значение 1071

    В окне веб-браузера это выглядит ТАК.

  • fromCharCode(номepl [, номер2 [, ... номер N]]) - возвращает строку символов, числовые коды которой указаны в качестве параметров.
  • String.fromCharCode(номepl [, номер2 [, ... номер N]])

    Возвращает строку.

    Рассмотрим пример.

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Строковые объекты</title>
    <script language="JavaScript">
    String.fromCharCode(1055,1056,1057,1088, 1100, 98,97)
    document.write(String.fromCharCode(1055,1056,1057,1088, 1100,98,97))
    </script>
    </head>

    <body>
    </body>
    </html>

    В окне веб-браузера это будет выглядеть ТАК.

  • concat(строка) – конкатенация(склейка) строк.
  • строка1.concat(строка2)

    Возвращает строку.

    Этот метод действует так же, как и оператор + сложения для строк: к строке строка1 приписывается справа строка2.

    Рассмотрим пример.

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Строковые объекты</title>
    <script language="JavaScript">
    "Привет".concat("всем!")
    document.write("Привет ".concat("всем!")+"<br><br>")
    x="Привет "+" "
    x.concat("всем!")
    document.write(x.concat("всем!"))
    </script>
    </head>

    <body>
    </body>
    </html>

    В окне веб-браузера это будет выглядеть ТАК.

  • indexOf (строка_ поиска[, индекс] ) – производит поиск строки, указанной параметром, и возвращает индекс ее первого вхождения.
  • строка.indexOf (строка поиска[, индекс] )

    Метод производит поиск позиции первого вхождения строка_поиска в строку строка. Возвращаемое число (индекс вхождения) отсчитывается от 0. Если поиск не удачен, то возвращается -1. Поиск в пустой строке всегда возвращает -1. Поиск пустой строки всегда возвращает 0.

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

    Рассмотрим пример.

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Строковые объекты</title>
    <script language="JavaScript">
    x="Изучайте JavaScript и вы не пожалеете!"
    x.indexOf("Изучайте")
    document.write(x.indexOf("Изучайте")+"<br><br>")//значение равно 0

    x.indexOf("JavaScript ")
    document.write(x.indexOf("JavaScript ")+"<br><br>")//значение равно 9

    x.indexOf("вы пожалеете!")
    document.write(x.indexOf("вы пожалеете!")+"<br><br>")//значение равно -1

    x.indexOf("и")
    document.write(x.indexOf("и")+"<br><br>")//значение равно 20

    x.indexOf("з")
    document.write(x.indexOf("з")+"<br><br>")//значение равно 1

    x.indexOf("")
    document.write(x.indexOf("")+"<br><br>")//значение равно 0

    x.indexOf(" ")
    document.write(x.indexOf(" ")+"<br><br>")//значение равно 8

    x.indexOf("п", 2)
    document.write(x.indexOf("п", 2)+"<br><br>")//значение равно 28

    x.indexOf("ж", 9)
    document.write(x.indexOf("ж", 9)+"<br><br>")//значение равно 30
    </script></head>

    <body>
    </body>
    </html>

    В окне веб-браузера это будет выглядеть ТАК.