Menu Close

Articles

JavaScript: variables

All computer languages are dealing with data. A variable is a name or identifier that represents data. Program data can have a basic type: Numeric, Character, String, Date, Time, or more complex objects like images or collections.

Declaring a variable

Momentarily there are 4 ways to declare a variable in JavaScript. In next example we declare 4 variables: {first, second, third and forth}, with different methods. Only first variable will have initial value, other variables will be ‘undefined’:  

Example:

Note: For new code, the variables in JavaScript should be declared using keyword: “let” and “const”. Apparently “var” have some issues, leading to maintainability defects. So the plan is to deprecate “var” in future versions of JavaScript.

Assign value

A JavaScript variable can have a data type: ‘numeric’, ‘string’, ‘boolean’ or ‘object’. To make the variable “salary” be of a numeric data type, we will simply assign a number using “=” operator. If the variable is not defined yet, it will be automatically created with initial value.

Note: By changing the value of a variable we can also change its data type. We can re-declare a variable in JavaScript using “var” but not using “let” or “const”.  In next example variable “test” is declared several times: 

Note: It is not possible to declare a variable several times using “let”. It is more logical not to be able to re-declare a variable. Unfortunately you can still use assignment before declaration. Next example demonstrate a property of JavaScript called “hoisting”. You can use something before it is defined.

JavaScript is difficult to defend sometimes. Don’t be discouraged it is still a good language. It just need some fixes that will be done eventually in the future. Nobody is perfect. All you need to do is… avoid traps. Do not change the meaning nor the type of variables in your code. It is a bad practice.

Declare multiple variables

We can declare more than one variable into a single statement. For each variable we can assign a different value. Multiple declarations are separated by comma and terminated by “;”.

Note: A common mistake is to declare multiple variables and assume they will have same value if you only assign the last one in the list. This may lead to unexpected results. Avoid this trap!

The correct way to declare multiple variables having same initial value must use “transitivity” property of assign operator: 

Function Typeof()

JavaScript is a dynamic language. That means the type of variable can be changed using assignment. Current type can be investigate using function typeof(). This can be useful if you wish to do some introspection before using operators on the wrong type. 

Numeric Type

JavaScript do not make a differentiation between integers and float numbers like other languages. There is only one numeric type in JavaScript: “number”.  In next example I try to change the type, but JavaScript is reporting the same type.

Numeric Operators:

Boolean Type

Boolean type is a logical data type that can have values: true or false. If you use Boolean variables in numeric expressions they are automatically converted: true = 1 and false = 0. 

Example:

Boolean operators:

Falsey values

The following values evaluate to false (also known as Falsy values):

  • false
  • undefined
  • null
  • 0
  • NaN
  • the empty string (“”)

Note: It is a good practice to use “==” or other relation operators to produce true or false.

Caution:

This example demonstrate a common error in JavaScript:

String Type

String type will be discussed in next article. For now is good to know that a string can be concatenated with another string using “+”. Also a number can be concatenated with a string using same symbol. For other arithmetic operations the string is automatically converted to numbers but for “+” the number is converted to string. 

Note: Do not relay on automatic conversions. It is possible to use explicit conversion instead:

Special Values

There are some special values in JavaScript that you must learn to understand possible strange situations when an unexpected result pop-up or an exception that you can not explain.

  • undefined, has type ‘undefined’
  • null, has type ‘object’
  • NaN, had type ‘numeric’
  • Infinity has type ‘numeric’

Read more: Strings