How to convert JavaScript objects to primitive data types manually?



In this article we are going to discuss how to convert JavaScript objects to primitive data types manually with suitables examples in JavaScript.

Primitive data types are nothing but a string, number, boolean, etc. To convert objects to primitive data types, javascript has provided some methods such as toString(), toDateString(), valueOf(), etc. Using these methods javascript objects can be easily converted to primitive data types.

Using the toString() method

This method returns a string value representing the string format of the given object. The syntax to convert a javascript object into a primitive date type (string, in this example) is as follows −

Object.toString();

Here, the object can be of any type: array, number, or Boolean.

Example 1

An example program to illustrate how to convert a javascript object into a string (primitive data type) using toString() method is −

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>To convert JavaScript objects to primitive data types manually</title>
</head>
<body style="text-align : center">
   <p>In this program a JS object is converted into a string.</p>
   <p id="objToDataType"></p>
   <script>
      var result = "";
      var array1 = ['Hi', 'Hello', 'a', 'b', 'c'];
      var array2 = [10, 20, 30, 40, 50];
      var bool1 = new Boolean(0);
      var number = new Number('199');
      result += 'Array1 object to string is : ' + array1.toString() + '<br/>' + 'Array2 object to string is : ' +
      array2.toString() + '<br/>' + 'boolean to string is : ' + bool1.toString() + '<br/>' +'Number object to string is : ' + number.toString();
      document.getElementById('objToDataType').innerHTML = result;
   </script>
</body>
</html>

On executing the above code, the following output is generated.

Using the toDateString() method

This method returns a string value representing the string format of the current date object. The syntax to convert a JS object (‘date’ object in this example) into a primitive date type (‘string’ in this example) is as follows −

DateObject.toDateString();

Here, Date object is an object that is created using Date() function. It returns a string which is in date format.

Example 2

An example program to illustrate how to convert a javascript Date object into a string (primitive data type) using toDateString() method is −

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>To convert JavaScript objects to primitive data types manually</title>
</head>
<body style="text-align : center">
   <p>In this program a JS Date object is converted into a string using toDateString </p>
   <p id="objToDataType"></p>
   <script>
      var result = "";
      var date1 = new Date(2022,5,5);
      var date2 = new Date();
      result += 'Date1 object to string is : ' + date1.toDateString() + '<br/>' + 'Date1 object to string is : ' + date2.toDateString();
      document.getElementById('objToDataType').innerHTML = result;
   </script>
</body>
</html>

On executing the above code, the following output is generated.

Using the valueOf() method

This method returns a primitive of the supplied object. The syntax to convert a Javascript object (Date object, in this example) into a primitive date type (number, in this example) is as follows −

The function valueOf() method returns the primitive value of the supplied object.

Object.valueOf();

In this example, Object is the Date object. This method returns a number.

Example 3

An example program to illustrate how to convert a JS Date object into a number (primitive data type) using valueOf() method is

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>To convert JavaScript objects to primitive data types manually</title>
</head>
<body style="text-align : center">
   <p>In this program a JS Date object is converted into a value using valueOf() </p>
   <p id="objToDataType"></p>
   <script>
      var result = "";
      var date1 = new Date(2022,1,1);
      var date2 = new Date();
      result += 'Date1 object to string is : ' + date1.valueOf() + '<br/>' + 'Date1 object to string is : ' + date2.valueOf();
      document.getElementById('objToDataType').innerHTML = result;
   </script>
</body>
</html>

On executing the above code, the following output is generated.


Advertisements