Author Archives: Liew Voon Kiong

The fromCharCode() Method

The fromCharCode() Method is a method that belongs to the String object in JavaScript. It converts a Unicode into a corresponding character. You can refer to the Unicode Table to look up for a certain Unicode for a certain character or symbol. For example,  The character of Unicode 78 is N.

Follow our JavaScript Tutorial Lesson 11 to learn more about the  fromCharCode() Method


Drawing a Quadratic Curve

To draw a quadratic curve, we use the quadraticCurve() method. However, we need to combine the quadraticCurve() method with the beginPath() and moveTo() methods in order to draw a quadratic curve. The beginPath() and moveTo() methods define the starting point of the quadratic curve. The quadraticCurve() method is to define the lowest point to the end point of the quadratic curve. The syntax of the quadraticCurve() method is

Please follow the following link to learn more.

Drawing a Quadratic Curve

Pythagoras Theorem

Pythagoras Theorem is used to solve problems related to the length of the sides of a triangle.
The formula to  is


AB  is the opposite side, AC is the adjacent and BC is the hypotenuse of a triangle ABC.

We shall create a JavaScript application to deal with problems related to Pythagoras Theorem. In this application, we shall insert two input boxes for the user to key in the length of the opposite side and the length of the adjacent side. The user can then click on the Calculate Hypotenuse button to find the answer.

Read more here

BMI Calculator

You can create a BMI calculator using JavaScript. The formula for BMI(Body Mass Index) is as follows:


where weight is in kg and height in cm.

In the html page, you can create three text box using the <input> tag to accept the user inputs for name, height and weight.

In the JavaScript, you can create a function to calculate the bmi, as follows:

function bmi(){

var sheight=parseFloat(document.getElementById(‘hgt’).value);
var sweight=parseFloat(document.getElementById(‘wgt’).value);
var bmi=sweight/Math.pow(sheight,2);
var student_bmi=document.getElementById(‘bmi_index’);

  • toFixed method is to round the output to 2 decimal ppalces

The html document is

<!DOCTYPE html>

<h1>Student Name=<input type=”text” style=”font-size:25px; font-weight: bold;” id=”studentname”></h1>
<h2>Height=<input type=”text” style=”font-size:20px; font-weight: bold;” id=”hgt”></h2>
<h2>Weight=<input type=”text” style=”font-size:20px; font-weight: bold;” id=”wgt”></h2>
<h2>BMI=<b id=”bmi_index”></b></h2>

<input type=”button” value=”Calculate” onclick=”bmi()”>
<script type=”text/javascript” src=”bmi2.js”></script>

Click here to launch the BMI calculator



Creating a math drill for calculating volume of a cuboid

We have learned how to create a calculator that calculates the volume of a cuboid. Using the similar script, we can write a JavaScript that allows the user to input the dimensions as well as  enter the answer. If the answer is wrong, it will displays the “Incorrect” message, otherwise it will show the “Correct” message.

The JavaScript is as follows:’

function Calvol(width, length, height){
var vol=width*length*height;
return vol;
function CalSize(){
var x=parseInt(document.getElementById(“wdt”).value);
var y=parseInt(document.getElementById(“lgt”).value);
var z=parseInt(document.getElementById(“hgt”).value);
var Size=Calvol(x,y,z);
var answer=document.getElementById(‘ans1’).value;
if (answer==Size)

{message=”Incorrect, try again”;}



And the html is as follows:

<!DOCTYPE html>
<meta http-equiv=”Content-Type” content=”text/html; charset=windows-1252″>
<title>Volume Calculation</title>
<body onload=”RandomFn()”>
<h1>Volume of a Cuboid</h1>
<p>Width&nbsp;=&nbsp;&nbsp;<input type=”text” size=”5″ id=”wdt”></p>
<p>Length=&nbsp;<input type=”text” size=”5″ id=”lgt”></p>
<p>Height=&nbsp;<input type=”text” size=”5″ id=”hgt”></p>

<h3>The Volume is</h3>

<input type=”text” size=”5″ id=”ans1″><br><br>
<h3 id=”ans”><h3>
function Nextq() {
<input type=”button” value=”Check Answer” onclick=”CalSize()”><br><br>
<input type=”button” value=”Next Question” onclick=” location.reload();”>
function RandomFn() {
document.getElementById(“wdt”).innerHTML = parseInt(Math.random()*9+1);
document.getElementById(“lgt”).innerHTML = parseInt(Math.random()*9+1);
document.getElementById(“hgt”).innerHTML = parseInt(Math.random()*9+1);
<script type=”text/javascript” src=”volume2.js”></script>


Click Here to run the script.