Основы JavaScript

В этом уроке мы рассмотрим базовые понятия о некоторых основах JavaScript. Сегодня мы уделим внимание разным типам данных JavaScript, определению функций, увидим, что такое массивы и объекты, познакомимся с операторами в JavaScript, условием if/else, а также с циклами for и while.

 

 

В JavaScript вы можете иметь разные типы значений. Существуют такие типы данных: числа, строки, логические значения (boolean), объекты, неопределенные и нулевые (NULL):

Однострочные комментарии пишутся с использованием двух косых черт (//), весь оставшийся текст в этой строке считается комментарием и не проходит синтаксический анализ. Многострочные комментарии обозначаются с помощью /* (в начале) и */ (в конце комментария).

 

Числа

В JavaScript все числа представлены в виде значений с плавающей точкой. При определении числовой переменной не заключайте ее в кавычки.

// Примечание: ВСЕГДА используйте 'var' для объявления переменной:
var boxWidth = 50;
var boxHeight = 250;
var areaOfBox = boxWidth * boxHeight; // = 12500

 

 

Строки

Любая заданная вами строка воспринимается буквально, JavaScript не будет ее обрабатывать. Строка представляет собой последовательность символов Unicode и должна быть заключена в соответствующую пару одинарных или двойных кавычек.

var firstPart = 'Привет';
var secondPart = 'Мир!';
var greetingText = firstPart + ', ' + secondPart; // Привет, Мир!
// Знак + используется как оператор объединения строк
// (также используется для сложения чисел)

 

 

Булев тип (логические значения)

Булевы типы полезны, когда вы хотите проверить условие – посмотреть, соответствует ли оно заданным критериям. Есть только два возможных логических значения: true (истина) и false (ложь). Любое сравнение, которое использует логические операторы, приведет к Булеву типу.

10 === (7 + 3); // = true (истина)
//Вы можете назначить логические значения переменным:
var yourAge = true;
// Вы можете проверить это следующим образом:
if (yourAge) {
  // выполняется код, когда условие истинно
}

 

Оператор ‘===‘, который указан выше, является оператором сравнения, о нем мы поговорим чуть позже.

 

 

Функции

Функция – это специализированный объект (Object):

// Использование оператора function для создания новой функции:
function firstFunction(arg1, arg2) {
  // Здесь код функции
}
// Если вы опустите имя функции, тогда создается «анонимная функция»:
function(arg1, arg2) {
  // Здесь код функции
}
// Запуск функции – это просто обращение к ней, а в скобках ее аргументы:
firstFunction(); // функция без аргументов
firstFunction('foo', 'bar'); // функция с аргументами
// Вы также можете запустить функцию без присваивания ее переменной:
(function(){
  // Это пример анонимной функции, которая вызывает сама себя
})();

 

 

Массивы

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

// 2 разных способа объявления нового массива:
// 1. буквальный (используя квадратные скобки):
var fruit = ['яблоко', 'лимон', 'банан'];
// 2. используя конструктор Array:
var fruit = new Array('яблоко', 'лимон', 'банан');
// получаем данные массива
fruit[0]; // доступ к 1-му элементу массива (яблоко)
fruit[1]; // доступ к 2-му элементу массива (лимон)
fruit[2]; // доступ к 3-му элементу массива (банан)

 

 

 

Объекты

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

// 2 разных способа объявления нового Объекта:
// 1. буквально (используя фигурные скобки):
var profile = {
  name: 'Иван',
  age: 35,
  job: 'фрилансер'
};
// 2. используя конструктор Object:
var profile = new Object();
profile.name = 'Иван';
profile.age = 35;
profile.job = 'фрилансер';

 

 

Условие If/Else

Одна из наиболее распространенных конструкций в JavaScript – это оператор IF/ELSE. Это выглядит примерно так:

var legalAge = 18;
var yourAge = 25;
if ( yourAge >= legalAge ) {
  // Мы можем использовать «оповещение» (alert), чтобы уведомить пользователя:
  alert('Вы уже совершеннолетний');
} else {
  alert('Вы еще несовершеннолетний');
}

 

 

Операторы JavaScript:

Мы не будем перечислять все операторы JavaScript, а рассмотрим только самые популярные в использовании. Ниже приведены несколько примеров, которые дадут вам представление об их использовании:

// сложение / вычитание / умножение / деление
var matematika = 3 + 5 + 7 - 10 * 100 / 2;
// равенство
if ( 10 == (15 - 5 ) { /* что-то делать */ } // == проверка на равенство
// неравенство
if ( 10 != (15 - 5 ) { /* что-то делать */ } // != проверка на неравенство
// операторы строгого равенства (рекомендуется использовать эти):
2 === 2 // вместо 2 == 2
2 !== 3 // вместо 2 != 3
// присваивание:
var kolichestvoFruktov = 15;
kolichestvoFruktov -= 2; // То же, что и "kolichestvoFruktov = kolichestvoFruktov - 2"
kolichestvoFruktov += 2; // То же, что и "kolichestvoFruktov = kolichestvoFruktov + 2"

 

 

Цикл

Циклы полезны, когда вам нужно просмотреть все элементы в массиве или все элементы объекта. Наиболее распространенный способ выполнения цикла в JavaScript – использование оператора FOR или WHILE.

var markiAvto = ['Alfa Romeo','Bentley','BMW','Bugatti','Mercedes-Benz'];
// Цикл WHILE
var counter = 0;
var lengthOfArray = markiAvto.length;
while (counter < lengthOfArray) {
  alert(markiAvto[counter]);
  counter++; // То же, что и += 1;
}
// Цикл FOR
// (переменная i обозначает "iterator" (итератор) – вы можете назвать ее как угодно)
for (var i = 0, length = markiAvto.length; i < length; i++) {
  alert(markiAvto[i]);
}

 

Циклы FOR более популярны для циклического перемещения по массивам.