JavaScript關于函數

今天是函數基礎部分!有點心理準備!
老規矩,先放思維導圖!
圖片哪里不懂,結合下面文字對應理解!

javascript05.jpg

認識函數

在一個完整的項目中,某些功能會被反復的使用到,那么,我們就將該功能封裝進一個函數,當要使用該功能時,直接調用函數即可。
注意:函數是對功能的封裝
優點
1.節省代碼,使程序結構簡單易懂,提高代碼的重復度(重復利用度)
2.如果修改某個功能,調試某個bug,只需要對應修改函數即可

函數概述

結構

    function 函數名(參數列表) {
        語句
        return 表達式;
    }

理解
1.function:函數的關鍵字,說明這是一個函數;
2.函數名:遵守標識符的規則;
3.()參數列表的開始和結束
4.參數列表:是函數從函數的調用者那里獲取的數據 可以沒有參數
5.{}:函數體的開始和結束;
6.語句:函數封裝的功能
7.return 表達式; :return是給函數的調用者返回的數據用,返回的數據為“表達式”的值,返回到調用函數的地方。
return 表達式; 可以不顯示的寫出來,如果沒有,我們默認返回undefined。
注意:函數聲明之后不會被執行,只是聲明了而一個有該功能的函數。
函數的調用
函數名(參數列表)
函數的調用,可以在函數的聲明之前
函數名:具有某種功能的函數的名字
參數列表:是調用者給函數的數據
小例子
編寫一個簡單的函數
簡單的函數:沒有參數,沒有返回值

        introduce();
        function introduce() {
            console.log("good");
        }

函數的調用可以在函數的聲明之前

函數的參數

參數可以有多個,多個參數之間用逗號分隔
函數調用的本質就是實參給形參賦值的過程(對應賦值)
小例子

        //此時str和age稱為形式參數(形參),本質是變量
        function myConsole(str, age) {
            console.log(str+"he is "+age);
        }

        //調用函數傳的參數稱為實際參數(實參),本質是值
        //函數調用的本質就是實參給形參賦值的過程(對應賦值)
        myConsole("fanfan is a good girl!", 18, "nice", "beautiful");

注意
函數接收參數沒有任何顧慮,可以接收任意多個

函數的返回值

return

        function mySum(num1, num2) {
            var sum = num1 + num2;
            // console.log(sum);//在功能函數中盡量避免打印
            return sum;//結束函數的
        }

        //接收了函數的返回值的值
        var ret = mySum(5, 6);

函數的作用域

注意:JS中變量的作用域不是以代碼塊來區分,而是以函數來區分
變量的作用域:變量能使用的范圍
全局變量
定義位置:所有函數以外定義的變量
作用域:那里都能用(這句話不嚴謹,有瑕疵)
局部變量
定義位置:函數內用var定義的變量
作用域:在定義的當前函數內可以使用

        var num = 10;
        function f(){
            num2 = 30;//定義變量,不用var定義的變量默認為全局變量
            //函數內部可以訪問全局變量
            console.log(num);
            num++;
            var num1 = 20;
            console.log(num1);
        }
        //調用
        f();
        console.log(num);
        //找不到名為num1的變量,此時這個num1是函數f中的局部變量
        //console.log(num1);
        //
        console.log(num2);

變量的提升

當程序進入一個新的函數時,會將該函數中所有的變量的聲明放在函數開始的位置。僅僅會提升變量的聲明,不會提升變量的賦值。

    var num = 10;
    function f(){
        console.log(num);//undefined// 聲明了變量,但是變量沒有被賦值,所以結果是undefined;
        //var num;
        //當局部變量與全局變量同名時,優先使用局部變量。
        var num = 20;//num=20
        console.log(num);//20
    }
    f();
    //函數外面使用的是全局變量的num;
    console.log(num);//10

函數也是一種數據

用變量保存函數,可以通過變量訪問函數(調用函數)

    function fun(){
        console.log("good");
    }
    //用變量保存函數,可以通過變量訪問函數(調用函數)
    var f = fun;
    //通過變量執行函數(訪問函數,調用函數)
    //變量名(參數列表);

    f();//此時f()與fun()相同
    fun();//

    //函數可以作為參數傳遞

匿名函數

匿名函數:沒有名字的函數
當匿名函數沒有賦值給另一個變量時有兩種優雅的用法

1、直接傳遞給函數
        var a = function (){
            console.log("sunck is a good man");
        };
        a();
2、執行某些一次性的代碼
       function m(mySum, q, w) {
            return mySum(q, w);
        }

        var ret = m(function(a, b){
            return a + b;
        }, 1, 2);
        console.log(ret);

即時函數

即時函數:當函數聲明之后立即執行
組成:()()
結構:(匿名函數)(給第一個小括號中的匿名函數傳遞的參數)
第二個小括號表明函數立即執行,并且給函數傳參

        (function(str){
            console.log(str);
        })("good girl");

函數有固有格式,一定要對應,基本的概念就是這樣了,網上有很多練習的習題。可以自己找找練習練習。我也給大家找一個典型的,用函數的思想好好練習一樣。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 第2章 基本語法 2.1 概述 基本句法和變量 語句 JavaScript程序的執行單位為行(line),也就是一...
    悟名先生閱讀 4,199評論 0 13
  • 函數和對象 1、函數 1.1 函數概述 函數對于任何一門語言來說都是核心的概念。通過函數可以封裝任意多條語句,而且...
    道無虛閱讀 4,663評論 0 5
  • Lua 5.1 參考手冊 by Roberto Ierusalimschy, Luiz Henrique de F...
    蘇黎九歌閱讀 13,906評論 0 38
  • 寫了為什么不見了?
    光能量閱讀 126評論 0 1
  • 1. 悠悠每天大呼小叫的說自己失戀了,其實悠悠根本沒有男朋友。 悠悠前些天在朋友的微信群里認識了一個男生,兩個人很...
    養生棠舍閱讀 359評論 0 0