SAN JOSÉ STATE UNIVERSITY
ECONOMICS DEPARTMENT
Thayer Watkins

Scripting Languages

There are two major scripting languages to use with HTML, JavaScript and VBScript. JavaScript is by far the most important but it is convenient to introduce scripting through the simpler language, VBScript.

VBScript

VBScript is a scripting language developed by Microsoft from its Visual Basic language. VBScript is not supported by Netscape and therefore is of very limited usefulness. Nevertheless it is a convenient way to introduce the concepts of script languages.

We will start with a simple model which calculates the equilibrium GDP and consumption from input data on such things as government purchases, net exports and the marginal propensity to consume. To see how the model works open Internet Explorer (the code does not work in Netscape) and click on this link: Macroeconomic Model.

Enter the following data into the blank spaces provided by the model:

Click on the "Compute Macroeconomic Equilibrium" button and the answers of GDP = 1000 and Consumption = 700 should appear in the blank spaces at the bottom.

The code for the model is:


<HTML> 

<HEAD><TITLE>Simplest Macroeconomic Model</TITLE>  

<SCRIPT LANGUAGE="VBScript"> 

<!--  



SUB GetEquil_OnClick()

   

     Dim A1

     Dim B1

     Dim C

     Dim I

     Dim G

     Dim NX

     Dim K

     Dim Aut

     Dim Y

     Dim Con

     

     A1 = Cdbl(InputValue1.Value)

     B1 = Cdbl(InputValue2.Value)

     I = Cdbl(InputValue3.Value)

     G = Cdbl(InputValue4.Value)

     NX = Cdbl(InputValue5.Value)

     Aut = I + G + NX

     K = 1.0/(1.0-B1)

     Y = K*(A1 + Aut)

     Con = A1 + B1*Y



   OutputValue1.Value = Y

   OutputValue2.Value = Con



END SUB



-->

</SCRIPT>

</HEAD>



<BODY>

<CENTER><TABLE BORDER=10 BGCOLOR=#AA1111 BORDERCOLOR=#500000>

<TH COLSPAN=2><FONT SIZE=5><B><I>THW</I>'s Simplest<BR>

 Macro Model Computer</B>

</FONT></TH>

<TR><TD ALIGN=CENTER BGCOLOR="pink"><B>Autonomous Consumption</B></TD>

<TD><INPUT NAME=InputValue1 SIZE=10></TD></TR>

<TR><TD ALIGN=CENTER BGCOLOR="pink"><B>Marginal Propensity to Consume</B></TD>

<TD><INPUT NAME=InputValue2 SIZE=10></TD></TR>



<TR><TD ALIGN=CENTER BGCOLOR="pink"><B>Private Investment</B></TD>

<TD><INPUT NAME=InputValue3 SIZE=10></TD></TR>

<TR><TD ALIGN=CENTER BGCOLOR="pink"><B>Government Purchases</B></TD>

<TD><INPUT NAME=InputValue4 SIZE=10></TD></TR>

<TR><TD ALIGN=CENTER BGCOLOR="pink"><B>Net Exports</B></TD>

<TD><INPUT NAME=InputValue5 SIZE=10></TD></TR>





<TR><TD><INPUT TYPE=BUTTON VALUE="Compute Macroeconomic Equilibrium" NAME="GetEquil">

</TD><TD ALIGN=CENTER BGCOLOR="pink"><B>=</B></TD></TR>

<TR><TD ALIGN=CENTER BGCOLOR="pink"><B>GDP</B></TD>

<TD ALIGN=CENTER BGCOLOR="pink"><INPUT NAME=OutputValue1 SIZE=10></TD></TR>

<TR><TD ALIGN=CENTER BGCOLOR="pink"><B>Private Consumption</B></TD>

<TD ALIGN=CENTER BGCOLOR="pink"><INPUT NAME=OutputValue2 SIZE=10></TD></TR>

</BODY>

</HTML>





