CÁCH DÙNG parseInt() TRONG JAVASCRIPT-UPDATE

HOW TO USE ParseInt() function in JavaScript-Updated’

8-30-2016

ParseInt do 2 chữ Parse và Integer ghép lại.

Parse nghĩa là lấy ra (extract); Integer nghĩa là con số nguyên.

Nếu muốn có số lẽ phải dùng parseFloat() function.

parseFloat() chỉ họat động với base-10 mà thôi.

Dùng parseInt() function để lấy ra một trị số của con số nguyên

hàm chứa trong một string (Extract an integer value from a string).

Con số lấy ra sẽ thay đổi tuỳ theo mathematical base còn gọi là

radix mà chúng ta tự chọn cho string tuỳ theo công việc.

Muốn parseInt() hoạt động phải viết nó trong script tags và phải

có 2 thành phần chứa trong parenthese như sau :

parseInt(string,base) hoặc parseInt(variable,base)

Nếu chúng ta không ấn định base thì parseInt() sẽ tự động chọn

 base 10 goị là decimal base.

Thí dụ.

<script>

var vienquocgiađinhchuan ="1975";// string

document.write(parseInt(vienquocgiađinhchuan));// output 1975

 vì base 10

</script>

* Base bắt buộc là một con số và phải ở giữa từ 2 tới 36.Nếu base

 nằm ngoài thì parseInt sẽ cho output NaN .

* Nếu con số có mang một chữ nào đó đứng trước , parseInt sẽ

dừng lại chỗ có chữ và cho output NaN.

* Nếu trong con số có mang một chữ nào đó , parseInt sẽ 

dừng lại chỗ có chữ và chỉ cho output của con số đứng trước chữ.

parseInt("abc"); // output NaN 

parseInt("a11"); // output NaN vì có chữ a đứng trước con số 11.

parseInt("11a547")); // output 11,dừng tại chữ a.

parseInt("11abc"); // output 11 

parseInt("11"); // output 11 vì base 10 

parseInt("11",2) ;// output 3 vì base 2

parseInt("11",8) ;// output 9 vì base 8

parseInt("11",16) ;// output 17 vì base 16

parseInt("11",36) //output 37 vì base 36

parseInt("11",37); // output NaN vì base 37 không ở trong 2 - 36

parseInt("0112",10); // output 112 vì base 10

parseInt("0112",8); // output 74 vì base 8 

parseInt("0112",24) //output 602 vì base 24

parseInt("0x112"); //output 274 vì trước con số có ký hiệu 0x nên

 parseInt tự động chọn base 16.

parseInt("A",16) ;// output 10

parseInt("B",16) ;// output 11

parseInt("E",16) ;// output 14

parseInt("F",16) ;// output 15

Mathematical base conventions.

Decimal system(base-10) dùng 10 con số goi ( 10 digits) từ 0 tới 9.

Con số đếm tiếp theo 10 là 11.Chúng ta chỉ cần thay đổi vị trí của 

10 con số đó để viết ra khi đếm.

Binary system(base-2) chỉ dùng 2 con số 0 và 1 tượng trưng cho OFF 

và ON,nên Binary không có con số 2 để đếm tiếp theo như decimal 

system . 

Do đó muốn có ký hiệu để viết ra khi muốn đếm giống như decimal 

thì bắt buộc chúng ta phải sắp xếp vị trí của 2 con số 0 và 1 bằng 

cách đem số 1 đặt trước số 0 thành con số 10 và xem đó là con 

số 2 của decimal.

Rồi đặt con số 1 vào vị trí 0 của 10 để có con số 11 và xem đó

 là số 3 của decimal.

Sau con số 11 trở đi cho tới con số 99 không có con số nào chỉ gồm

 có 0 và 1 nữa cho nên chúng ta bắt buộc phải chọn con số 100 của

 decimal gồm có 0 và 1 để làm số 4 cho Binary system.

Tếp tục theo phương pháp sắp xếp như vậy thì 101 là số 5 của decimal,

110 là số 6 của decimal, 111 là số 7 của decimal, 1000 là số 8 

của decimal, 1001 là số 9 của decimal,10010 là số 10 của decimal…

Octal system(base-8) dùng 8 con số t̀ư 0 tới 7.Con số đếm tiếp

 theo 8 là 9.

Hexadecimal system(base-16) dùng 16 con số từ 0 tới 9 cộng

 thêm 6 chữ nữa là A B C D E F.Con số của chữ F là 15 .Con số đếm tiếp

