Введение в JavaScript, часть I: Переменные, свойства, операции

Автоматически переведённая страница

К сожалению, на полный ручной перевод у нас не хватает ресурсов.
Если вы увидели ошибку — отправьте пул-риквест с исправлениями (ссылка для редактирования в конце страницы).

JavaScript — это отличный язык программирования, который используется для создания веб-сайтов, игр, приложений, подобных ct.js, а также роботов! Он прост в изучении, но в то же время невероятно мощный и имеет много общего с такими языками, как C#, C++ или Java.

Игры на Ct.js пишутся в том числе и на JavaScript. Вы определяете логику для своих Копий и Комнат и создаете новые расширения с его помощью. Ниже мы рассмотрим основные концепции этого языка.

Переменные

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

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

Вы можете объявлять новые переменные с помощью ключевого слова var, а присваивать им значения — с помощью математического знака равенства:

var maxHealth;
maxHealth = 100;
var health;
health = maxHealth; // Вы можете копировать значение из одной переменной (maxHealth) в другую (health)

var mana, maxMana; // Вы можете объединить несколько объявлений в одном ключевом слове `var`
maxMana = mana = 100; // Вы можете присвоить одно и то же значение разным переменным сразу

var name;
name = 'ct.js'; // Текстовые значения, или строки, заключаются в кавычки

var title = 'The Almighty Cat'; // Вы можете объединить процесс объявления и присваивания

var invincible = true, // Эти значения являются логическими (bool)
    stunned = false,
    bleed = false; // Вы можете объединить несколько объявлений и присваиваний с запятой!

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

Присваивание записывает новое значение в переменную. При объявлении переменные являются undefined. Они будут хранить полезную информацию только после присваивания. Вы можете присваивать новые переменные несколько раз.

Свойства

Переменные отлично подходят для временных значений, но они исчезают после завершения события ct.js (например, после «Уничтожение», «Начало кадра»). Это делает переменные полезными для быстрых операций, но не подходит для длительного использования. Мы должны использовать свойства для хранения информации, чтобы мы могли использовать ее позже.

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

this.maxHealth = 100;
this.health = this.maxHealth;

this.maxMana = this.mana = 100;

this.name = 'ct.js';
this.title = 'Величественный Кот';

this.invincible = true;
this.stunned = false;
this.bleed = false;

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

Также есть новое слово: this. this относится к текущему объекту, который вызывает код. Если вы пишете код для события «Начало кадра» Копии, то this будет указывать на именно эту копию. Написание this.health = 100; означает, что мы храним свойство health внутри текущей копии с значением 100.

Мы можем использовать слово this внутри кода Комнаты. В этом случае значения будут храниться в комнате.

Работа с значениями, свойствами и переменными

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

Операции с числами всем знакомы. Они похожи на арифметические уравнения:

this.level = 10;
this.health = this.level * 4; // 40
this.health = this.health - 5; // 35
this.inventoryCapacity = (5 + 10) * 8; // 120
this.magicPower = 5 + 10 * 8; // 85
this.magicDamage = this.magicPower + this.level * 5; // 135
this.magicResistance = this.magicPower / 10; // 8.5
/* А что, если нам нужно получить остаток от деления? */
this.remainder = 11 % 4; // 3, потому что 11 / 4 = 2 и остаток 3;

Когда нам нужно изменить переменную или свойство, мы можем объединить присваивание с необходимой операцией:

this.health = 10;
this.health += 5; // now this.health is 15
this.health /= 5; // 3
this.health *= 10; // 30
this.health -= 20; // 10

Также есть два особых оператора, которые изменяют значение переменной на 1:

this.counter = 10;
this.counter++; // now this.counter is 11
this.counter++; // now 12
this.counter--; // again 11

Строки также имеют свои операторы. Мы будем использовать знак плюс для сложения строк:

this.name = 'ct.js';
this.title = 'Almighty Cat';
this.title = 'The ' + this.title; // 'The Almighty Cat'
this.name += ', '; // 'ct.js, '
this.name += this.title; // 'ct.js, The Almighty Cat'

Мы даже можем добавлять числа к строкам:

var score = 1000,
    drawText = 'Score: ' + score; // 'Score: 1000'

var power = 42,
    powerInfo = power + ' of power'; // '42 of power'

Предупреждение! Дела становятся интересными, когда мы смешиваем строковые значения, похожие на числа, и математические операторы:

var money = 100,
    price = '5';
var case1 = money - price, // 95
    case2 = money + price; // 1005 (!)

Таким образом, правило заключается в том, чтобы хранить числовые значения как числа, а не строки. Если вам нужно преобразовать строку в число, используйте parseFloat(yourString).

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

Логическими являются те переменные и свойства, значения которых либо true, либо false. Обратите внимание, что здесь мы не используем кавычки.

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

var health = 63,
    maxHealth = 100,
    mana = 100,
    maxMana = 100;

health < maxHealth; // true
mana > maxMana; // false
mana >= maxMana; // true
health <= maxHealth; // true
health === maxHealth; // они равны? false
health !== maxHealth; // они не равны, верно? true

var cat = 'Альберт',
    dog = 'Сноуболл';
cat === dog; // false
cat !== dog; // true

/* Существуют также нестрогие сравнения, которые сравнивают значения, но преобразуют типы переменных */

5 === '5'; // false, потому что '5' - строка, а не число
5 == '5'; // true
5 === parseFloat('5'); // true, потому что parseFloat возвращает число, и таким образом 5 тоже число

Логические значения также имеют свои операторы. Наиболее базовый - это оператор !, который отрицает значение рядом с ним.

!true; // false
!false; // true

var health = 50,
    alive = !(health <= 0); // true
var dead = !alive; // false

Также есть операторы && и ||. Первый называется "И", а второй - "Или". Они используются для объединения разных логических значений.

this.onGround = true;
var keyUp = ct.keyboard.down['up'], // будет "true", если удерживается клавиша вверх
    canJump = this.onGround && keyUp;

this.powerFromLeft = false;
this.powerFromRight = true;
this.poweredOn = this.powerFromLeft || this.powerFromRight; // true

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