JavaScript toSource

This page discusses - JavaScript toSource

JavaScript toSource

JavaScript toSource method

        

JavaScript toSource() method is usually used by the JavaScript internally not explicitly but we can use toSource() method for debugging purpose. It is implemented in version 1.3 and above of the Mozilla. It doesn't work in Internet Explorer.

Syntax :

 object.toSource();

It will convert object to the source code in a string format.

Description of code :

To illustrate use of toSource() method we have created a simple HTML page which takes three input values a student's roll number, name and class. We have created a function student() which holds these three values. We can also see the source code that how function takes these value and assign it to the variable inside it.

Suppose we enter "101", "Sherlock", "2" respectively in the "Roll Number", "Name" and "Class" fields and click on the "View function source" button. It calls the printstudent() function.

 function printstudent(){
   var rl = document.getElementById('rll').value;
   var nm = document.getElementById('nme').value;
   var cl = document.getElementById('cls').value;
   var std = new student(rl,nm,cl);
   alert(std.toSource());
  }

In above function code first three lines describes that we have created three variables "rl" , "nm" and "cl". These variables hold text input for student's roll number , name and class. In fourth line of code we have called the function student() by passing it above three variable's value. Now if we want to view source code how these values are to be assigned internally we will use toSource() method and it shows the code in the form like ({roll:"101", name:"Sherlock", class:"2"}) whereas in the JavaScript function we have assigned these values as

 function student(roll,name,clss){
    this.roll = roll;
    this.name = name;
    this.clss = clss;
  }

Here is the full code as follows :

<html>
 <head>
  <title>toSource() method</title>
  <script type="text/javascript">
   function student(roll,name,clss){
    this.roll = roll;
    this.name = name;
    this.clss = clss;
  }
  function printstudent(){
   var rl = document.getElementById('rll').value;
   var nm = document.getElementById('nme').value;
   var cl = document.getElementById('cls').value;
   var std = new student(rl,nm,cl);
   alert(std.toSource());
  }
  </script>
</head>
<body> 
<div style="background: #ff9900; width:'100%';"
                      align="center">
  <font color="#0000ff" size="12pt">
	<b>toSource() Example</b>
  </font>
 </div>
<div align="center" style="background:#ffffcc">
  <center>
  <table border="0" cellpadding="0" cellspacing="0"
                                            width="37%">
    <tr>
      <td width="25%" align="right">Roll Number</td>
      <td width="75%"><input type="text" id="rll" /></td>
    </tr>
    <tr>
      <td width="25%" align="right">Name</td>
      <td width="75%"><input type="text" id="nme" /></td>
    </tr>
    <tr>
      <td width="25%" align="right">Class</td>
      <td width="75%"><input type="text" id="cls" /></td>
    </tr>
    <tr>
      <td width="25%"></td>
      <td width="75%"><input type="button" value="View 
       function source" onClick="printstudent();"/></td>
    </tr>
  </table>
  <div style="background: #ff9900; width:'100%';"
       align="center">
		Note: Doesn't work in Internet Explorer
  </div>
  </center>
</div>
</body>
</html>

Output :

You can download source code also from the following link of download.

Download Source code