Основы 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 более популярны для циклического перемещения по массивам.