Language Tutorials/JavaScript/Variables

This tutorial discusses variables in Scratch and compares them to variables in JavaScript. In both Scratch and JavaScript, variables' purpose is to store data.

Creating a Variable

In Scratch

The "Make a Variable" button

The dialog box

In Scratch, a variable can be created by clicking the "Make a Variable" button (shown in the Block Palette), and filling in the subsequent dialog box.

In JavaScript

In JavaScript, a variable is made using code. There are three keywords that can be used to create a variable: var, let, and const.

var can be used to declare any variable. However, it is now not used as much anymore^{[citation needed]} in favor of let and const. const should be used to declare variables that are constant (will not change), and let should be used to declare variables that will change.

let/const is the more modern method and should be used instead of var.

Setting Variables

In Scratch

In Scratch, a variable's value can be set with the set [variable v] to [] block. The variable desired must have already been created, and it can be chosen in the drop-down menu. The desired value should be placed in the text box.

In JavaScript

In JavaScript, a variable's value can be set using variableName = desiredValue. The variable must have already been declared using var or let for this syntax to work. If the variable was declared using const, an error will occur, because const variables cannot be changed. For example, score = 5 will set the variable score to 5, unless the variable was declared using const. If it was declared using const, an error message will be shown.

Changing Variables

In Scratch

A variable's value can be changed with the change [variable v] by () block. For example, if -5 is inputted, the end value of the chosen variable will be (x) - (5), where (x) is the previous value of the variable. Incrementing or decrementing by 1 would be accomplished with change [variable v] by (1) or change [variable v] by (-1).

In JavaScript

aVariable += x can be used to add x to aVariable, so aVariable's final value will be the resulting value from the operation. In JavaScript, similar operations can be done to a variable with aVariable -= x, aVariable *= x, aVariable /= x, and aVariable %= x, which each change the value of aVariable to the result of their respective operations with aVariable and x as operands.

Furthermore, aVariable++ can be used to increment aVariable by 1, and aVariable-- can be used to decrement aVariable by 1.

Examples

Here are some examples of use of variables in both Scratch and JavaScript.

Incrementing a User's Score

define incrementScore
change [score v] by [1]

Note:

JavaScript functions are discussed in their own separate tutorial.

function incrementScore() {
   score++;
}

Multiplying by Pi

define multiplyByPi
set [product v] to ((score) * [3.1415])

function multiplyByPi() {
   product = score * 3.1415;
}

Setting a Variable, Then Performing Operations on It

define setVariableThenPerformOperations
set [aVariable v] to [5]
set [aVariable v] to ((aVariable) * [2])
set [aVariable v] to ((aVariable) - [18])
say (aVariable)

function setVariableThenPerformOperations() {
   aVariable = 5;
   aVariable *= 2;
   aVariable -= 18;
   console.log(aVariable);
}

In both cases, aVariable will equal -8 after the code is run.