Black Friday Sale is on: Get Amazing deals on tools and resourcess

Tutorial: Javascript Data Type


By Emmanuel Chinonso

Web Developer

JavaScript Data Type

Variables in JavaScript can hold a wide range of data types: they include

  • String
  • Numbers
  • Booleans
  • Arrays
  • Object
  • Undefined
  • Null

Contrast Bootstrap UI Kit

JavaScript string A string (sometimes known as a text string) is a collection of characters such as "John Doe." Quotes are used to write strings. You have the option of using single or double quotes:


1var animal1 = 'Cat'; // Using double quotes
2var animal2 = 'Cat'; // Using single quotes

In a subsequent chapter, we'll go into strings in further detail.

JavaScript Numbers: There is only one number type in JavaScript. There are two ways to write numbers: with decimals and without decimals:

JavaScript code:

1var x1 = 18.0; // Written with decimals
2var x2 = 18; // Written without decimals

In later chapters, you'll discover more about numbers.

JavaScript Booleans: True or false are the only two possible values for a Boolean. In conditional testing, Booleans are frequently utilized.

JavaScript code:

1var x = 5;
2var y = 5;
3var z = 6;
4(x == y)(
5 // Returns true
6 x == z
7); // Returns false

JavaScript Arrays; Square brackets are used to write arrays in JavaScript. Commas are used to separate array items. The first item in an array index is [0], the second is [1], and so on.

JavaScript code:

1var fruits = ['apple', 'orange', 'mango', 'watermelon'];

JavaScript Objects: Curly braces are used to write JavaScript objects. Name: value pairs separated by commas are used to write object properties.

JavaScript code:

1var person = { firstName: 'Johnny', lastName: 'Williams', age: 35, eyeColor: 'brown', Sex: 'male' };

Undefined: A variable with no value has the value undefined in JavaScript. In addition, the type isn't specified. By setting the value of any variable to undefined, it can be emptied. In addition, the type will be unknown.

JavaScript code:

1var stadium; // Value is undefined, type is undefined.

Empty Values:

Undefined has nothing to do with an empty value. An empty string has a type and a valid value.

JavaScript code:

1var stadium = ''; // The value is "", the typeof is "string"

Null: Null means "nothing" in JavaScript. It's intended to be something that doesn't exist in the first place. Unfortunately, the data type null in JavaScript is an object. This can be seen as a JavaScript flaw. Setting an object to null will also empty it.

JavaScript code:

1var person = { firstName: 'Johnny', lastName: 'Williams', age: 35, eyeColor: 'brown', sex: 'male' };
2person = undefined; // Now both value and type is undefined

Primitive Data; A primitive data value is a single data value with no other characteristics or methods. The primitive types that the typeof operator can return are:

  • string
  • number
  • boolean
  • undefined

Complex Data: One of two complex types can be returned by the typeof operator:

  • function
  • object

For objects, arrays, and null, the typeof operation returns "object." For functions, the typeof operator does not return "object."

The typeof Operator: To determine the type of a JavaScript variable, use the typeof operator in JavaScript. The typeof operator returns a variable's or expression's type:

JavaScript code:

1typeof ''; // Returns "string"
2typeof 'Johnny'; // Returns "string"
3typeof 'Johnny Willams'; // Returns "string"

JavaScript Code:

1typeof 0; // Returns "number"
2typeof 314; // Returns "number"
3typeof 3.14; // Returns "number"
4typeof 3; // Returns "number"
5typeof (3 + 4); // Returns "number"

Contrast Bootstrap UI Kit

Create Stunning websites and web apps

Trying to build out all user interfaces and components for your website or web app from scratch can become a very tedious task. A huge reason why we created Contrast Bootstrap to help reduce the amount of time we spend doing that, so we can focus on building some other aspects of the project. Contrast Bootstrap PRO consists of a UI Kit featuring over 10000+ component variants. Together with a template of 5 admin dashboards and 23+ additional multipurpose pages template for building almost any type of website or web app. You can view a demo and learn more about Contrast by clicking here.Try contrast pro


Contrast Bootstrap PRO was built using the most popular CSS framework Bootstrap to help build your next landing, admin SAAS, prelaunch etc project with a clean, prebuilt and well documented template and UI components.Learn more about Contrast

Related Posts