theo16 là 17.

                       ------------------
Nếu xếp binary thành từng nhóm,mỗi nhóm có 4 bits,
sẽ thây như sau .
Nhóm 0000 tương ứng với con sô 0 của hexadecimal.
Nhóm 0001 tương ứng với con sô 1 của hexadecimal.
Nhóm 0010 tương ứng với con sô 2 của hexadecimal.
Nhóm 0011 tương ứng với con sô 3 của hexadecimal.
Nhóm 0011 tương ứng với con sô 3 của hexadecimal.
Nhóm 0100 tương ứng với con sô 4 của hexadecimal.
Nhóm 0101 tương ứng với con sô 5 của hexadecimal.
Nhóm 0111 tương ứng với con sô 6 của hexadecimal.
Nhóm 1010 tương ứng với chữ A của hexadecimal.
Nhóm 1110 tương ứng với chữ B của hexadecimal.
Nhóm 1111 tương ứng với chữ F của hexadecimal.
Vậy đổi con số A0D4 của hexadecimal ra binary thi 
chúng ta sẽ có 1010 1000 1101 0100 dài lòng thòng.
Đối với octal system thì mỗi con số của octal tương ứng
 với 3 bits.
Nhóm 000 của binary tương ứng với số 0 của octal.
Nhóm 001 của binary tương ứng với số 1 của octal.
Nhóm 011 của binary tương ứng với số 2 của octal
Nhóm 111 cuả binary tương ứng với  số 7 của octal. 
                    -----------------------
Tại sao bày ra nhiều mathematical systems ?
Computer thuộc về electric phải dùng binary.Còn octal và 
hexadecimal rất tiện lợi cho con người khi đọc và viết 
vì nó không quá dài lòng thòng và nằm giữa binary và decimal.
Theo quy ước ISO,muốn diễn tả màu sắc thì trong HTML và 
javaScript phải dùng hexadecimal system gồm có 6 con số.
Thí dụ  #FF0000 là màu đỏ, #00FF00 là màu green,
#0000FF là màu blue.
                         --------------------

Nếu phía trước con số , chúng ta viết thêm số zero thì parseInt sẽ tự

động chọn base 8.

Thí dụ parseInt("0112"); // output 74 base 8 .Nhưng nên viết

 thêm base 8 thì chắc chắn hơn vì có những lúc không đúng.

Nếu phía trước con số, chúng ta viết thêm 0x (số zero và chữ x) thì

 parseInt sẽ tự động chọn base 16.

Thí dụ parseInt("0x112"); // output 274 base 16 

ÁP DỤNG ParseInt() function

ParseInt() function rất thông dụng trong nhiều lảnh vực khi viết 

JavaScript Programs và Java Programs. 

1-Dùng parseInt() trong Drop Down Menu.

<script>

  document.write( " 1)WHERE IS SAN FRANCISCO ?<br>");

  document.write( " 2)WHERE IS PARIS ?<br>");

  document.write( " 3)WHERE IS TOKYO ?<br>");

  document.write( " 4)WHERE IS LONDON ?");

  var x = parseInt(prompt("ENTER A OPTION NUMBER"));

 if(x==1){alert("SAN FRANCISCO IS IN USA");}

 else if(x==2){alert("PARIS IS IN FRANCE");}

 else if(x==3){alert("TOKYO IS IN JAPAN");}

 else if(x==4){alert("LONDON IS IN ENGLAND");}

 else alert("YOU DON'T GET THE ANSWER");

</script>

2-Dùng parseInt() trong JavaScript làm di chuyển một vật, một hàng chữ hay hình vẽ tuỳ thích.

Trong script nầy parseInt() function có nhiệm vụ làm

“parsing” đọan đường di chuyển của quả banh tính bằng pixels.

Đọan đường đó có hàm chứa một con số của chiều dài di

chuyển của quả banh tính theo pixels mà chúng ta không thấy.

Còn động tác tạo ra sự di chuyển là +1+"px" ( gọi là increment tính bằng pixels ).

Chép script nầy vào Notepad và làm screenshot hình quả banh bên

dưới.Tồn trử hình quả banh trong Document.

Quý bạn sẽ có một trò chơi làm quả banh di chuyển t̀ừ

trái qua phải.Nếu muốn dừng lại thì click chữ STOP.Quả banh sẽ trở

