Стоит ли учить javascript: перспективы, ситуация на рынке труда, мнения экспертов

JavaScript: это что такое, зачем это нужно?

При запуске скриптов необязательно использовать сервер. Html файлы со встроенными js, работают прямо в браузере. Разработчики могут писать  в текстовом редакторе, без установки дополнительных программ. Если вам интересно данная тема то почитайте статью: “С чего начать программирование самостоятельно“, уверен вам понравится.

Все современные браузеры поддерживают язык программирования javascript. Это технология работает под мобильные устройства. Запустив любой ресурс на смартфоне, пользователь получает доступ к статье. Все дополнительные плагины, написанные на js, запускаются, предоставляя полный функционал блога. Например, валидация, при регистрации.

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

Установив нужный плагин и настроив его, вся вводимая информация будет проверяться на стороне клиента, что экономит время пользователя. Не придётся ждать ответа от сервера, при отправке на наличие ошибок неправильно заполненных полей.

Урок 2: инструменты разработчика[править]

Обязательно нужен хороший редактор. Он должен иметь:

  • Подсветку синтаксиса
  • Автодополнение
  • Фолдинг (возможность скрыть-раскрыть блок кода)

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

Платные IDE:

  • Intellij WebStorm
  • Microsoft Visual Studio
  • Komodo IDE
  • и др.

Бесплатные IDE:

  • Eclipse и на его основе Aptana.
  • Visual Studio Code
  • NetBeans
  • Komodo Edit
  • и др.

«Легкие» редакторы

Такие редакторы не такие мощные, как IDE, но они быстрые и простые.

  • TextMate (Mac, платный)
  • SciTe простой, легкий и очень быстрый (Windows, бесплатный).
  • Notepad++ (Windows, бесплатный).
  • Sublime Text 2 (кросс-платформенный, неограниченный бесплатный триал).
  • Vim, Emacs.

Итак, что такое JavaScript?

JavaScript — это язык программирования, который оживляет сайт. В отличие от HTML (который определяет контент) и CSS (который задаёт стили) и в отличие от PHP (который является языком стороны сервера), он запускается на стороне устройств посетителей.

Что нужно знать:

  1. JavaScript относительно прост в освоении;
  2. Он разработан Netscape, сейчас его используют более 92% сайтов;
  3. JS может быть привязан к конкретному элементу страницы или события вроде клика;
  4. Он работает на разных устройствах и в разных браузерах;
  5. Он быстрее и легче, чем другие языки программирования;
  6. Может быть менее безопасным, чем другие из-за своей популярности;
  7. Вы можете добавлять JavaScript непосредственно в HTML или вы можете хранить отдельные файлы и вызывать функциональность по необходимости.

И наконец, причина по которой JavaScript такой популярный: он очень хорош в том, для чего он предназначен. Так что, если вас интересует JS для начинающих, мы надеемся эта статья вам помогла и теперь вы представляете, что такое JavaScript и как он работает.

Типобезопасность в JavaScript: Flow и TypeScript

Все, кто имеют дело с разработкой UI в кровавом enterprise наверняка слышали о «типизированном JavaScript», подразумевая под этим «TypeScript от Microsoft». Но кроме этого решения существует как минимум ещё одна распространённая система типизации JS, и тоже от крупного игрока IT-мира. Это flow от Facebook. Из-за личной нелюбви к Microsoft раньше всегда использовал именно flow. Объективно это объяснял хорошей интеграцией с существующими утилитами и простотой перехода.
К сожалению, надо признать, что в 2021 году flow уже значительно проигрывает TypeScript как в популярности, так и в поддержке со стороны самых разных утилит (и библиотек), и пора бы его закопать поставить на полку, и перестать жевать кактус перейти на де-факто стандарт TypeScript. Но под этим хочется на последок сравнить эти технологии, сказать пару (или не пару) прощальных слов flow от Facebook.

Методы массивов

С помощью методов массива в JavaScript можно добиться крутых (а порой и элегантных) способов трансформации данных. На StackOverflow часто можно наткнуться на вопросы о том, как работать с массивом объектов.

