1. 程式人生 > >2018-9-27-js-函式

2018-9-27-js-函式

例如:有一個功能要判斷返回頂部按鈕是否顯示
js程式碼如下:
 var sTop = document.body.scrollTop;
    if(sTop>100){
        document.getElementById("sm_top").style.display="block";
    }else{
        document.getElementById("sm_top").style.display="none";
    }
但是發現document.body.scrollTop一直是0
這是DTD的問題
頁面指定了DTD,即指定了DOCTYPE時,使用document.documentElement
頁面沒有DTD,即沒有指定DOCTYPE時,使用document.body
IE和Firefox都是如此

本文來自 sleepwalker_1992 的CSDN 部落格 ,全文地址請點選:https://blog.csdn.net/sleepwalker_1992/article/details/80677845?utm_source=copy

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<div style="width: 10px; height: 1000px; border: solid 1px red;"></div>
<div style="width: 100px; height: 100px; background: pink; position: fixed; top: 200px;">
    <input type="button" id="sm_top" value="頂部按鈕">
</div>
</body>
</html>
<script>
    window.onscroll=function(){
        var sTop=document.documentElement.scrollTop;
        if(sTop>300){
            document.getElementById("sm_top").style.display="block";
        }else {
            document.getElementById("sm_top").style.display="none";
        }
    }
</script>

JavaScript函式
函式定義的方法
1.函式宣告
//函式宣告
function 函式名(引數1,引數2,引數3,...){
    //函式體
}
//呼叫函式
函式名(引數1,引數2,引數3,...);
這種方法呼叫函式,可以在宣告前呼叫,也可以在聲明後呼叫
例如:求n的階乘
<script>
    //函式宣告
    function factorial(n){
        var sum=1;
        for(var i=2;i<=n;i++){
            sum*=i;
        }
        alert(sum);
    }
    //呼叫函式
    factorial(5);
</script>

注意:在函式宣告前呼叫也是正確的,因為js解析器首先會把當前作用域的函式宣告提到整個作用域的最前面
<script>
    //呼叫函式
    factorial(5);
    //函式宣告
    function factorial(n){
        var sum=1;
        for(var i=2;i<=n;i++){
            sum*=i;
        }
        alert(sum);
    }
</script>

2.函式表示式
var 函式名=function(引數1,引數2,引數3,...){
    //函式體
};
//呼叫函式
函式名(引數1,引數2,引數3,...);
例如,求n的階乘
<script>
    //函式表示式
    var factorial=function(n){
        var sum=1;
        for(var i=2;i<=n;i++){
            sum*=i;
        }
        alert(sum);
    };
    //呼叫函式
    factorial(5);
</script>
注意:只有在函式表示式之後呼叫,否則會報錯

3.匿名函式
沒有命名的函式
作用:一般在繫結事件的時候
語法:
function(){}
自呼叫函式:
(function(){alert(11);})();
<script>
    (function(){
        var sum=1;
        for(var i=2;i<=5;i++){
            sum*=1;
        }
        alert(sum);
    })();
</script>
注意:匿名函式,自呼叫函式,只能呼叫一次

1.函式三要素
    a.函式的功能
    b.函式的引數
    c.函式的返回值
2.函式的引數
    a.形參--定義函式的時候,沒有實際的值,給實參佔位置
    b.實參--呼叫的時候,有實際的值
    c.函式呼叫的時候,形參的個數可以不和實參的個數相等
3.函式的返回值
    a.如果return後面跟內容了,則return後面的內容
    b.如果return後面沒有跟內容,則返回undefined
    c.如果函式內部沒有寫return,則返回undefined
    d.推薦的做法是要麼讓函式都始終返回一個值,要麼永遠不要返回值

JavaScript中的函式相對於其他語言的函式比較靈活特殊,在其他語言中實參的個數必須和形參的個數保持一致,但是在JavaScript中沒有函式簽名的概念,實參個數和形參個數可以不相等。

什麼是過載:
方法的簽名相同(函式的返回值,函式名稱,函式引數)其他語言(c++,java,c#)中有方法的過載,JavaScript中沒有方法的過載
function(a,b){
    return a+b;
}
function(a,b,c){
    return a+b+c;
}
var result=f1(5,6); //NaN
三個引數的f1把兩個引數的f1覆蓋,呼叫的是三個引數的f1
證明JavaScript中沒有過載