Js函数的三种定义方式

  • 函数的定义方式

    • 函数声明:必须有名字,会函数提升,在预解析阶段就已经创建,声明前后都可以调用

      //函数声明
      //定义函数名
      function fn(){
           console.log(123);
      }
      
    • 函数表达式:一种变量赋值,函表达式可以没有名字(匿名函数),没有函数提升。

      //将函数赋值给一个变量,可以是匿名函数
      var fn = function(){
          console.log(123);
      };
      

    由于函数声明提升,函数声明定义的函数,其函数名可以在函数声明之前调用,而函数表达式定义的函数不能,它进行的是一个变量赋值,本质会进行变量声明提升,如果写在前面的话,只是定义了一个变量,而没有赋值,其内部是undefined,无法执行函数,就会报错。

    • new Function

      函数本身也是一种对象,可以调用属性和方法

      //函数声明方式
      //有参数
      function fun(a,b){
          var a = 1;
          console.log(a+b);
      }
      function(2,3);
      
      //通过构造函数方法定义函数
      var fn = new Function('var a = "1";console.log(a)');
      fn();
      
      //添加参数
      var fn2 = new Function('a','b','var a = "1";console.log(a+b)');
      fn2(2,4);
      

      这种方式其实相当于new Function的括号里穿的是一堆字符串,解析慢,效率低,易出错。

      console.dir(fn2);//new Function()是函数也是一种对象,有自己的属性和方法
      

      new Function()是函数也是一种对象,有自己的属性和方法

  • 函数的调用和 this

    ①普通的函数调用是通过给函数名或者变量名添加()的方式执行。

    function fn(){ 
        console.log(1);
    };
    fn();
    
②构造函数,通过new关键字进行调用(也可以使用()调用,只是功能不全)

```JavaScript
function Student(name){
   this.name = name;
};
var s1 = new Student("li");
```



③对象中的方法,通过对象打点调用函数,然后加括号();

内部的 this 默认指向的是调用的对象自己

```JavaScript
var Student = {
   name:"lu",
   message: function(){
       console.log(this.name + " is a student");
   }
}
Student.message();
```



④事件函数,不需要加特殊符号,只要事件被触发,会自动执行函数;

内部的 this 默认指向的是事件源

```JavaScript
document.onclick = function(){
     console.log("hello");
}
```

⑤定时器、延时器中的函数,不需要加特殊符号,只要执行后,在规定的时间自动执行;

内部的 this 默认指向是window

```JavaScript
setInterval(function(){
   console.log(1);
},1000);
```

    this的指向是需要联系执行上下文,在调用的时候,是按照什么方式调用,指向是不一样的

调用方式 非严格模式 备注
普通函数调用 window 严格模式下是 undefined
构造函数调用 实例对象 原型方法中 this 也是实例对象
对象方法调用 该方法所属对象 紧挨着的对象
定时器函数 window
事件绑定方法 绑定事件对象
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容