về vị trí 50 pixels.

<body>

<img id="ball" style="position:relative;left:0px;top:50px;width:25px"

 src="ball2.gif">

<script>

 var x;

 x=document.getElementById("ball");

 function doMove(){

 x.style.left=parseInt(x.style.left) +1+"px";

 t=setTimeout(doMove,20)}//Nếu thiếu doMove thì ball chỉ nhích tới rồi dừng lại.

</script>

<span onClick="doMove()">START</span>

<span onClick="clearTimeout(t) ; x.style.left=50">STOP</span>

</body>

Ghi chú.

setTimeout ( ) function là method của

windows object , có 2 cách viết như sau đều cho kết quả giống nhau.

t = setTimeout (doMove,20 ) hoặc t =setTimeout("doMove()" , 20)

Con số 20 là delay time of 20 milliseconds(ms), nghĩa là sau 20 ms

function doMove() mới được called và chỉ cần được called một lần mà thôi

để tiếp tục di chuyển mãi cho đến khi chúng ta muốn stop.

Theo tiêu chuẩn,delay time phải có tối thiểu 4 ms.

Nếu không muốn xử dụng setTimeout(), chúng ta xử dụng setInterval().

t = setInterval("doMove()", 20).Trong trường hợp nầy,con số 20 nghĩa là 

phải đợi sau 20 ms function doMove mới được called, rồi phải đợi sau 

20 ms nữa function mới được called và cứ tiếp tục như vậy.

Phải viết t = setInterval("doMove()", 20) ở ngoài function doMove() goị là 

vị trí global thì mới có thể ClearInterval(t) bằng cách click vào nút STOP.

<span onClick="clearInterval(t);x.style.left=50">STOP</span>

Trường hợp nầy không cần nút START vì khi mở Browser quả banh di 

chuyển ngay.Muốn dùng nút START phải tạo thêm một function nữa chứa

 t = setInterval("doMove()",20). <html><body>

3-Dùng parseInt và parseFloat trong hóa đơn.

<body>

<p>BOLSA FLOWER SHOP RECEIPT<br>

 WE HAVE THESE FLOWERS : <br>

 ROSE : 2.45/ea<b> DAISY : 1.55/ea<br>

 ORCHID : 0.75/ea<br>TULIP : 1.25/ea</p>

<script>

var T1= prompt('How many roses do you want ?');

var T2= prompt('How many daisies do you want ?');

var T3= prompt('How many orchids do you want ?');

var T4= prompt('How many tulips do you want ?');

var TC= parseInt(T1)+parseInt(T2)+parseInt(T3)+parseInt(T4);     

     document.write('FLOWERS BẠN ĐÃ CHỌN MUA:<br>'+

     T1 +':'+ 'ROSES.<br>'+ 

     T2 +':'+ 'DAISIES.<br>'+

     T3 +':'+ 'ORCHIDS.<br>'+

     T4 +':'+ 'TULIPS.<br>')

     document.write('<br>')

var t1=parseFloat(T1*2.45)

var t2=parseFloat(T2*1.55)

var t3=parseFloat(T3*0.75)

var t4=parseFloat(T4*1.25)

var total=t1+t2+t3+t4 ;

 document.write('PLS PAY THIS AMOUNT:<br>'+

     t1 +':'+'ROSES.<br>'+ 

     t2 +':'+'DAISIES.<br>'+

     t3 +':'+'ORCHIDS.<br>'+

     t4 +':'+'TULIPS.<br>'+

    'TỔNG SỐ:'+ total+'USD.<br>');

  var today = new Date();

  var year = today.getFullYear();    

  document.write( "Thank You.<br>"+ today);              

</script>

OUTPUT.

BOLSA FLOWER SHOP RECEIPT

WE HAVE THESE FLOWERS : 

ROSE : 2.45/ea DAISY : 1.55/ea

ORCHID : 0.75/ea

TULIP : 1.25/ea

FLOWERS BẠN ĐÃ CHỌN MUA:

10:ROSES.

10:DAISIES.

null:ORCHIDS.

null:TULIPS.

PLS PAY THIS AMOUNT:

24.5:ROSES.

15.5:DAISIES.

0:ORCHIDS.

0:TULIPS.

TỔNG SỐ:40USD.

Thank You.

Tue Sep 06 2016 06:34:23 GMT-0700 (Pacific Daylight Time)

3-Xử dụng parseInt() và parseFloat()