Ниже будут перечислены некоторые методы массива, сгруппированные по назначению. Однако это далеко не весь список.

map, filter, reduce

В методах , и иногда можно запутаться. Они полезны для трансформации массива или возвращения его агрегатного значения.

  • map(): возвращает массив, в котором каждый элемент изменяется с помощью переданной функции.

  • filter(): возвращает массив с теми элементами, в которых переданная функция возвращает .

  • reduce(): работа с элементами с сохранением промежуточного результата.

find, findIndex, indexOf

Эти методы очень похожи. Используйте их следующим образом:

find(): возвращает первый элемент массива, удовлетворяющий определенному условию.

Опять же, обратите внимание, что все числа после 5 удовлетворяют условию, но возвращаться будет только первое значение. Это полезно в случаях, когда вы используете break при первом совпадении.

findIndex(): метод идентичен , но вместо возвращаемого значения здесь возвращается индекс первого подходящего элемента.

indexOf(): метод идентичен , но вместо функции он принимает искомое значение

Используйте этот метод в тех случаях, когда вам не нужна функция для проверки элемента на совпадение.

push, pop, shift, unshift

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

  • push(): этот метод относительно простой. Он добавляет элемент в конец массива. Метод модифицирует массив и одновременно возвращает добавленный элемент.

  • pop(): метод удаляет последний элемент массива. Как и в прошлом случае, метод изменяет массив и одновременно возвращает удалённый элемент.

  • shift(): этот метод удаляет первый элемент массива. Метод изменяет массив и возвращает удалённый элемент.

  • unshift(): добавляет один или несколько элементов в начало массива. Как и прошлые методы, он изменяет массив, но возвращает новую длину массива.

splice, slice

Эти методы либо изменяют, либо возвращают подмассив элементов.

splice(): метод изменяет массив, удаляя или заменяя существующий элемент, и/или добавляет новый. Метод только изменяет массив. Код ниже можно объяснить так: в позиции 1 массива удалить 0 элементов и вставить b.

slice(): возвращает подмассив элементов массива, начиная и заканчивая на определённой позиции. Если конечная позиция не указана, возвращается остаток массива

Важно понимать, что этот метод не модифицирует массив, а только возвращает подмассив.

sort

Метод сортирует массив, основываясь на функции, которая принимает первый и второй элемент. Этот метод изменяет сам массив. Если в массиве порядок элементов не был изменен, метод возвращает 0, если изменён — 1.

Как JavaScript отличается от других языков программирования?

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

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

JavaScript JavaScript или сокращённо JS создан для добавления интерактивности на сайте. Скрипты запускаются в браузере пользователя, а не на сервере и обычно обращаются к библиотекам третьей стороны для обеспечения более расширенных функций без надобности каждый раз писать этот код разработчикам.
HTML Сокращённо от «Hypertext Markup Language», HTML — это основной язык программирования для веб, формирующий строительные блоки веб-страницы. Пример: HTML тэги, включая <p> для параграфа и <img> для изображений.
PHP PHP — язык стороны сервера в отличие от JavaScript, который запускается на компьютере клиента. Его можно чаще всего встретить в системах управления контентом основанных на PHP как, например, WordPress, но он также широко используется для создания бэкенда, так как предоставляет удобные способы передачи информации в и из базы данных.
CSS CSS — сокращение от «Cascading Style Sheets» и позволяет веб-мастерам задать стили и определить как отображается различный тип контента. Вы можете делать это вручную для каждого элемента HTML, но с применением CSS вы убережёте себя от необходимости повторять способ отрисовки элементов каждый раз при их появлении.

Если мы сравним программирование со строительством дома, то HTML будет задавать структуру дома и где будут расположены стены и двери, в то время как CSS будет отвечать для обои и отделку, которые украшают дом, чтобы сделать его более привлекательным. JavaScript добавляет удобство и означает, что вы можете включить свет и открыть двери. Вы можете обойтись и без этого, но есть риск того, что ваш сайт будет выглядеть и вести себя как «привет из» 1995 года.

