什么是算术运算符？及其小案例

 

-算术运算符，顾名思义就是用来进行数字运算的符号，有五种算术运算符--加法运算符（+），减法运算符（-），乘法运算符（*），除法运算符（/），取模运算符（又称取余运算符）（%）。

-算术运算符的结合性是左结合性（从左至右计算）。

-算术运算符的优先级是什么呢？

乘法运算符（*），除法运算符（/），取模运算符（又称取余运算符）（%）的优先级高于加法运算符（+），减法运算符（-）。

//加法运算符（+），减法运算符（-）优先级低于乘法运算符（*），除法运算符（/）
//，取模运算符（又称取余运算符）（%）
     var a=1+2*3;
     var b=1+2/2;
     var c=4-2%1;
     console.log(a);//7
     console.log(b);//2
     console.log(c);//4

 

加法运算符，其他的运算符同理。

//声明两个变量，将数值存储进去。可以看出变量和变量相加，控制台输出的结果是一个数值。
    var a=1;
    var b=2;
    var c=a+b;
    console.log(c);//3
//这里可以看出变量和常量（不可以变化更改的量，定死的量）相加，
//控制台输出的结果也是一个数值。
     var s=a+9 ;
     console.log(s);  //10

 

-什么是取模运算符？

就相当于对一个数进行运算，取它的余数。

相应的公式为：被除数÷ 除数 =商 ...余数

//10取余4的结果是2
      var a=10%4
      console.log(a);//2

 

-加法运算符的注意点：

1. 任何非数值类型的数据在参与加法运算之前，都会被自动的转换为数值类型之后再参与运算。没有例外。

2. 任何的数据和NaN进行运算，结果都是NaN。相当于任何数值和0运算，结果都是0。

3. ▲任何数据和字符串进行相加，都会被先转换为字符串类型之后再进行运算，（都会把非字符串的类型转换为字符串再进行相应的运算）字符串相加的本质就是字符串的拼接。

  // 首先将数值1转换为字符串类型 '1',然后和字符串 '2'进行拼接。
 // 其他的运算数据同理。
   var a=1+'2';
   console.log(a);//12

 

-减法运算符的注意点：

1. 任何非数值类型的数据在参与加法运算之前，都会被自动的转换为数值类型之后再参与运算。

2. 任何的数据和NaN进行运算，结果都是NaN。相当于任何数值和0运算，结果都是0。

3. ▲任何数据和字符串相减，都会先把字符串转换为数值类型之后再进行运算。和加法运算符恰恰相反。

//首先将字符串'123'转换为数值123，然后和数值1进行相应的运算。 
//   其他的运算数据同理。    
      let a=1-'123';
      console.log(a);//-122

 

-乘法运算符，除法运算符的注意点和减法运算符的注意点一模一样的。

 

-取模运算符的注意点：

格式为：Y%X=余数

1. 如果Y>X，就正常取余。

         var a=10%5;
         console.log(a);//0

    

2. 如果Y<X，那么结果就是Y。

         var b=2%5;
         console.log(b);//2

    

3. 如果X等于0，那么结果就是NaN。

         var c=3%0;
         console.log(c);//NaN

    

4. 取模（取余）运算结果的正负值，取决于Y而不是X。

         var d1=10%（-3）;
         console.log(d1);//1
         var d2=-10%3;
         console.log(d2);//-1

   ---

    

简单的计算器小案例：

首先添加三个文本输入框，分别给它们一个ID，第一个输入框的ID为num1，第二个输入框的ID为num2，第三个输入框的ID为result。

然后添加一个运算符的输入框，它的ID为op。

JavaScript的代码为：

//parseInt() 专门用于将字符串类型转换为数值类型，将值转换为整数。
//document.getElementById   通过元素ID来查找相应的元素。
//然后分别获取三个文本输入框的value值
            var num1=parseInt(document.getElementById("num1").value);
            var num2=parseInt(document.getElementById("num2").value);
                  var op=document.getElementById("op").value;
//声明一个变量result（结果） 将0赋值给result。
            var result=0;

 

简单实现 加减乘除 的效果：

可以使用循环遍历的语句来实现，

第一种方法：if-else if 语句 -使用该语句来选择多个代码块之一来执行， 遵从从上到下的执行方式

        if(op=="+"){
                result=num1+num2;
            }else if(op=="-"){
                result=num1-num2;
            }else if(op=="*"){
                result=num1*num2;
            }else{
                if(num2==0){
                    alert("除数不能为零");
                    //返回
                    return;
                }
                result=num1/num2;
            }
//将result的结果赋值给 -document.getElementById("result").value
//（通过元素result的ID来查找元素，获取它的value值）
            document.getElementById("result").value=result;
​

 

第二中方法：switch 语句 - 使用该语句来选择多个代码块之一来执行， 遵从从上到下的执行方式

            switch(op){
                case "+":
                    result=num1+num2;
                    break;
                case "-":
                    result=num1-num2;
                    break;
                case "*":
                    result=num1*num2;
                    break;
                default:/*使用 default 关键词来规定匹配条件不存在时该执行的代码*/
                    if(num2==0){
                        alert("除数不能为零");
                        //返回
                        return;
                    }
                    result=num1/num2;
                    break;
            }
//将result的结果赋值给 -document.getElementById("result").value
//（通过元素result的ID来查找元素，获取它的value值）
            document.getElementById("result").value=result;
        

 

 

案例扩展：

1.ECMAScript 提供了两种把非数字的原始值转换成数字的方法，即 parseInt(),parseFloat()。

前者将数值转换为整数，后者将数值转换为浮点数（就是小数点）。专门用于string（字符串）类型的转换。

2.有三种查找HTML元素的方法：

方法	描述
document.getElementById(id)	通过元素ID来查找相应的元素
document.getElementsByTagName(name)	通过元素标签名来查找相对应的元素
document.getElementsByClassName(name)	通过类名来查找相对应的元素