Что такое разработка: объяснение для новичков

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

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

1. Набор инструментов для программирования с нуля
2. Переменные
3. Объекты
4. Массивы
5. API
6. Функции
7. Логические ветви и сравнения
8. Циклы
9. null и undefined
10. Области применения
11. Комментирование кода
12. Заключение

Набор инструментов для программирования с нуля

Инструментарий типичного программиста чаще всего состоит из следующих вещей:

• компьютер;
• интернет (прежде всего он нужен для поиска всего неизученного и неизвестного в любом из известных поисковых сервисов);
• редактор кода (или IDE — комплекс программных средств, используемый программистами для разработки программного обеспечения), который поможет упорядочить всё, что вы создаёте;
• компилятор или интерпретатор. Это программа, которая читает ваш код и пытается найти в нём ошибки. Затем он собирает ваш код в единый пакет и передаёт компьютеру для выполнения;
• наушники. Возможно, вас будут отвлекать внешние шумы, а наушники — один из простых способов оградить себя от шумов.

Вы можете использовать бесплатное ПО в начале работы, такое как Atom и Notepad++. Также можно попробовать SublimeText, однако этот редактор является платным.

Переменные

В начале программирования нужно освоить переменные — именованные области памяти для хранения данных. Есть две основные причины, по которым следует именовать данные:

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

Примечание В названиях переменных нельзя использовать апострофы.

Чтобы переменная существовала, её нужно объявить. Объявление переменных служит в роли свидетельства о «рождении» для данных. Давайте посмотрим на пример:

			var the_number_of_days_in_december
		

Ключевое слово varозначает переменную.

Переменной нужно присвоить значение:

			var the_number_of_days_in_december = 31
		

Теперь вы можете использовать переменную, the_number_of_days_in_december вместо числа 31.

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

Переменной также можно объявить целую строку или фрагмент текста:

			var great_song_lyrics = ‘pasito a pasito, suave suavecito’
		

Теперь можно где угодно в коде написатьgreat_song_lyricsи компьютер поймёт, что речь идёт о 'pasito a pasito, suave suavecito'. Проверим это утверждение.

Откройте консоль в Google Chrome нажатием клавиши F12 (для владельцев Mac рекомендуется ознакомиться с этой статьёй). Перед вами появится следующее окно:

Убедитесь, что выбрана вкладка «Console», кликните на пустом поле рядом со знаком «больше» (>), объявите переменную и присвойте ей значение, а затем нажмите клавишу ввода.

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

Поздравляем! Консоль (которая также служит в роли интерпретатора) понимает вашу переменную.

Объекты

А что такое разработка без объектов? В JavaScript объекты объявляются почти так же, как и переменные:

			var human = {
    id: 12884002,
    age: 28,
    name: 'Bob',
    favorite_song: 'Photograph, by Nickelback'
}
		

Здесь мы объявили четыре переменные, и сможем найти их, поэтому мы сможем найти их, когда захотим узнать что-нибудь о human. Всё, что вы видите в фигурных скобках, разграничивается на две части: слева прописываются поля, а справа указываются свойства для них. Объект может иметь любые свойства до тех пор, пока они находятся внутри {фигурных скобок}.

Мы можем использовать объект humanи ссылаться на него точно так же, как и на любую другую переменную. Компьютер поймёт, что нужно сослаться на какое-либо определённое свойство, если мы его напишем через точку:

			human.id
human.name
human.age
human.favorite_song
		

Каждый из элементов сверху может быть изменён и ссылаться на другое свойство. Например, давайте изменим имя (name):

			human.name = ‘Alice’
		

Массивы

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

			var tweets = ['Hello, Twitter!', 'My friends are so cool', 'Does anyone want a LaCroix?']
		

Для массивов принято использовать [квадратные скобки]. В данном случае вы можете использовать tweets в любом месте вашего кода, ссылаясь на массив, который только что определили.

Примечание Счёт массивов начинается с нуля, а не с единицы.

Если вы хотите обратиться к какому-то отдельному элементу, то можно сделать следующее:

