运算符、操作符、if switch语句婚礼纪主页

最新推荐文章于 2024-09-23 18:15:02 发布

thanksKlan

最新推荐文章于 2024-09-23 18:15:02 发布

阅读量201

点赞数 2

文章标签： html5 css3 javascript

本文链接：https://blog.csdn.net/hasakizzz66/article/details/107802107

版权

运算符：+、-、*、/、%
%：例 console.log(10%3) =>10/3=3…1
+: 例 var res=1+5+6+‘7’+0
=>12+‘7’+0
=>1270

一元运算符
++a:先自加，后运算
a++:先运算，后自加（运算完了以后，下一次见到它的时候，值已经+1）
例：var a=1
var res=a++ //没有其他运算的时候，先把这个值拿过来用，用完了以后这个变量再自身+1
例 var a =10,b=5
var res=a++ + b-- + --a + ++b + b++ + a++ + ++a
=> 10 + 5 +10 +5 +5 +10 +12
console.log(res) //=>57
console.log(a) //=>12
console.log(b) //=>6

比较操作符：（按优先级排列）

<、<=、>、>=、==、 != 、===、!==

所有的比较操作符只返回一个结果，要么是true，要么是false
例：
console.log(‘2’==2) =>true 判断值是否相等
console.log(‘2’===2) =>false 判断值、数据类型是否都相等
!= 不等于

NaN用不等于NaN

赋值操作符
例：
var a =0
a+=1; (相当于a=a+1)
console.log(a) =>1

var b=10
b%=3 (相当于b=b%3)
console.log(b) =>1

逻辑运算符
与&&
或 | |
非！
①&&与符号左右两侧都为真
从左到右，如果第一个为true，继续往后判断，如果第二个为true，就把第二个值作为结果返回
如果第一个值为false，就不继续执行了，把第一个的值返回

②| |或左右两侧有一个为真就可
从左到右，如果第一个为true，就不往后继续判断了，直接把这个值返回
如果第一个为false，继续往后判断，遇到一个true直接把它的值作为结果返回。
如果全是false，就把最后一个的值作为结果返回。

③!非取反
例：
console.log(! 2) =>flase
console.log(!0) =>true
优先级：！>&&>| |

if语句
if(条件){
要执行的代码
}

if else 语句
例如 var age=prompt(“请输入你的年龄”)
if(age>=24){
alert(“可以去做大宝剑了”)
}
else if (age>=18){
alert(“可以做小保健”)
}
else{
alert(“滚去学习”)
}

prompt 如果输入了内容，点击确定，拿到的值就是输入的内容
如果点击取消（不管有没有输入内容）拿到的是null
没有输入内容点击确定拿到的是一个空字符串

switch语句
例：
var week=prompt(“请输入1~7的数字”)
switch(res){
case’1’:alert(“周一”)
break
case’2’:alert(“周二”)
break

.
.
.
以此类推写到周六，还剩周天，所以可以用default
case’6’:alert(“周六”)
break
default:alert(“周天”)
break
}
在每个case后面都要写break，不然会继续执行
在一些情况下，可以利用不写break，造成继续执行的switch穿透，遇到break才中断

保留小数 toFixed（）
例： var num=1.23456
var res=num.toFixed(2) =>保留两位小数
console.log(res)

使用switch语句写了一个计算器，代码和内容如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" id="txt1">
    <select name="" id="sel">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
    </select>
    <input type="text" id="txt2">
    <input type="button" value="" id="btn">
    <input type="text" id="result">

    <script>
        // 我们现在可以直接使用 id 就是代表这一个元素  但是以后学了别的东西就不要用了 
        // console.log(sel.value)    可以直接 拿  下拉选择框的值

        // console.log(txt1.value)

        // 页面一上来 就会执行  这时候  文本框里面 还没有 输入内容 
        // =>  我们应该什么时候 去拿 文本框里面的 值？？？  =>  应该在 点击 = 的时候 再去获取 文本框的值  
        // 1、点击事件   onclick   function 函数
        // 2、获取 txt1,txt2,sel 的值
        // 3、进行计算
        // 4、把计算的结果 给 result 文本框

        btn.onclick = function(){
            // 点击 btn 的时候 要执行里面的代码

            // 2、获取 txt1,txt2,sel 的值
            var num1 = txt1.value - 0
            var num2 = txt2.value - 0
            var fuhao = sel.value
            var res

            // console.log(num1,num2,fuhao)
            // 3、进行计算  根据  fuhao 进行计算   
            // 判断 fuhao === "*"
            switch(fuhao){
                case '+':
                    res = num1 + num2
                    break
                case '-':
                    res = num1 - num2
                    break
                case '*':
                    res = num1 * num2
                    break
                case '/':
                    res = num1 / num2
                    break
            }
            // console.log(res)
            // 4、把计算的结果 给 result 文本框
            result.value = res.toFixed(2)
        }


    </script>
</body>
</html>