Variables and Data Types in JavaScript

Variables and Data Types in JavaScript

JavaScript is a high-level, interpreted programming language that is widely used for creating dynamic and interactive web pages.

Variables and Data Types are the fundamental topics that every beginner should understand in order to start coding with JavaScript. Understanding variables and data types is crucial for creating complex programs and is essential for any aspiring JavaScript developer. This blog will cover all the fundamentals of variables and data types in JavaScript, covering their syntax, properties, and best practices for usage.

Variables

Variables are containers used for storing information that can be referenced and manipulated throughout the program. By assigning a descriptive name to each variable, we can clearly understand our code, making it more readable for both ourselves and other programmers.

/*Syntax to create a variable:
    variableType variableName = Value you want to store;
*/
let myVariable = 'Hello, World!👋';

/*Semicolons are used to terminate a line in javascript. They are optional, but omitting them can lead to undesired consequences on rare occasions. So it's a good practice to always put them at the end! */

There are three different ways to make (or declare) a variable: var, let and const. But as per the modern javascript, it is preferred to use only two of them - let and const. Because var doesn't have any scope constraints and blindly using var leads to undesired consequences. So, it is highly recommended only to use let and const.

let is the preferred way of creating variables in modern JavaScript. It is used when we want to make changes in the data.

let variableName = '';

const is another variable type assigned to data whose value cannot and will not change throughout the program.

const variableName = '';

The variableName is the name you give to the variable.

We have a few criteria for creating variable names, also known as identifiers. We have a few rules when it comes to creating an identifier in JavaScript:

  • The name of the identifier must be unique

  • The name of the identifier should not be any reserved JavaScript keyword (for example, we cannot declare a variable like this: const let = 0;)

  • The first character must be a letter, an underscore (_), or a dollar sign ($). Subsequent characters may be any letter or digit or an underscore or dollar sign.

Data Types

As mentioned, we can store values in variables. And these values need to be in the form of one of the predefined data types. The concept of a value is somewhat abstract, especially to someone doing programming for the first time. There are a few "types" of values, called data types. We can separate data types of current JavaScript Standard into two groups

  • Primitive Data Types

  • Non-Primitive Data Types

Primitive Date Types

There are 6 types of primitive data types and they are as follows:

  • Numbers

    JavaScript is friendly when it comes to numbers because you don’t have to specify the type of number. We call this behaviour untyped. JavaScript is

    untyped because determining whether a number is an integer or a decimal(float) is taken care of by the language’s runtime environment. For example, in traditional programming languages like C/C++, we'd have declared the type of

    number we'd like to use. Like this:

int wholeNumber = 5;
float decimalNumber = 13.25;

In JavaScript, we can just use plain old const or let and use any number we'd like:

let wholeNumber = 5;
let decimalNumber = 17.25;
const constantNumber = 3.14;

There are many operations for numbers like:

  • + Addition

  • - Subtraction

  • * Multiplication

  • / Division

When we try to do some operations with values that are not numbers, most often, we will get NaN which stands for Not a Number as result.

It represents a computational error. NaN is a result of an incorrect or undefined mathematical operation.

console.log('javascript' * 5);

The type of NaN, surprisingly, is Number. The reason for this is, in computing, NaN is technically a numeric data type. However, it is a numeric data type whose value cannot be represented using actual numbers.

  • Strings

    String’ is a sequence of characters. String is a data type used to represent text. A string in JavaScript must be surrounded by quotes. In JavaScript, there are 3 types of quotes: Single quotes, Double quotes and Backticks.

let singleQuote = 'Hello, World!';
let doubleQuotes = "Hello, World!";

Double and single quotes are “simple” quotes. There’s practically no difference between them.

Backticks are “extended functionality” quotes. They allow us to embed variables & expressions into a string by wrapping them in ${…}

const backticks = `There are ${2*3} apples🍎`;
console.log(backticks)       //There are 6 apples🍎

The expression inside ${…} is evaluated and the result becomes a part of the string. We can put anything in there: a variable or an arithmetical expression or something more complex.

  • Booleans

    Boolean represents a logical entity and can have only two values: true or false

    With just those two values, you can create a complex system of loops & conditions. This type is commonly used to store yes/no values:

    true - means "Yes/correct"

    false - means "No/incorrect"

const isRainy = true;
if(isRainy){
    console.log("Cann't go for a trip🥺");
}else{
    console.log("lets go for a trip!😃");
}

Boolean values can also be used for comparisons like:

const age = 18;
if(age >= 18){
    console.log("You can drive🚙");
}else{
    console.log("Sorry, You are not allowed🚫");
}
  • Null

    This type has only one value: null

    null is just a special value which represents “nothing”, “empty” or “value unknown”

      let something = null;
    

    The code above states that something is unknown or empty for some reason.

    We use null to assign an “empty” or “unknown” value to a variable.

  • Undefined

    A variable that has not been assigned a value is undefined. The meaning of undefined is “value is not assigned”. If a variable is declared, but not assigned, then its value is undefined by default.

let x;                //variable is declared but not assigned any value
console.log(x);       //undefined

You can also assign undefined to a variable. But it's not required.

We use undefined to check if a variable has been assigned or not.

Unassigned variables are initialised by JavaScript with a default value of undefined*. JavaScript never sets a value to* null*. That must be done programmatically.*

  • Symbols

    Symbols are commonly used in advanced JavaScript programming, particularly for creating unique keys in objects, implementing iterators, and other use cases where a unique and immutable identifier is required. However, they are not often used by beginners and are not a core concept in basic JavaScript programming.

    I have never used symbols and don't have much idea about this, that's why I'm not sharing the code.

Non-Primitive Data Types

Object

instance through which we can access members and their properties

Array

Collection of similar kinds of data

Non-primitive data types will be covered in many details in the upcoming blogs...

So stay tuned..🧑‍💻