jQuery и AJAX

jQuery('div#intro').load('/some/fragment.html');
jQuery.get('/some/script.php', {'name': 'Simon'}, function(data) {
    alert('Сервер ответил: ' + data);
}); // GET-запрос к /some/script.php?name=Simon

jQuery.post('/some/script.php', {'name': 'Simon'}, function(data) {
    alert('Сервер ответил: ' + data);
}); // POST-запрос к /some/script.php

jQuery.getJSON('/some.json', function(json) {
    alert('JSON выдал: ' + json.foo + ' ' + json.bar);
}); // Возвращает и преобразует ответ от /some.json как JSON

jQuery.getScript('/script.js'); // GET-запрос к /script.js и eval()

Расширение типов

Часто может возникнуть необходимость присвоить переменной одного числового типа значение переменной другого числового типа. Как же это сделать?

В Java есть 4 целочисленных типа:

Тип Размер

Переменной большего размера всегда можно присваивать переменные меньшего размера.

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

Примеры:

Код Описание
Этот код отлично скомпилируется.

Такое преобразование, от типа меньшего размера к большему, называется расширением типа.

А что насчет вещественных чисел?

С ними все аналогично — размер имеет значение:

Тип Размер

Переменной типа можно без проблем присвоить переменную типа . А вот с целочисленными типами интереснее.

Переменной типа можно присвоить переменную любого целочисленного типа. Даже типа , длина которого 8 байт. А переменной типа можно присвоить вообще что угодно: переменную любого целочисленного типа и переменную типа :

Код Примечание

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

Но т.к. смысл дробного числа в том, чтобы хранить приблизительное значение, такое присваивание разрешается

При преобразовании из целых чисел в дробные могут отбрасываться самые младшие части числа. Но т.к. смысл дробного числа в том, чтобы хранить приблизительное значение, такое присваивание разрешается.

Ограничения в использовании

  • Отсутствует доступ к файлам, которые размещены на пользовательском компьютере. В целом нет доступа за пределы самой веб-страницы. Исключением могут быть только файлы cookie, которые могут быть считаны и записаны с помощью JavaScript. Объекты такого типа обычно нужны лишь для того, чтобы страница загружалась быстрее.
  • Нет возможности выполнения кроссдоменных запросов, то есть получение доступа к веб-страницам, которые находятся на другом домене, даже если они открыты в соседних вкладках.
  • Нет возможности закрывать вкладки и окна, которые открывались с его помощью.
  • Отсутствует возможность защиты исходного текста на странице и запрета на копирование изображений или текста со страницы. При этом остается возможность добавлять некоторые ограничения, что позволяют функции JavaScript.
  • Подобные ограничения в некотором смысле затрудняют выполнение вредоносного кода.

Версии

JavaScript Соответствующая версия JavaScript Изменения
1.0 (Netscape 2.0, март 1996) 1.0 (ранние версии IE 3.0, август 1996) Оригинальная версия языка JavaScript.
1.1 (Netscape 3.0, август 1996) 2.0 (поздние версии IE 3.0, январь 1997) В данной версии был реализован объект Array и устранены наиболее серьёзные ошибки.
1.2 (Netscape 4.0, июнь 1997) Реализован переключатель switch, регулярные выражения. Практически приведён в соответствии с первой редакцией спецификации ECMA-262.
1.3 (Netscape 4.5, октябрь 1998) 3.0 (IE 4.0, октябрь 1997) Совместим с первой редакцией ECMA-262.
1.4 (только Netscape Server) 4.0 (Visual Studio 6, нет версии IE) Применяется только в серверных продуктах Netscape
5.0 (IE 5.0, март 1999)
5.1 (IE 5.01)
1.5 (Netscape 6.0, ноябрь 2000; также

поздние версии Netscape и Mozilla)