Explanation of the Code

The code for the model consists of basically two parts, the input and computation subroutine which is included between the <HEAD> and <HEAD> tags and the output portion which is with the <BODY> </BODY> tags.

The input and computation subroutine code starts with

SUB GetEquil_OnClick()
and ends with
END SUB

The first section of code in the subroutine defines the variables by means of DIM (for dimension) statements. The second section of code, which starts with
A1 = Cdbl(InputValue1.Value)
takes input from the blank spaces in the form of a string of characters and converts it into a decimal (double precision) number. Until this conversion has taken place the computer cannot work with the input.

The next section uses the input to carry out the computation for the model. For example, the Keynesian multiplier K is computed from the marginal propensity to consume, B1, by the formula K=1/(1-B1).

The final section of code in the subroutine creates output data from the values of Y and Con which were computed.

The input and output values are handled by the code in the BODY part of the code. The code creates a table. Some of the cells of the table are are just labels. Others are input or outvalues. For example, the cell created by:
<TD><INPUT NAME=InputValue1 SIZE=10></TD>
creates a blank of 10 spaces which is referred to in the subroutine as InputValue1. The number entered into that space is referenced as InputValue1.Value.

The cell created by the code
<TR><TD><INPUT TYPE=BUTTON VALUE="Compute Macroeconomic Equilibrium" NAME="GetEquil">
creates a button which when clicked upon runs the subroutine GetEquil as defined in the HEAD section. The output values are then put into the table cells defined by the code
<TD ALIGN=CENTER BGCOLOR="pink"><INPUT NAME=OutputValue1 SIZE=10></TD>
and
<TD ALIGN=CENTER BGCOLOR="pink"><B>Private Consumption</B></TD>

If new values are typed into the input spaces and the "Compute Macroeconomic Equilibrium" button clicked new output values will appear.

JavaScript

As in the previous section the code for JavaScript comes in the HEAD section of the HTML document. It also consists of three sections of code, but the details of the code are different.

The <-- and --*gt; tags are to hide the code from browsers which do not recognize the <SCRIPT> tag and would be confused by it.

The code starts with a statement that tells the computer that it is dealing with a function called get_Equil().

Instead of declaring a variable C with a "Dim C" statements, as in VBScript, JavaScript uses the statement "var C;". The semicolons at the end of the JavaScript statement is required.

The complete code is:


<SCRIPT LANGUAGE="JavaScript">

<!--

function get_Equil() {



     var A1;

     var B1;

     var I;

     var G;

     var NX;

     var K;

     var Aut;

     var Y;

     var Con;



A1 = document.forms[0].A1.value;

A1 =  parseFloat(A1);



B1 = document.forms[0].B1.value;

B1 =  parseFloat(B1);



I = document.forms[0].I.value;

I =  parseFloat(I);

G = document.forms[0].G.value;

G =  parseFloat(G);

NX = document.forms[0].NX.value;

NX =  parseFloat(NX);



     Aut = I + G + NX;

     K = 1.0/(1.0-B1);

     Y = K*(A1 + Aut);

     Con = A1+B1*Y;





alert("Equilibrium GDP = "+Y);

alert("Consumption = "+Con);

return true;

}



-->

</SCRIPT>

Explanation of the Rest of the Code

Consider the statements

The first line obtains the value of A1 as a string of characters from an <INPUT> statement within <FORM> </FORM> tags. The string of characters is input to the parseFloat() function to convert it into a floating point (decimal) number.

It is only after the input information is converted to numbers that arithmetic operations such as addition and multiplication can be carried out.

The results of the computation are displayed to the user by means of "alert" messages. The format of the alert message function is that a message given between quotation marks. The statement alert("Equilibirium GDP = "+Y); means that the value of Y is appended to the message"Equilibrium GDP = " in an alert box. If the value of Y cannot be computed the alert message will read "Equilibrium GDP = NaN", where NaN stands for "Not a Number."