JS-函数的定义与调用方式及其this的指向

411 阅读2分钟

一.函数的定义方式

1.函数声明方式function关键字(命名函数)

2.函数表达式(匿名函数)

3.new Function()

var fn=new Function('参数1','参数2',...,'函数体')
  • Function里面的函数都必须是字符串格式
  • 第三种方式执行效率低也不方便书写,因此较少使用
  • 所有函数都是Function的实例(对象)
  • 函数也属于对象

函数的定义方式.png

三种函数定义方式的代码

        // 函数的定义方式
        // 1.自定义函数(命名函数)
        function fn() { };
        // 2.函数的表达式(匿名函数)
        var fun = function () { }
        // 3.利用new Function('参数1','参数2','函数体');
        var f = new Function('a', 'b', 'console.log(a+b)');
        f(1, 2);
        // 4.所有函数都是Function的实例(对象)
        console.dir(f);
        console.log(f instanceof Object);       //true

二.函数的调用方式

1.普通函数

        function fn(){
            console.log('人生的巅峰');
        }
        fn();
        fn().call()

2.对象的方法

        var o={
            sayHi:function(){
                console.log('人生的巅峰');
            }
        }
        o.sayHi();

3.构造函数

function Star(){}
        new Star();

4.绑定事件函数

btn.onclick=function(){};   //点击了按钮就可以调用这个函数

5.定时器函数

setInterval(function(){},1000);   //1s后自动调用

6.立即执行函数

(function(){
            console.log('人生的巅峰');
        })();

三.函数内的this指向

1.普通函数调用 this指向是window

        function fn(){
            console.log('普通函数的this'+this);
        }
        fn();

2.对象方法调用 this指向该方法所属对象

        var o={
            sayHi:function(){
                console.log('对象的this'+this);
            }
        }
        o.sayHi();

3.构造函数调用 this指向实例对象原型对象里面的方法也指向实例对象

        function Star(){}
        Star.prototype.sing=function(){

        }
        var ldh=new Star();

4.绑定事件函数调用 this指向绑定事件对象

        var btn=document.querySelector('button');
        btn.onclick=function(){
            console.log('绑定时间函数的this'+this);
        };   //点击了按钮就可以调用这个函数

5.定时器函数调用 this指向window

         setInterval(function(){
            console.log('定时器的this'+this);
        },1000);   //1s后自动调用

6.立即执行函数调用 this指向window

        (function(){
            console.log('人生的巅峰');
        })();