#14 JS: create a calculator by prompt()

Final Calculator Design

https://ithelp.ithome.com.tw/upload/images/20210912/20130362gh0GXsvAdm.png

<!DOCTYPE html>
<html>
<head>
<title>JavaScript</title>
<script type="text/javascript">

var n1=prompt("Please key in a random number.","e.g.123"); 
var n2=prompt("Please key in a random number.","e.g.123");
var result=n1*n2;
alert(result);

</script>
</head>
</html>

Design a Calculator

prompt() is a dialogue box that user can key in values, and it will close until the user submit or cancel.

Basing on the rule, we can separate the user behavior into steps, like:
input: prompt(default value or an example) → operate → output: alert(data)

For example, to create a simple calculator...

var n1=prompt("Please key in a random number." , "7");

https://ithelp.ithome.com.tw/upload/images/20210912/20130362xvqwkSkwKz.png

var n2=prompt("Please key in a random number." , "7");

https://ithelp.ithome.com.tw/upload/images/20210912/20130362NVWa00vLOf.png

var result=n1*n2;
alert(result);

=> The result is 49.
https://ithelp.ithome.com.tw/upload/images/20210912/201303621Zo7FVzoZA.png


Music of Today: 马祖小夜曲 Ma-Chu Song by MC Hotdog 热狗 Feat. Agota


Like/Share/Follow

Feel free to comment and share your ideas below to learn together!
If you guys find this article helpful, please kindly do the writer a favor — LIKE this article./images/emoticon/emoticon12.gif


<<:  Day 02:准备好你的家私,为开发 Angular 做好准备

>>:  Day-13 发动了革命的童养媳少女!打开 PlayStation 於新电视上重启革命之光

Day 30 - [最终章] 完赛心路历程

天啊~终於到了铁人赛的最後一天,威尔猪成功插旗了。第一次参加铁人赛就历经艰辛,甚至可以说是惊心动魄...

网页变形-30天学会HTML+CSS,制作精美网站

transform属性是变形的意思,可运用在2D及3D变形,可以对网页元素做旋转、缩放、平移、倾斜、...

Day 20. Hashicorp Nomad: Docker driver image behavior

Hashicorp Nomad: Docker driver image behavior 在Has...

Day35 参加职训(机器学习与资料分析工程师培训班),专题讨论

今日时间主要给学员与组员讨论专题,另外助教也分享参赛及制作专题的心得。 ...

[Day14]C# 鸡础观念- 不同层次的阵列~二维阵列

既然空间有维度, 阵列也像是空间一样, 他是拥有维度的, 就让我们探索看看吧 二维阵列 就如同象棋棋...