PROGRAM NẦY CÓ TỔNG CỘNG 14 LINES OF CODES

<body><script>

 var shop = {

 greeting :" <span style='color:red'>WELCOME TO : ENRIQUE SHOP</span>" ,

 product :"CHÚNG TÔI BÁN RICE VÀ SUGAR VỚI GIÁ SỈ VÀ LẺ \n RICE BAG : 5 lbs \n SUGAR BAG : 2 lbs ",

 appreciation :"<span style='color:red'>THANK YOU , SEE YOU AGAIN ! </span>",}   

   document.write(shop.greeting +"<br>");

   alert(shop.product);               

 var x1 = prompt("OVER 100 BAGS.\n HOW MANY WHOLESALE RICE BAGS YOU WANT?");

 var pay1 = parseInt(x1*4.00);

 if(x1<=100){pay1=0}; var a1 = pay1;            

 var x2 = prompt("LESS THAN 100 BAGS.\n HOW MANY RETAIL RICE BAGS YOU WANT?");

 var pay2 = parseFloat(x2*5.25);

 if(x2>100){pay2=0};var a2 = pay2;         

 var y1 = prompt("OVER 100 BAGS.\n HOW MANY WHOLESALE SUGAR BAGS YOU WANT?");

 var pay3 = parseInt(y1*4.00);

 if(y1<=100){pay3=0}; var a3 = pay3;           

 var y2 = prompt("LESS THAN 100 BAGS.\n HOW MANY RETAIL RICE BAGS YOU WANT?");

 var pay4 = parseFloat(y2*3.25);    

 if(y2>100){pay4=0};var a4 = pay4;

 var tot = a1+a2+a3+a4;                                                                                 

 document.write("* <span style='color:blue'>TOTAL PAY : </span>" + tot +" "+ "USD"+ "<br>"+ shop.appreciation + "<br>"+ "* MANAGER : BAXAO XAOKE " + "<br>");                                                                    

function findSum(){

document.getElementById("r1").value = a1;

document.getElementById("r2").value = a2;

document.getElementById("s1").value = a3;

document.getElementById("s2").value = a4;

document.getElementById("Total").value = tot}

var today = new Date();

var year = today.getFullYear();   

document.write(today +"<br>");

</script>          

 1-RICE WHOLESALE PAY : <input type="text" size ="5" id ="r1" /><br>

 2-RICE RETAIL PAY : <input type="text"size ="5" id ="r2" /><br>

 3-SUGAR WHOLESALE PAY : <input type="text"size ="5" id ="s1" /><br>

 4-SUGAR RETAIL PAY : <input type="text"size ="5" id ="s2" /><br>

            TOTAL PAY : <input type="text" size ="5" id="Total"/><br>

 <span onclick="findSum()">CLICK TO GET CALCULATION</span> 

</body>

4-Xử dụng parseInt() , ParseFloat(),Math.floor() và Modulus

để viết một JavaScript Program dùng rút tiền nhà bank

Math.floor() là javscript function dùng để làm tròn con số khi gặp

con số có mang số lẻ.

Thí dụ.

document.write(Math.floor(1.6)) // output là 1,bỏ số lẻ

document.write(Math.floor(-5.1 )) // output là -6

documenet.write(Math.floor(-5.9 )) // output là -6

Khi gặp số âm, Math.floor( ) chọn con số nhỏ nhất.

Modulus còn được goị là modulo là javaScript operator có ký hiệu %.

Ký hiệu sẽ cho con số còn sót lại sau khi thực hiện xong tóan chia chẳn.

(Modulus gives us the remainder after a division)

Thí dụ.

document.write(123%5) cho output 3.  Nghĩa là chia 123 cho 5 còn lại 3.

 (The remainder is 3.)

Vào nhà bank rút́ $1258 (USD) gồm giấy bạc $20, $10 và $5 để lì xì Tết.

Script sau đây sẽ cho biết có bao nhiêu tờ $20,$10, $5 và $1 ?

<script>

var  x = prompt("MUỐN RÚT BAO NHIÊU?")

var dollar = parseInt(x);

var d1 = Math.floor(dollar/20);

var d2 = Math.floor((dollar%20)/10);

var d3 = Math.floor(((dollar%20)%10)/5);

var d4 = parseFloat(x%5);

alert( dollar+"gồm có :\n"+

        d1 +"tờ $20 \n"+

        d2 +"tờ $10 \n"+

        d3 +"tờ $5 \n"+

        d4 +"tờ $1" )

