Шпаргалка по JavaScript №1 - Основы.

Опубликовано maxpestun, 25 Ноя 2010

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

Немного общей информации о JavaScript.

Язык программирования JavaScript имеет С-подобный синтаксис, обладает довольно широкими возможностями и является объектно-ориентированным и интерпретируемым. В JavaScript принят верблюжий стиль названия переменных и функций (camel-cased). При использовании такого стиля название начинается с маленькой буквы и, если состоит из нескольких слов, следующие слова присоединяются без пробелов и начинаются с большой буквы (например: camelBasedLanguage). JavaScript чувствителен к регистру. Переменные "helloWorld" и "helloworld" будут разными переменными. Язык HTML, включающий в себя блок JavaScript, к регистру не чувствителен.

Начало программирования.

В большинстве случаев код на JavaScript интегрируется в HTML страницу и выполняется браузером. Для быстрого старта создадим файл с расширением ".html" в любом текстовом редакторе (для Windows это может быть Notepad, для Linux – Gedit, Nano или VIM). Внутрь файла поместим следующий код на языке HTML, описывающий самую простую страницу:

<html>
    <head>
        <title>Learning JavaScript</title>
    </head>
    <body>
        <p>Hello World!
    </body>
</html>

Запустите любой веб-браузер и откройте в нем только что созданный файл. На экране появится надпись "Hello World!", а заголовком страницы будет "Learning JavaScript".

Так как JavaScript является интерпретируемым языком программирования и выполняется непосредственно при загрузке веб-страницы, то внесение изменений в файл, его сохранение и перезагрузка страницы в браузере приведут к незамедлительному изменению выводимого содеражания. Для проверки попробуйте изменить "Hello World!" на "Hello JavaScript!", сохранить файл и нажать кнопку "Reload" в браузере.

Встраиваем JavaScriptd внутрь HTML.

Для вставки JavaScript кода в HTML страницу используйте следующую форму:

<script type='text/javascript'>
// Здесь находится код JavaScript.
</script>

Поместить этот блок можно в любом месте HTML кода, но существуют некоторые общепринятые рекомендации. Если код будет генерировать динамическое содержимое для графической части страницы (той, что видит посетитель сайта), то разумнее расположить соответствующий код внутри тэга <body>. Если код не создает видимого содержания, а результат его работы необходим для дальнейшего функционирования, то его, соответственно, помещают внутрь тэга <head>. Однако, стоит пояснить, что при обработке веб-страницы браузером любой код читается сверху вниз и при переходе внутрь тэга <script> возникает пауза в отображении информации на экране, пока весь JavaScript код не будет обработан. Поэтому рекомендуется помещать блок JavaScript как можно ближе к концу HTML файла, чтобы не раздражать пользователя долгими ожиданиями при самом начале загрузки веб-страницы.

Использование внешнего файла с JavaScript.

Внешние файлы с кодом JavaScript (то есть файлы, не содержащие HTML тэги в явном виде внутри себя и имеющие расширение ".js") используются в случаях, когда один и тот же код используется в нескольких местах. Нет смысла при этом дублировать его. Достаточно создать один файл с этим кодом, а уже в HTML файлах, которые будут отправляться с сервера пользователю через сеть или интернет, указать только какой файл использовать для получения необходимого кода. При этом в HTML файле блок скрипта примет следующий вид:

<script type='text/javascript' src='code.js'></script>

То есть, то содержимое, которое ожидается внутри тэга <script> вынесено во внешний файл с именем "code.js".

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

Итог.

Продолжайте обучение и читайте следующую статью о JavaScript "Шпаргалка по JavaScript №2 – Вывод информации".

1985
  • maxpestun's блог