JS简易计算器实例讲解


Posted in Javascript onJune 30, 2020

本文实例为大家分享了JS实现简易计算器的具体代码,供大家参考,具体内容如下

简易计算器:

1)选择需要运算的类型,输入对应的数字
2)输入需要参与运算的数字
3)输入“计算”二字,进行运算后,显示运算结果及运算表达式

JS简易计算器实例讲解

<script type="text/javascript">
 // 加法运算
 function plus(arrPlus){
 var sum = 0;
 for(var i = 0 ; i < arrPlus.length ; i++){
 sum = sum + arrPlus[i];
 }
 console.log('函数plus循环后求和结果的数是'+ sum);
 return sum;

 }
 // 减法运算
 function subtract(arrSubtract){
 var substractResult = arrSubtract[0];
 for(var i = 1 ; i < arrSubtract.length ; i++){
 substractResult = substractResult - arrSubtract[i] ;
 }
 return substractResult;
 }
 // 乘法运算
 function multiple(arrMultiple){
 var multipleResult = 1;
 for(var i = 0 ; i < arrMultiple.length ; i++){
 multipleResult = multipleResult * arrMultiple[i];
 }
 return multipleResult;
 }
 // 除法运算
 function divide(arrDivide){
 var divideResult = arrDivide[0];
 for(var i = 1 ; i < arrDivide.length ; i++){
 divideResult = divideResult / arrDivide[i];
 }
 return divideResult; 
 }
 // 输入需要运算的数值
 function calculateNum(num,mention){
 i = 0;
 num = [];
 do{
 // var i = 0;
 mention = prompt('请输入第'+ (i+1) +'个数,注意:'+'输入"计算"二字将获得结果');
 if(mention != '计算'){
 mention = mention * 1;
 num[i]= mention ;
 i++;
 } 
 }while(mention != '计算');
 console.log('calculateNum存入的数值是' + num);
 return num;
 }
 //显示计算表达式
 function formula( arr){
 fom = [] ;
 for(var i =0 ; i < arr.length ; i++){
 if(apply == 1){
 fom = fom + arr[i] + '+';
 }else if (apply == 2){
 fom = fom + arr[i] + '-';
 }else if (apply == 3){
 fom = fom + arr[i] + '*';
 }else if(apply == 4){
 fom = fom + arr[i] + '/';
 } 
 }
 console.log('计算表达式formula函数输出的是' + fom);
 return fom;
 }

 //全局变量
 var i = 0 ;
 var fom = '';
 var num = [];
 var mention = ''
 apply = '';
 do{
 // 计算器主面板
 apply = prompt('欢迎使用简易计算器\n'+'1、加法运算\n'+'2、减法运算\n'+'3、乘法运算\n'+'4、除法运算\n'+'5、退出\n'+'请输入您的选项');
 apply = apply * 1;
 switch(apply){
 case 1:
 var plusInput = calculateNum(num,mention); 
 alert(formula(plusInput)+'计算结果是' + plus(plusInput));
 break;
 case 2:
 var subtractInput = calculateNum(num,mention); 
 alert(formula(subtractInput)+'计算结果是' + subtract(subtractInput));
 break; 
 case 3:
 var multipleInput = calculateNum(num,mention); 
 alert(formula(multipleInput)+'计算结果是' + multiple(multipleInput));
 break;
 case 4:
 var divideInput = calculateNum(num,mention); 
 alert(formula(divideInput)+'计算结果是' + divide(divideInput));
 break; 
 }
 }while(apply != 5)
 alert('欢迎使用!');
</script>

关于计算器功能实现的更多精彩文章请点击专题:计算器实现 学习查看

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一个判断email合法性的函数[非正则]
Dec 09 Javascript
用Javascript实现锚点(Anchor)间平滑跳转
Sep 08 Javascript
常用一些Javascript判断函数
Aug 14 Javascript
JavaScript用Number方法实现string转int
May 13 Javascript
JS实现页面超时后自动跳转到登陆页面
Jan 19 Javascript
js焦点文字滚动效果代码分享
Aug 25 Javascript
JavaScript时间操作之年月日星期级联操作
Jan 15 Javascript
Bootstrap插件全集
Jul 18 Javascript
JavaScript实现解析INI文件内容的方法
Nov 17 Javascript
以BootStrap Tab为例写一个前端组件
Jul 25 Javascript
angular指令笔记ng-options的使用方法
Sep 18 Javascript
JS实现前端动态分页码代码实例
Jun 02 Javascript
如何在postman中添加cookie信息步骤解析
Jun 30 #Javascript
JSON获取属性值方法代码实例
Jun 30 #Javascript
JS猜数字游戏实例讲解
Jun 30 #Javascript
vue实现评价星星功能
Jun 30 #Javascript
Json实现传值到后台代码实例
Jun 30 #Javascript
vue实现循环滚动列表
Jun 30 #Javascript
js实现简单音乐播放器
Jun 30 #Javascript
You might like
PHP网页游戏学习之Xnova(ogame)源码解读(十二)
2014/06/25 PHP
PHP实现bitmap位图排序与求交集的方法
2016/07/28 PHP
PHP类的自动加载机制实现方法分析
2019/01/10 PHP
再谈Yii Framework框架中的事件event原理与应用
2020/04/07 PHP
指定js可访问其它域名的cookie的方法
2007/09/18 Javascript
妙用Jquery的val()方法
2012/06/27 Javascript
js实现的map方法示例代码
2014/01/13 Javascript
用js替换除数字与逗号以外的所有字符的代码
2014/06/07 Javascript
node.js 开发指南 ? Node.js 连接 MySQL 并进行数据库操作
2014/07/29 Javascript
JavaScript静态类型检查工具FLOW简介
2015/01/06 Javascript
js函数与php函数的区别实例浅析
2015/01/12 Javascript
jQuery插件实现大图全屏图片相册
2015/03/14 Javascript
jQuery简单实现日历的方法
2015/05/04 Javascript
javascript中setTimeout使用指南
2015/07/26 Javascript
js基于setTimeout与setInterval实现多线程
2016/06/17 Javascript
微信小程序 后台登录(非微信账号)实例详解
2017/03/31 Javascript
vue + webpack如何绕过QQ音乐接口对host的验证详解
2018/07/01 Javascript
vue移动端html5页面根据屏幕适配的四种解决方法
2018/10/19 Javascript
基于Vue-cli快速搭建项目的完整步骤
2018/11/03 Javascript
Vue入门之数量加减运算操作示例
2018/12/11 Javascript
vue-cli3+typescript初体验小结
2019/02/28 Javascript
Node.js API详解之 zlib模块用法分析
2020/05/19 Javascript
js实现弹幕墙效果
2020/12/10 Javascript
python 设置输出图像的像素大小方法
2019/07/04 Python
Python-Tkinter Text输入内容在界面显示的实例
2019/07/12 Python
使用pyecharts1.7进行简单的可视化大全
2020/05/17 Python
Python实现敏感词过滤的4种方法
2020/09/12 Python
python 录制系统声音的示例
2020/12/21 Python
你可能不熟练的十个前端HTML5经典面试题
2018/07/03 HTML / CSS
uniapp+Html5端实现PC端适配
2020/07/15 HTML / CSS
美国婴儿用品店:Babies”R”Us
2017/10/12 全球购物
六十岁生日答谢词
2014/01/10 职场文书
公司董事长助理工作职责
2014/07/12 职场文书
大学生村官入党自传
2015/06/26 职场文书
深入理解Vue的数据响应式
2021/05/15 Vue.js
使用Oracle跟踪文件的问题详解
2021/06/28 Oracle