</script>

5-XỬ DỤNG parseInt(), parseFloat() VÀ RETURN STATEMENT CỦA JAVASCRIPT ĐỂ VIẾT HÓA ĐƠN.

Return statement của JavaScript có 2 nhiệm vụ.

*Chận tất cả các code sau nó không thể vận hành.

*Thu tóm tất cả những gì mà chúng ta muốn function phải thi hành

 nghĩa là trong parenthese của return phải chứa tất cả nhưng gì chúng

 ta muốn function hiện bày ra cho chúng ta thấy tại nơi chúng ta

call function.

Thí dụ trong script dưới đây chúng ta muốn return statement hiện ra tại alert(display()) nơi chúng ta call display()

Khi nào chúng ta biết nhiều cách xử dụng return statement,chúng ta sẽ viết được nhiều program dễ dàng.

Trong script dưới đây, phải viết 0 (ZERO) cho món hàng không muốn mua thi mới lấy được total (TỔNG CỘNG ).

Sẽ có cách viết script tiếp theo lọai bỏ trở ngại đó.

<body><script> 

   function display(){

   var qt1 = parseInt(prompt("HOW MANY BÁNH CUÔN NHÂN THỊT DO YOU WANT?"));

   var p1 = parseFloat(qt1*4.50);

   var qt2 = parseInt(prompt("HOW MANY BÁNH CÚC DO YOU WANT?"));

   var p2 = parseFloat(qt2*2.50);

   var qt3 = parseInt(prompt("HOW MANY XÔI VÒ DO YOU WANT?"));

   var p3 = parseFloat(qt3*2.50);     

   var qt4 =parseInt(prompt("HOW MANY GIÒ CHÍN DO YOU WANT?"));

   var p4 = parseFloat(qt4*5.50);     

   var total = p1+p2+p3+p4 ;

        return("QUAN THANH HUONG BÁ́NH CUÔN.\n"+

       qt1+"-"+ "BÁNH CUỐN NHÂN THỊT : " + p1 + "\n"+

       qt2+ "-" + "BÁNH CÚC : " + p2 + "\n"+

       qt3+ "-" +"XÔi VÒ : " + p3 +"\n"+

       qt4+ "-" +"GIÒ CHÍN  : " + p4 +"\n"+

        " YOU PAY TÔNG CỌNG : " + total +"\n"+ " THANK YOU") } 

        alert(display());

 </script></body>

VIẾT LẠI SCRIPT TRÊN NHƯ SAU THÌ KHÔNG CÒN GẶP TRỞ NGẠI.

<body><script> 

   function display(){

   var qt1 = prompt("HOW MANY BÁNH CUÔN HÂN THỊT DO YOU WANT?");

   var qt2 = prompt("HOW MANY BÁNH CÚC DO YOU WANT?");  

   var qt3 = prompt("HOW MANY XÔI VÒ DO YOU WANT?");       

   var qt4 = prompt("HOW MANY GIÒ CHÍN DO YOU WANT?");       

   var p1 = parseFloat(qt1*4.50);

   var p2 = parseFloat(qt2*2.50);

   var p3 = parseFloat(qt3*2.50);

   var p4 = parseFloat(qt4*5.50);

   var total = p1 + p2 + p3 + p4;

       return("QUAN THANH HUONG BÁ́NH CUÔN.\n"+

       qt1+ "-"+ "BÁNH CUỐN NHÂN THỊT : " + p1 + "\n"+

       qt2+ "-" + "BÁNH CÚC : " + p2 + "\n"+

       qt3+ "-" +"XÔi VÒ : " + p3 +"\n"+

       qt4+ "-" +"GIÒ CHÍN  : " + p4 +"\n"+

        " YOU PAY TÔNG CỌNG : " + total +"\n"+ " THANK YOU") } 

        alert(display());

 </script></body>

KHÔNG DÙNG RETURN

<body><script> 

   var qt1 = parseInt(prompt("HOW MANY BÁNH CUÔN DO YOU WANT?"));

   var p1 = parseFloat(qt1*4.50);

   var qt2 = parseInt(prompt("HOW MANY BÁNH CÚC DO YOU WANT?"));

   var p2 = parseFloat(qt2*2.50);

   var qt3 = parseInt(prompt("HOW MANY XOI VÒ DO YOU WANT?"));

   var p3 = parseFloat(qt3*2.50);

   var total = p1+p2+p3 ; 

        alert("QUAN THANH HUONG BÁ́NH CUÔN.\n"+

        "BÁNH CUỐN NHÂN THỊT : " + p1 + "\n"+

        "BÁNH CÚC : " + p2 + "\n"+

        "XOi VO : " + p3 +"\n"+

        " YOU PAY TÔNG CỌNG : " + total+"\n"+

        " THANK YOU");        

 </script></body>