5.5 (IE 5.5, июль 2000) Редакция 3 (декабрь 1999). Совместим с третьей редакцией спецификации ECMA-262.
5.6 (IE 6.0, октябрь 2001)
1.6 (Gecko 1.8, Firefox 1.5, ноябрь 2005) Редакция 3 с некоторыми совместимыми улучшениями: E4X, дополнения к Array (например, Array.prototype.forEach), упрощения для Array и String
1.7 (Gecko 1.8.1, Firefox 2.0, осень 2006), расширение JavaScript 1.6 Редакция 3, с добавлением всех улучшений из JavaScript 1.6, генераторов и списочных выражений(англ. list comprehensions, ) из Python, блоковых областей с использованием let и деструктурирующего присваивания (var = )
JScript .NET(ASP.NET; нет версии IE) (Считается, что JScript .NET разработан при участии других членов ECMA)
1.8 (Gecko 1.9, Firefox 3.0, осень 2008), расширение JavaScript 1.7 Новая форма записи для функций, сходная с типичными лямбда-выражениями, генераторы, новые методы итеративной обработки массивов reduce() и reduceRight().
1.8.1 (Gecko 1.9.1, Firefox 3.5) Встроенная поддержка JSON, метод getPrototypeOf() у Object, методы trim(), trimLeft(), trimRight() у String
2.0 Редакция 4 (разработка не закончена, название зарезервировано ECMA, но не было использовано для публикации)
Редакция 5 (ранее известная под названием ECMAScript 3.1. Финальная версия принята 3 декабря 2009 года.)

Куда развиваться JavaScript-программисту

Изучив основы JavaScript, можно копать так глубоко, как хочется.

Хорошо освоить библиотеки и фреймворки для JavaScript — наборы готовых классов с функциями. Некоторые из них настолько мощные, что полностью меняют сценарии программирования. Для JavaScript самые популярные фреймворки и библиотеки — React, jQuery и Angular2.

Код в обеих строках делает одно и то же — скрывает элемент с идентификатором «helloDiv»

Кроме фреймворков полезно изучить надстройки над JavaScript: CoffeeScript, TypeScript и Dart. Одни надстройки сделают ваш код чище и компактнее, другие — строже.

Наконец, можно взяться за серверное программирование и Node.js. Это трендовая технология, которую используют BMW, Amazon, Apple и другие серьезные компании. Так вы расширите область своих знаний JavaScript за пределы управления веб-страницей.

Для JavaScript-программиста нет потолка развития

Хотите написать колонку для Нетологии? Читайте наши условия публикации. Чтобы быть в курсе всех новостей и читать новые статьи, присоединяйтесь к Телеграм-каналу Нетологии

Сравнение объектов

Частая ошибка у новичков в JavaScript — это неправильное сравнение объектов. Дело в том, что переменные объектов хранят  в памяти ссылку на объект, а не сам объект. Один из способов сравнения двух объектов — предварительное преобразование их в JSON строку. Однако у этого способа есть недостаток: не факт, что порядок в объекте сохранится. Более безопасный способ сравнения объектов — использование специальной библиотеки, которая сравнивает объекты на более глубоком уровне (к примеру )

Хоть следующие объекты кажутся одинаковыми, они ссылаются на разные объекты в памяти.

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

Важно понимать разницу между примитивами и ссылочными типами для правильной установки переменной, которая будет ссылаться на объект в памяти

Что делает JavaScript великим?

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

  1. Вам не нужен компилятор, потому что веб-браузер интерпретирует его в HTML;
  2. Его проще изучать, чем другие языки программирования;
  3. Ошибки проще выявить, а значит и справить;
  4. Он может привязываться к специальным элементам страниц или события вроде нажатия(click) или наведения мыши(mouseover);
  5. JS работает в разных браузерах и на разных платформах;
  6. Вы можете использовать JavaScript для валидации входных данных и снижения необходимости ручной проверки данных;
  7. Он делает сайт более интерактивным и привлекательным для посетителей;
  8. Он быстрее и легче, чем другие языки программирования.