tweets[0]

tweets[1]

tweets[2]

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

Каждое из приведённых выше выражений — переменная. Вы можете присвоить им какое-нибудь новое значение, чтобы поэкспериментировать:

			tweets[2] = 'I regret literally everything I have ever said'
		

Теперь tweets[2] будет ссылаться на новое значение.

Массивы могут содержать текст, числа, даты, объекты и даже другие массивы. Массивы также могут быть свойствами объектов.

			var nested_object = {

    an_array: [

        {

            another_array: [

                {

                    yet_another: [

                        {

                            message: 'Blink twice if you need help'

                        }

                    ]

                }

            ]

        }

    ]

}
		

Чтобы обратиться к message, вы можете написать следующее:

			nested_object.an_array[0].another_array[0].yet_another[0].message
		

И компьютер поймёт, что вы имеете в виду ‘Blink twice if you need help’

API

API — набор свойств и методов (целевых фрагментов кода), которые имеют свои имена, как переменные.

Массивы JavaScript также имеют свой собственный API. Свойство length является частью этого API. Другая его часть — метод push, который добавляет элементы в конец массива:

			tweets.push('Man I hate good attitudes')
		

Метод похож на свойство, потому что к нему можно получить доступ через точку. Он отличается от свойства тем, что после него нужно поставить (круглые скобки). В этих круглых скобках хранятся данные, которые мы хотим добавить в наш массив. Теперь в tweets четыре элемента. Это выглядит вот так:

			['Hello, Twitter!', 'My friends are so cool', 'I regret literally everything I have ever said', 'Man I hate good attitudes']
		

Функции

Функция — это фрагмент кода, который что-то выполняет и имеет имя. Функции можно легко объявлять:

			function giveMeOne() {

    return 1

}
		

Объявление функции начинается с ключевого слова, затем ей даётся имя. return заставляет значение «выпрыгивать» из функции. Затем функция завершается (если вы напишете код после return, то он не будет выполнен). Таким образом, вы можете сделать следующее:

			var the_loneliest_number = giveMeOne()
		

Мы объявляем переменную с именем the_loneliest_number. Часть нашей команды вызывает функцию giveMeOne() и так как функция говорит return 1, выводится единица. Наша переменная будет содержать цифру 1. Теперь попробуйте ввести в браузере первый блок с функцией, затем блок с переменной, а затем ввести the_loneliest_number и нажать кнопку ввода. Вы увидите единицу.

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

Часть данных, которую мы добавляем в функции, называется аргументом. Объявление функции, которая может ожидать аргументы, выглядит так:

			function addTheseNumbersTogetherPlz(number1, number2) {

    return number1 + number2

}
		

Оператор return складывает аргументы number1и number2, а затем выдаёт результат.

В JavaScript также можно писать математические выражения как на калькуляторах:

• +используется для сложения;
• -используется для вычитания;
• (круглые скобки) служат для принудительного выполнения порядка операций;
• *используется для умножения;
• % используется для получения остатка деления.

Вы могли бы записать предыдущую функцию таким образом:

			function addTheseNumbersTogetherPlz(number1, number2) {

    var sum = number1 + number2

    return sum

}
		

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

Логические ветви и сравнения

Предположим, мы пишем приложение, которое определяет, разрешено ли конкретному человеку войти в ночной клуб. Представим, что в JavaScript API есть метод, который получает возраст пользователя. Мы назовём его getUserAge(). Также предположим, что существуют два других метода: allowThemInTheNightClub() APIAPIи throwThemOutOnTheirButt(). Как мы можем помочь нашей программе решить, какой из этих двух методов нужно вызвать, исходя из возвращаемого значения первого метода?

			var age = getUserAge()

if (age >= 21) {

    allowThemInTheNightclub()

} else {

    throwThemOutOnTheirButt()

}
		

Вы уже знаете, что делает первая строка. age (возраст) может варьироваться от 7 до 101. Теперь нам нужно определить больше значение age, чем 21 или нет.