6-RECEIPT OF SELLING T-SHITRS

6.1-KHÔNG DÙNG FUNCTION.

<body><script>     

 document.write("SUNDANCE T-SHIRTS SHOP<br>" +

          " WHITE T-SHIRTS IN STOCK :<br>"+              

               " SMALL : 120 <br>" +

               " MEDIUM : 120 <br>" +

               " LARGE : 120 <br>" +

               " XLARGE : 120 ")

     var sm = prompt("HOW MANY SMALL DO YOU WANT ?");

     var med = prompt("HOW MANY MEDIUM DO YOU WANT ?");

     var lrg = prompt("HOW MANY LARGE DO YOU WANT ?");

     var xlg= prompt("HOW MANY EXTRALARGE DO YOU WANT ?");    

     if(sm  <= 120){var t1=parseFloat(sm*1.75)}

     if(med <= 120){var t2=parseFloat(med*2.15)}

     if(lrg <= 120){var t3=parseFloat(lrg*2.75)}

     if(xlg <= 120){var t4=parseFloat(xlg*3.10)}

          var total = t1+t2+t3+t4

          var today = new Date();

          var year =  today.getFullYear();

                  alert(sm +"- SMALL SHIRTS  = $" + t1 + "\n"+

                  med +"- MEDIUM SHIRTS = $" + t2 + "\n"+

                  lrg +"- LARGE SHIRTS  = $" + t3 + "\n"+

                  xlg +"- XLARGE SHIRTS = $" + t4 + "\n"+

                       "*PAY TOTAL =$" + total + "\n"+

                       "*THANK YOU\n"+today);      

</script></body>

6.2-DÙNG FUNCTION VÀ RETURN STATEMENT

<body><script>     

 function selling(){

document.write("SUNDANCE T-SHIRTS SHOP<br>" +

          " WHITE T-SHIRTS IN STOCK :<br>"+              

               " SMALL : 120 <br>" +

               " MEDIUM : 120 <br>" +

               " LARGE : 120 <br>" +

               " XLARGE : 120<br> "+

               " RECEIPT")

     var sm = prompt("HOW MANY SMALL DO YOU WANT ?");

     var med = prompt("HOW MANY MEDIUM DO YOU WANT ?");

     var lrg = prompt("HOW MANY LARGE DO YOU WANT ?");

     var xlg= prompt("HOW MANY EXTRALARGE DO YOU WANT ?");

     if(sm  <= 120){var t1=parseFloat(sm*1.75)}

     if(med <= 120){var t2=parseFloat(med*2.15)}

     if(lrg <= 120){var t3=parseFloat(lrg*2.75)}

     if(xlg <= 120){var t4=parseFloat(xlg*3.10)}

          var total = t1+t2+t3+t4

          var today = new Date();

          var year =  today.getFullYear();

                return(sm +"- SMALL SHIRTS  = $" + t1 + "<br>"+

                  med +"- MEDIUM SHIRTS = $" + t2 + "<br>"+

                  lrg +"- LARGE SHIRTS  = $" + t3 + "<br>"+

                  xlg +"- XLARGE SHIRTS = $" + t4 + "<br>"+

                       "*PAY TOTAL =$" + total + "<br>"+

                       "*THANK YOU.<br>"+today) }       

                  document.write(selling());

</script></body>

OUTPUT

SUNDANCE T-SHIRTS SHOP
WHITE T-SHIRTS IN STOCK :
SMALL : 120 
MEDIUM : 120 
LARGE : 120 
XLARGE : 120 
RECEIPT
10- SMALL SHIRTS = $17.5
20- MEDIUM SHIRTS = $43
5- LARGE SHIRTS = $13.75
null- XLARGE SHIRTS = $0
*PAY TOTAL =$74.25
*THANK YOU.
Sat Sep 17 2016 18:22:02 GMT-0700 (Pacific Daylight Time)

XỬ DỤNG parseInt(), Math.floor(), Math.random()