Справочники

  • MDN (Mozilla) JavaScript Reference – это справочник с примерами и другой информацией. Хороший источник для получения подробных сведений о функциях языка, методах встроенных объектов и так далее.

    Располагается по адресу https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference.

    Хотя зачастую вместо их сайта удобнее использовать какой-нибудь интернет-поисковик, вводя там запрос «MDN », например https://google.com/search?q=MDN+parseInt для поиска информации о функции .

  • MSDN – справочник от Microsoft, содержащий много информации, в том числе по JavaScript (который там часто обозначается как JScript). Если вам нужно найти что-то специфическое по браузеру Internet Explorer, лучше искать там: http://msdn.microsoft.com/.

    Так же, как и в предыдущем случае, можно использовать интернет-поиск, набирая фразы типа «RegExp MSDN» или «RegExp MSDN jscript».

Использование

Одна из главных задач JavaScript заключается в обеспечении интерактивности страницы. В то время как HTML (викиразметка) создаст «скелет» страницы, CSS — её облик, то JS вдохнёт в страницу жизнь. Так, на Фэндоме JavaScript в той или иной мере обеспечивает работу всех редакторов — главных инструментов редактора, без исключения: кнопки быстрой вставки, предпросмотр изменений или даже сам по себе редактор целиком, как в случае с визуальным — все это работает благодаря этому языку программирования. JavaScript позволяет также, например, видеть и редактировать комментарии или сообщения стены обсуждений сразу и без обновления страницы, что гораздо удобнее, чем просто перемещение по страницам. И это далеко не полный перечень использований этого языка программирования.

Таким образом JavaScript находит применение среди разработчиков MediaWiki. Но одной из особенностей движка является и тот факт, что каждый участник может подключить какие-либо дополнительные модули, используя лишь личные страницы. На данный момент создано огромное количество модулей aka скриптов — программ, предназначенных для выполнения в браузере, решающих самые разные задачи: от автоматического выполнения правок до возврата некогда удалённых функций. Пусть эти скрипты не включены в код движка (а значит не загружаются и не выполняются), участник может подключать любой нужный скрипт или скрипты, или написать собственный по мере появления в этом необходимости.

Однако, этим решаемые им задачи не ограничиваются. Язык также используется для программирования ботов и дополнительных программ; причём это могут быть как те, что работают прямо в браузере — , так и полноценные программы, реализованные, например, через «Electron».

Можно сделать вывод, что JavaScript — очень мощный инструмент, что позволяет решать целый ряд самых разных задач, возникших перед пользователями движка, отдельными участниками или википроектами в целом.

История названия

JavaScript появился во времена бурного развития и рассвета языка Java в 90-ых годах 20-ого века. Тогда Java был самым популярным и всем казалось, что вскоре он полностью вытеснит собой большинство других языков. На волне популярности названия Java и был придуман LiveScript, а после, для успешности (ведь как корабль назовёшь, так он и поплывёт) переименован в более харизматичное название JavaScript. Название было взято просто из-за популярности и успешности языка Java. На деле JavaScript не имеет ничего общего с Java за исключением лишь пары похожих по названиям и функционалу функций базовой библиотеки.

Число

Числовой тип данных () представляет как целочисленные значения, так и числа с плавающей точкой.

Существует множество операций для чисел, например, умножение , деление , сложение , вычитание и так далее.

Кроме обычных чисел, существуют так называемые «специальные числовые значения», которые относятся к этому типу данных: , и .

  • представляет собой математическую ∞. Это особое значение, которое больше любого числа.

    Мы можем получить его в результате деления на ноль:

    Или задать его явно:

  • означает вычислительную ошибку. Это результат неправильной или неопределённой математической операции, например:

    Значение «прилипчиво». Любая операция с возвращает :

    Если где-то в математическом выражении есть , то результатом вычислений с его участием будет .

Математические операции – безопасны

Математические операции в JavaScript «безопасны». Мы можем делать что угодно: делить на ноль, обращаться с нечисловыми строками как с числами и т.д.

Скрипт никогда не остановится с фатальной ошибкой (не «умрёт»). В худшем случае мы получим как результат выполнения.

