第⼗四篇JS实现加减乘除正则表达式
JS实现加减乘除
这节课，将会继续使⽤到if判断，会让同学们再看到⼀个新的，else if判断语句，意思是：否则如果，是基于if下的判断语句，就是说，if不成⽴则再来判断else if，可以这样，假如a=1,if(a=2){我是2}else if(a=1){我是1}else{我是3}，就是这样的关联，但有的同学问，直接⽤if⼀直判断就好了，不需要⽤else if，是这样的，程序运⾏，else if是基于if的对吧，那么它就是⼀条语句，如果相同的判断语句多了，全⽤if，程序就会⼀个⼀个去执⾏，量就会加⼤，就会影响程序速度。
这节课其实最难的是，“正则表达式”，它特别厉害哦，它可以很简单的来做，⼿机、IP、验证码、密码、⽤户名、地址等操作，可以节省更多的代码和思维，它的特点就是，开头和结尾都是⽤⼀根 / 斜杠的，⾥⾯则是正则内容，⽤做判断特别给⼒。
上代码，⽼师做⼀个初学者能看到的加减乘除法：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>JS实现⼀个加减乘除</title>
</head>
<body>
<h3>加减乘除法</h3>
<input placeholder="第⼀个数字" id="num1" type="text"/>
<select name="fuhao" id="fuhao">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
js中文正则表达式</select>
<input placeholder="第⼆个数字" id="num2" type="text"/>
<button οnclick="yunsuan()">运算</button>
<input placeholder="得出结果" id="num3" type="text"/>
<script>
function yunsuan(){
//点击事件运⾏后，获取相关的所有元素id
var num1 = ElementById("num1");
var num2 = ElementById("num2");
var num3 = ElementById("num3");
var fuhao = ElementById("fuhao");
/
/ 下⾯这个是正则表达式，下⾯这个意思则是，只能输⼊数字，字数必须有⼀个及以上var zhengze = /^[0-9]{1,}$/;
//这⾥⾯则是⽤判断，使⽤正则的格式，来判断 num1 和num2格式是否正确
if(!st(num1.value)){
//⽼师判断⼒⽤了⼀个 !(叹号)，意思是取相反，它本⾝成⽴则会变成不成⽴
alert('只能输⼊整数，数字哟');
//判断如果不成⽴，弹出提⽰并让代码停⽌运⾏，就不往下⾯⾛了
return false;
}else if(!st(num2.value)){
//else if意思是否则如果，是在if下⾯使⽤的⼀个判断语句
alert('只能输⼊整数，数字哟');
return false;
}
//先⽤判断，判断它的运算符号
//value 是获取它的⽂本框⾥的值 select是下拉列表，也可以当做是⽂本框哦
if(fuhao.value == '+'){
//⼀个等号是赋值，两个等号才是平常我们作⽐较说的“等于”
//在JS⾥，+号不是两个数字相加，⽽是‘拼接’，将两个数字或者字符串拼接在⼀起        //这⾥我们做数字运算，就要⽤到parseInt⽅法，就它转化成数字才能相加得出结果num3.value = parseInt(num1.value)+parseInt(num2.value);
}else if(fuhao.value == '-'){
num3.value = parseInt(num1.value)-parseInt(num2.value);
}else if(fuhao.value == '*'){
num3.value = parseInt(num1.value)*parseInt(num2.value);
}else if(fuhao.value == '/'){
num3.value = parseInt(num1.value)/parseInt(num2.value);
}
}
</body>
</html>
这⾥⾯的代码还可以再节省⼀点，但⽼师先做出这样，让⼊门的同学更加看得懂。那么怎么节省呢，有兴趣的同学⾃⼰去想⼀下咯！
这⾥⽼师只⽤了⽀持整数，还有⼩数呢...
这⾥⽼师每⼀个运算符⼀⾏代码，就是4⾏，再加上判断if就⼜是⼏⾏，数学运算符不⽌这四个，那么我们就再⼀直⽆线延伸下去写代码吗？那就太费事了，有办法能做到，直接获取运算符，然后得出结果，⽼师不吹⽜，⼀⾏代码直接搞定，那么有兴趣的同学，⾃⼰去开发咯！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。