How to check if the value is primitive or not in JavaScript?

Front End Technology Javascript Web Development

In this tutorial, we are going to know the methods to check if the given data type is primitive or not.

Datatypes in JavaScript 1. Primitive 2. Non-primitive

Primitive data types − String, number, undefined, boolean, null, symbols, bigint.

Non-primitive data types − Object

A primitive datatype/value is something that is not an object, and it is represented at the bottom level of the language implementation. All primitive values are immutable which means that you cannot change their type instead you may reassign v new value to the variable.

To check if the value is primitive or not, we check if the value given is an object or not; if our provided value is an object, it means it’s not a primitive data type using some methods.

Method 1: Using the Object()

We will check if the given value is an object type or not using a strict equality operator as it will also check datatypes along with the value. It will first convert the value to an object as we will pass the value as an argument through an object. In case our value is an object then the object function will return the same and it will be considered as an object otherwise strict equality operator will check and return false as the type will not be the same.

Syntax

inputValue !== Object(inputValue);

Let’s define a function to check if the input value is a primitive type or not.

function isPrimitive(inputValue){
   if(inputValue===Object(inputValue)){
      return "Value is not primitive";
   }
   else{
      return "Value is primitive";
   }
}

Example

In the example below, we check the following values if they are primitive or not.

Null
Number
String
String object
Boolean Values
Array
Empty array
Object literal


<!DOCTYPE html>
<html>
<head>
</head>
<body>
   <h2>Check if the value is primitive or not</h2>
   <p id="result"></p>
</body>
   <script type="text/javascript">
      function isPrimitive(inputValue) {
         if (inputValue === Object(inputValue)) {
            console.log("Value is not primitive")
            document.getElementById("result").innerHTML += inputValue +": not primitive <br>"
         } else {
            console.log("Value is primitive")
            document.getElementById("result").innerHTML += inputValue +": primitive <br>"
         }
      }
      isPrimitive(null)
      isPrimitive(12)
      isPrimitive("This is simple string")
      isPrimitive(new String("This is string object"))
      isPrimitive(false)
      isPrimitive([1, 2, 3])
      isPrimitive([])
      isPrimitive({})
   </script>
</html>

Method 2: Using the typeof Operator

In this method, we will check datatype using typeof operator and as we know nonprimitive datatype is an object type always so we will check if our value is a type of object or not.

If our value is not a type of object or function, then it is primitive; else it is not primitive. We also have to handle a scenario of null as null is a primitive type value but typeof will show output as an object if we check typeof(null).

function isPrimitive(inputValue){
   if(inputValue==null)
   {
      return "Value is primitive";
   }
   if(typeof(inputValue)=="function" || typeof(inputValue)=="object"){
      return "Value is not primitive"
   }
   else{
      return "Value is not primitive"
   }
}

Example

In the below example we check different values if they are primitive are not. To check if the value is primitive or not, we used the typeof operator. We check if the type is a function or object. If the type is a function or object, then the value is not a primitive type; else it is primitive.


<!DOCTYPE html>
<html>
<head>
</head>
<body>
   <h2>Check if the value is primitive or not</h2>
   <div id="result"></div>
</body>
   <script type="text/javascript">
      function isPrimitive(inputValue){
         if(inputValue==null)
         {
            return `primitive <br>`;
         }
         if(typeof(inputValue)=="function" || typeof(inputValue)=="object"){
            return `not primitive <br>`;
         }
         else{
            return `primitive <br>`;
         }
      }

      let resultDiv = document.getElementById("result");
      resultDiv.innerHTML += "12: " + isPrimitive(12);
      resultDiv.innerHTML += "null: " + isPrimitive(null);
      resultDiv.innerHTML += "false: " + isPrimitive(false);
      resultDiv.innerHTML += "[1,2,3]: " + isPrimitive([1,2,3]);
      resultDiv.innerHTML += `"This is simple string": ` + isPrimitive("This is simple string");
      resultDiv.innerHTML += "new String(): " + isPrimitive(new String("This is string object"));
      resultDiv.innerHTML += "[]: " + isPrimitive([]);
      resultDiv.innerHTML += "{}: " + isPrimitive({});
      resultDiv.innerHTML += "new Date(): " + isPrimitive(new Date());
   </script>
</html>