Специальные числовые значения относятся к типу «число». Конечно, это не числа в привычном значении этого слова.

Подробнее о работе с числами мы поговорим в главе Числа.

ИЛИ «||» находит первое истинное значение

Описанная выше логика соответствует традиционной. Теперь давайте поработаем с «дополнительными» возможностями JavaScript.

Расширенный алгоритм работает следующим образом.

При выполнении ИЛИ || с несколькими значениями:

Оператор выполняет следующие действия:

  • Вычисляет операнды слева направо.
  • Каждый операнд конвертирует в логическое значение. Если результат , останавливается и возвращает исходное значение этого операнда.
  • Если все операнды являются ложными (), возвращает последний из них.

Значение возвращается в исходном виде, без преобразования.

Другими словами, цепочка ИЛИ возвращает первое истинное значение или последнее, если такое значение не найдено.

Например:

Это делает возможным более интересное применение оператора по сравнению с «чистым, традиционным, только булевым ИЛИ».

  1. Получение первого истинного значения из списка переменных или выражений.

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

    С помощью :

    Если бы и , и были ложными, в качестве результата мы бы наблюдали .

  2. Сокращённое вычисление.

    Операндами могут быть как отдельные значения, так и произвольные выражения. ИЛИ вычисляет их слева направо. Вычисление останавливается при достижении первого истинного значения. Этот процесс называется «сокращённым вычислением», поскольку второй операнд вычисляется только в том случае, если первого недостаточно для вычисления всего выражения.

    Это хорошо заметно, когда выражение, указанное в качестве второго аргумента, имеет побочный эффект, например, изменение переменной.

    В приведённом ниже примере не изменяется:

    Если бы первый аргумент имел значение , то приступил бы к вычислению второго и выполнил операцию присваивания:

    Присваивание – лишь один пример. Конечно, могут быть и другие побочные эффекты, которые не проявятся, если вычисление до них не дойдёт.

    Как мы видим, этот вариант использования является «аналогом «. Первый операнд преобразуется в логический. Если он оказывается ложным, начинается вычисление второго.

    В большинстве случаев лучше использовать «обычный» , чтобы облегчить понимание кода, но иногда это может быть удобно.

Внешние переменные

У функции есть доступ к внешним переменным, например:

Функция обладает полным доступом к внешним переменным и может изменять их значение.

Например:

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

Если одноимённая переменная объявляется внутри функции, тогда она перекрывает внешнюю. Например, в коде ниже функция использует локальную переменную . Внешняя будет проигнорирована:

Глобальные переменные

Переменные, объявленные снаружи всех функций, такие как внешняя переменная в вышеприведённом коде – называются глобальными.

Глобальные переменные видимы для любой функции (если только их не перекрывают одноимённые локальные переменные).

Желательно сводить использование глобальных переменных к минимуму. В современном коде обычно мало или совсем нет глобальных переменных. Хотя они иногда полезны для хранения важнейших «общепроектовых» данных.

Описание

JavaScript относится к языкам, в которых нет особых различий в парадигмах. Это значит, что можно писать в объектно-ориентированном, функциональном, императивном и других стилях. Именно такой подход сильно повлиял на простоту его изучения и применения. К слову, как раз с этой целью он и создавался.

Скорее всего, факт простоты и функциональности и сыграл решающую роль в развитии и распространении языка. Он стал настолько популярен, что используется практически во всех сферах веб-программирования. JavaScript не принадлежит ни одной компании. Однако само название JavaScript зарегистрировано за Oracle, которой также принадлежит Java.

[править] Отладка

При разработке больших и нетривиальных веб-приложений с использованием JavaScript, критически важен доступ к инструментам отладки. Поскольку браузеры от разных производителей несколько отличаются в поведении JavaScript и реализации объектной модели документа, приходится работать с отладчиком для конкретных браузеров.

В настоящее время Internet Explorer, Firefox, Opera, Google Chrome и Safari имеют свой отладчик.

