js函数条件

作者: f6d8ee519880 | 来源:发表于2018-11-04 18:30 被阅读0次

js函数条件
前端(运算符)
JS、Python对比学习
【JS】高阶函数与函数柯里化
《菜鸟教程》-函数
《TypeScript》 - 函数
JavaScript 05 函数
js中的高阶函数
js 深入
2018-12-01

函数定义与执行

<script type="text/javascript">
    // 函数定义
    function aa(){
        alert('hello!');
    }
    // 函数执行
    aa();
</script>

变量与函数预解析

<script type="text/javascript">    
    aa();       // 弹出 hello！
    alert(bb);  // 弹出 undefined
    function aa(){
        alert('hello!');
    }
    var bb = 123;
</script>

提取行间事件

<!--行间事件调用函数   -->
<script type="text/javascript">        
    function myalert(){
        alert('ok!');
    }
</script>
......
<input type="button" name="" value="弹出" onclick="myalert()">

<!-- 提取行间事件 -->
<script type="text/javascript">

window.onload = function(){
    var oBtn = document.getElementById('btn1');
    oBtn.onclick = myalert;
    function myalert(){
        alert('ok!');
    }
}    
</script>
......
<input type="button" name="" value="弹出" id="btn1">

匿名函数

<script type="text/javascript">

window.onload = function(){
    var oBtn = document.getElementById('btn1');
    /*
    oBtn.onclick = myalert;
    function myalert(){
        alert('ok!');
    }
    */
    // 直接将匿名函数赋值给绑定的事件

    oBtn.onclick = function (){
        alert('ok!');
    }
}

</script>

函数传参

<script type="text/javascript">
    function myalert(a){
        alert(a);
    }
    myalert(12345);
</script>

作业

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>if练习1</title>
        <script type="text/javascript">
            var score = prompt("请输入小明的期末成绩(0-100):");
            if(score > 100 || score < 0 || isNaN(score)){
                alert("拉出去毙了~~~");
            }else{
                if(score == 100){
                    alert("宝马，拿去开~~~");
                }else if(score >= 80){
                    alert("手机，拿去玩~~~");
                }else if(score >= 60){
                    alert("参考书，拿去看~~~");
                }else{
                    alert("棍子一根~~");
                }
            }
        </script>
    </head>
    <body>
        
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>if练习2</title>
        <script type="text/javascript">
            var height = prompt("请输入你的身高(CM):");
            var money = prompt("请输入你的财富(万):");
            var face = prompt("请输入你的颜值(PX):");
            if(height > 180 && money > 1000 && face > 500){
                alert("我一定要嫁给他~~");
            }else if(height > 180 || money > 1000 || face > 500){
                alert("嫁吧，比上不足，比下有余。");
            }else{
                alert("不嫁。");
            }
        </script>
    </head>
    <body>
        
    </body>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>if练习3</title>
        <script type="text/javascript">
            var num1 = +prompt("请输入第一个数:");
            var num2 = +prompt("请输入第二个数:");
            var num3 = +prompt("请输入第三个数:");

            alert(typeof num1);
            
            //找到三个数中最小的数
            if(num1 < num2 && num1 < num3){
                //num1最小，比较num2和num3
                if(num2 < num3){
                    //num1 num2 num3
                    alert(num1 +","+num2 + ","+num3);
                }else{
                    //num1 num3 num2
                    alert(num1 +","+num3 + ","+num2);
                }
                
            }else if(num2 < num1 && num2 < num3){
                //num2最小，比较num1和num3
                if(num1 < num3){
                    //num2 num1 num3
                    alert(num2 +","+num1 + ","+num3);
                }else{
                    //num2 num3 num1
                    alert(num2 +","+num3 + ","+num1);
                }
                
            }else{
                //num3最小,比较num1和num2
                if(num1 < num2){
                    // num3 num1 num2
                    alert(num3 +","+num1 + ","+num2);
                }else{
                    //num3 num2 num1
                    alert(num3 +","+num2 + ","+num1);
                }
                
            }
        </script>
    </head>
    <body>
        
    </body>
</html>