前言

這篇文章開始我們函數(shù)的進(jìn)階篇，和我們JavaScript基礎(chǔ)學(xué)的函數(shù)有了很多拓展，這篇文章首先我們從函數(shù)的定義，調(diào)用，及其 this指向 來(lái)一個(gè)總結(jié)。 

一：函數(shù)的定義 

函數(shù)的定義共三種方式：1.命名函數(shù)，2.匿名函數(shù)，3.利用 new Function() 來(lái)創(chuàng)建。

1.1 命名函數(shù) 

命名函數(shù)就是我們最常見的聲明函數(shù)的方式，也叫做自定義函數(shù)

    <script>
        function fn(){
            console.log('我是命名函數(shù)');
        }
        fn()
    </script>

1.2 匿名函數(shù) 

匿名函數(shù)即沒(méi)有名字的函數(shù)，匿名函數(shù)的調(diào)用需要使用立即執(zhí)行函數(shù)，綁定事件時(shí)使用的也是匿名函數(shù)

    <script>
    //立即執(zhí)行函數(shù)來(lái)調(diào)用匿名函數(shù)
       (function(a,b){     
           console.log(a+b);
       })(1,2)
 
    //綁定事件來(lái)使用匿名函數(shù)
       var div1=document.querySelector('div')
       div1.addEventListener('click',function(){
         console.log('我是綁定事件使用的匿名函數(shù)');
       })
    </script>

1.3 利用 new Function() 聲明函數(shù)

還有一種不常見的函數(shù)聲明方法是 new Function()，這個(gè)辦法我們知道是個(gè)構(gòu)造函數(shù)。但是由于這種方式比較繁瑣麻煩，并且如果執(zhí)行函數(shù)還需要轉(zhuǎn)化語(yǔ)言格式為可識(shí)別的腳本語(yǔ)言，因此不使用這種方式聲明函數(shù)，只需要知道 所有的函數(shù)都是Function構(gòu)造函數(shù)的實(shí)例化對(duì)象（后面結(jié)論會(huì)說(shuō)）

參數(shù)格式為：

new Function(‘參數(shù)一’，‘參數(shù)二’，‘參數(shù)三’，...... ，‘函數(shù)體)

（注意參數(shù)全部為字符串形式）

    <script>
         var fn=new Function('a','b','console.log(a+b)')
         fn(2,3)
    </script>

1.4 重要結(jié)論

通過(guò)剛才的第三種函數(shù)的聲明方法，是個(gè)構(gòu)造函數(shù)，我們會(huì)想到什么，為什么函數(shù)也有構(gòu)造函數(shù)，難道函數(shù)也是對(duì)象嗎？是的那我們接下來(lái)驗(yàn)證一下

    <script>
         var fn=new Function('a','b','console.log(a+b)')
         fn(1,3)
         console.dir(fn instanceof Object)
    </script>

結(jié)論：

      對(duì)此我們知道了函數(shù)也是對(duì)象就可以得到以下關(guān)系

函數(shù)屬于對(duì)象所有的函數(shù)都是Function構(gòu)造函數(shù)的實(shí)例化對(duì)象

 二：函數(shù)的調(diào)用

函數(shù)的調(diào)用分為以下六種情況：

• 普通函數(shù)調(diào)用
• 立即執(zhí)行函數(shù)調(diào)用
• 對(duì)象內(nèi)方法調(diào)用
• 構(gòu)造函數(shù)調(diào)用
• 事件函數(shù)調(diào)用
• 定時(shí)器函數(shù)調(diào)用

2.1 普通函數(shù)調(diào)用

普通函數(shù)調(diào)用可以直接寫函數(shù)名調(diào)用，也可以使用 call() 方法調(diào)用

    <script>
        function fn(){
            console.log('我是一個(gè)普通函數(shù)的調(diào)用');
        }
        fn()
        fn.call()
    </script>

2.2 立即執(zhí)行函數(shù)調(diào)用

立即執(zhí)行函數(shù)通常用于匿名函數(shù)的調(diào)用，立即執(zhí)行函數(shù)是自動(dòng)調(diào)用的

    <script>
        (function(){
            console.log('立即執(zhí)行函數(shù)調(diào)用了');
        })()
    </script>

2.3 對(duì)象內(nèi)方法調(diào)用

對(duì)象內(nèi)方法調(diào)用只需要  ：實(shí)例化對(duì)象名稱.方法名稱

    <script>
        var obj={
            fn:function(){
                console.log('對(duì)象內(nèi)的方法調(diào)用了');
            }
        }
        obj.fn()
    </script>

2.4 構(gòu)造函數(shù)調(diào)用

構(gòu)造函數(shù)的調(diào)用只需要 new實(shí)例化對(duì)象就可調(diào)用

    <script>
        function Animal(){}
        new Animal()
    </script>

2.5 事件函數(shù)的調(diào)用

事件對(duì)象調(diào)用需要觸發(fā)事件就可以調(diào)用

    <script>
       var div1=document.querySelector('div')
       div1.addEventListener('click',function(){
         console.log('事件對(duì)象調(diào)用了');
       })
    </script>

2.6 定時(shí)器函數(shù)的調(diào)用

定時(shí)器內(nèi)的函數(shù)為時(shí)間到后自動(dòng)調(diào)用

    <script>
      window.setInterval(function(){
        console.log('定時(shí)器函數(shù)觸發(fā)了');
      },1000)
    </script>

 三：各類函數(shù)的內(nèi)部this指向問(wèn)題

函數(shù)內(nèi)部的 this 指向誰(shuí)，是由我們調(diào)用時(shí)才知道的，一般情況是指向函數(shù)的調(diào)用者，下面是上一板塊出現(xiàn)的幾類函數(shù)的this指向

總結(jié)

到此這篇關(guān)于JavaScript進(jìn)階教程之函數(shù)的定義、調(diào)用及this指向問(wèn)題詳解的文章就介紹到這了,更多相關(guān)js函數(shù)定義調(diào)用及this指向內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論