Также существуют несколько инструментов, как свободных, например, JSLint, инструмент проверки качества кода, сканирует JavaScript программу, ищет проблемы кода, так и коммерческих продуктов, наподобие инструмента под названием JavaScript Debugger.

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

Каждый блок сценария интерпретатор разбирает отдельно. На веб-страницах, когда надо комбинировать блоки JavaScript и HTML, синтаксические ошибки найти легче, если держать функции сценария в отдельном блоке кода, или (еще лучше) использовать много малых связанных .js файлов.

Выбор имени функции

Функция – это действие. Поэтому имя функции обычно является глаголом. Оно должно быть простым, точным и описывать действие функции, чтобы программист, который будет читать код, получил верное представление о том, что делает функция.

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

Например, функции, начинающиеся с обычно что-то показывают.

Функции, начинающиеся с…

  • – возвращают значение,
  • – что-то вычисляют,
  • – что-то создают,
  • – что-то проверяют и возвращают логическое значение, и т.д.

Примеры таких имён:

Благодаря префиксам, при первом взгляде на имя функции становится понятным что делает её код, и какое значение она может возвращать.

Одна функция – одно действие

Функция должна делать только то, что явно подразумевается её названием. И это должно быть одним действием.

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

Несколько примеров, которые нарушают это правило:

  • – будет плохим выбором, если функция будет выводить с возрастом (должна только возвращать его).
  • – будет плохим выбором, если функция будет изменять документ, добавляя форму в него (должна только создавать форму и возвращать её).
  • – будет плохим выбором, если функция будет отображать сообщение с текстом (должна только выполнять проверку и возвращать её результат).

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

Сверхкороткие имена функций

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

Например, во фреймворке jQuery есть функция с именем . В библиотеке Lodash основная функция представлена именем .

Это исключения. В основном имена функций должны быть в меру краткими и описательными.

Советы по эфективному изучению JavaScript

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

Электронные книги, бесплатные онлайн-курсы и интернет-платформы для обучения с помощью задач – выбор вариантов источников качественных знаний сегодня почти безграничен. Но как мотивировать себя к самостоятельному обучению, как научиться учиться самостоятельно?

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

Учиться нужно понемногу, но регулярно. Регулярность – залог успеха в обучении. Спланируйте свои будни так, чтобы вы могли каждый день уделять на изучение JavaScript не менее одного часа. Не пытайтесь за короткий промежуток времени выучить всё и сразу. Разбивка процесса самообразования на небольшие учебные сессии создает ощущение быстрых успехов и мотивирует вернуться к обучению уже на следующий день.

Наихудшее время для обучения – когда вы чувствуете усталость. В такие моменты, главное не заставлять себя – вы не получите ожидаемого результата. Человеческий мозг не может учить что-то бесконечно долго – ему нужно давать перерывы. Занимайтесь по принципу 25\5. Попробуйте на себе практику учить 25 минут и отдыхать 5 минут. Ваш мозг привыкнет к таким равномерным нагрузкам и будет работать максимально продуктивно.

Применяйте практики вспоминания – основу обучения. Чем чаще мы вспоминаем информацию, тем дольше она будет храниться в нашей памяти.

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

Параллельно с теоретическими занятиями постоянно практикуйтесь. Для приобретения практического опыта достаточно просто много писать и разбирать примеры хорошего кода. Работая с примерами внимательно пройдите по всем строчкам кода – вы должны убедиться, что понимаете, как работает каждая строчка. Не бойтесь экспериментировать. Учитесь выводить в окне браузера какие-то данные и анализировать их. Например, что и после чего выводится на экран, получили ли вы то, что хотели, и если нет – то почему.

Какой бы способ обучения вы не выбрали, не забывайте, что он должен быть интересным для вас и подкрепляться практическими занятиями – примеры лучше тысячи слов. Примеры часто легче понять, чем многостраничную теорию. Поэтому будьте смелее! Надеюсь, что этот учебник станет хорошим подспорьем в ваших начинаниях.

← предыдущая
следующая →

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

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Adblock
detector