Мы делаем это с помощью оператора if(если) — ключевого слова, похожего на метод. Аргумент, который он ожидает, представляет собой какое-то выражение (обычно сравнение). Сравнения принимают два значения и сравнивают их друг с другом. В результате чего выбирается одно из следующих ключевых слов: true— в случае соответствия правилу и false— в случае несоответствия. Это называется логическим выражением.

В JavaScript есть возможность 6 видов сравнения:
• === сравнивает значения. Если они одинаковы, то вы увидите true. Например, 6 === 6 было бы true;
• !== сравнивает значения на неравенство. Если они не равны, то вы увидите true. Например, 6 !== 3 было бы true;
• > проверяет, больше ли значение слева. Если больше, то вы увидите true. Например, 6 > 3 было бы true;
• < проверяет, больше ли значение справа. Если больше, то вы увидите true. Например, 3 < 6 было бы true;
• >= проверяет, больше или равна правая часть левой. Если больше или равна, то вы увидите true. Например, выражения 6 >= 6и6 >= 5были бы true;
• <= проверяет, меньше или равна правая часть левой. Если больше или равна, то вы увидите true. Например, выражения 6 <= 6 и 6 <= 7 были бы true.

Оператор if оценивает сравнение. Если выводится true, то код выполняется внутри блока сравнения. Если выводится false, код не выполняется и игнорируется.

Оператор if также может работать с оператором else(иначе). Он содержит в себе блок кода, который будет выполнен, если сравнение вернёт false.

Циклы

Но что такое циклы в программировании? Иногда при работе с массивом может понадобиться выполнить какой-то блок кода несколько раз подряд. В таких случаях следует использовать циклы. Простейшим видом цикла JavaScript является while (цикл выполняется, пока условие истинно):

			var the_real_slim_shady = ['My name is', 'My name is', 'My name is', 'Waka waka Slim Shadyyy']

var index = 0

while (index < the_real_slim_shady.length) {

rap(the_real_slim_shady[index])

    index = index + 1

}
		

Цикл while использует тот же синтаксис, что и оператор if: нём используются круглые скобки, вы проходите через сравнение и т. д. Но блок ifвыполняет код внутри только один раз, а блок whileповторяется раз за разом. Он выполняет условие до тех пор, пока оно не станет false. Если оно соответствует true, блок запускается снова и снова.

Сколько раз будет выполняться цикл? Что же, в первый раз он оценит сравнение и проверит меньше ли index(который равен 0), чем the_real_slim_shady[0]. Если сравнение выведет true, то будет запущен цикл, так как indexравен нулю. С этого момента цикл будет выполняться до тех пор, пока блок indexне будет равен 4, так как the_real_slim_shady[4] не существует.

null и undefined

Если вы объявите переменную и не присвоите ей значение, то она будет содержать специальное значение undefined. Null значит почти то же самое. Предлагаем почитать, чем они различаются, а также узнать про обработку undefined.

Области применения

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

			function whatHappensInVegas() {

    var wildIndiscretions = ['partied', 'danced']

    return 'I admit nothing'

}

whatHappensInVegas()

whatHappensInVegas()

whatHappensInVegas()

if (wildIndiscretions.length > 0) {

    getADivorce()

}
		

В функции объявлена переменная wildIndiscretions. Мир за пределами функции не знает о существовании переменной. Даже оператор ifне может ничего сделать в этом случае. Оператор ifсработает только внутри функции, если поместить его перед return.

Комментирование кода

Не всегда бывает понятно, что выполняет тот или иной код. Поэтому всегда следует комментировать его. В JavaScript комментарии начинаются с //:

var age = 21{

// переменная равна 21.

// Если она не равна 21, пожалуйста, измените на 21.

// Что сделать: добавить больше переменных.

}

Так что же такое программирование

Программирование — это написание приложений, основанное на определённых правилах, некоторые их которых перечислены в нашей статье.

Теперь вы понимаете, что представляет собой разработка на базовом уровне. Желаем успехов на пути к освоению мастерства программирования. Если же вы понимаете, что JavaScript — не ваше, узнайте, какой язык программирования подойдёт для новичка.