ĐỂ VIẾT TRÒ CHƠI “ ANTI-MISSILE”

Math.random( ) và  Math.floor() là 2 methods dùng thường xuyên trong JavaScript.

Random có nghĩa là ngẫu nhiên hay tình cờ.Dùng nó để lấy ra những con số ngẫu nhiên không thể biết trước.

Math.random( ) chỉ cho những con số từ zero tới <1 mà thôi cho nên phải nhân nó với một con số gọi là multiplier mới có thể xử dụng được những con số nó cho ra. Quan sát thí dụ 1 sau đây.

Những con số 2, 3, 4 gọi là multipliers.Cộng thêm 1 để gia tăng khoảng rộng.

Thí dụ đang có những con số random tư 0 tới <3 nếu cộng thêm 1 thì sẽ có những con số random từ 0 tới <4.

<script>

  document.write(Math.random() +"<br>"+

                 Math.random()*2+"<br>"+

                (Math.random()*2+1)+"<br>"+

                 Math.random()*3 +"<br>"+

                (Math.random()*3+1)+"<br>"+

                 Math.random()*4 +"<br>"+

                (Math.random()*4 +1))

</script>

OUTPUT

0.16120264479781055
1.2539214850696765
1.8162754811828812
2.4657426807300267
3.732557131406565
1.4128457403862313
1.4055362198560797

Math.floor() dùng để lấy ra những con số nguyên,loại bỏ số lẻ vì không cần thiết.

Nếu dùng nó , thí dụ trên được viết lại như sau sẽ cho những con số nguyên.

Thi dụ 2.

<script>

  document.write( Math.floor(Math.random()) +"<br>"+

                  Math.floor( Math.random()*2)+"<br>"+

                  Math.floor(Math.random()*2+1)+"<br>"+

                  Math.floor(Math.random()*3 )+"<br>"+

                  Math.floor(Math.random()*3+1)+"<br>"+

                  Math.floor(Math.random()*4 )+"<br>"+

                  Math.floor(Math.random()*4 +1))

</script>

                        ----------------------------

1- RUN PERFECTLY

Làm screenshot hình vẽ rocket1.gif và rocket2.gif.Save 2 hình đó trong document.

Copy script nầy vào Notepad rồi save nó với tên là MOVING.html.

Mở recent document,click vào ICON CỦA BROWSER,Quý bạn sẽ có một trò chơi gọi là “ANTI-MISSILE GAME.”

<body>

<img id="rocket1"

style="position:absolute;left:10;top:150;width:25;height:25;"src="rocket1.gif">

<img id="rocket2"

style="position:absolute;right:550;top:20;width:70;height:100;" src="rocket2.gif">

<script>    

      var pos2 = 20; //phải viết ngoài function    

      var speed2 = Math.floor(Math.random()*20)+2; //phải viết ngoài function    

 function doMove(){

      document.getElementById("rocket2").style.top = pos2;

       pos2 += speed2;

       if(pos2 > 350) pos2=20;   

       t=setTimeout(doMove,20);

      var obj1 = document.getElementById("rocket1");   

      obj1.style.left = parseInt(obj1.style.left)+5+"px";

               x = parseInt(obj1.style.left); // phải có mới OK.

               if(x >= 650){obj1.style.left="10px";} } 

</script>

<span onClick="doMove()">START</span>

<span onClick="clearTimeout(t)">STOP</span>

</body>

2-RUN PERFECTLY

<body>

<img id="rocket1"

style="position:absolute;left:10;top:150;width:25;height:25;"src="rocket1.gif">

<img id="rocket2"

style="position:absolute;right:550;top:20;width:70;height:100;" src="rocket2.gif">

<script>

      var pos1 = 10;

      var speed1 = Math.floor(Math.random()*10)+2 ;

      var pos2 = 20;

      var speed2 = Math.floor(Math.random()*20)+2;     

function doMove(){

      document.getElementById("rocket1").style.left = pos1;

       pos1 += speed1;

       if(pos1 > 650) pos1=10;   

    document.getElementById("rocket2").style.top = pos2;

       pos2 += speed2;

       if(pos2 > 350) pos2=20;    

      t=setTimeout(doMove,20);  } 

</script>

<span onClick="doMove()">START</span>

<span onClick="clearTimeout(t)">STOP</span>

</body>

Screenshot 2 hình vẽ nầy rồi save theo dạng rocket1.gif và rocket2.gi