JS申明函数的方法和函数中this的指向

最近在学js,了解到js函数的重要性,因此做一个总结。

1.js函数申明方式

1.直接申明

function fn(){
  console.log(1)
}
fn()

2.定义变量来申明

var fn = function(){
  console.log(1)
}
fn()

注意:上面两种申明的差异,js在执行时,会先把所有申明变量和函数提前,上面第二种方式来申明的函数,只是变量提前,函数申明没有提前。

3.构造函数申明

var fn = new Function()
fn()

1.js函数调用方式和内部this的指向

1.普通调用

function fn(){
  console.log(1)
}
fn()

此处this指向window对象

2.方法调用

var obj={
    fn:function(){
        console.log(1);
    }
}
obj.fn()

此处this指向obj对象

3.作为构造函数调用

var fn = new Function()
fn()

此处this指向构造函数创建的对象

4.作为时间调用

假设有一个按钮点击事件

btn.onclick=function(){
  console.log(this)
}

此处this指向触发该事件的对象

5.作为定时器调用

setTimeout(function(){
  console.log(this)
},1000)

此处this指向window对象,因为是window在调用这个函数

总结:函数this指向的特点

函数内部this由函数调用时来确定。

下面有两道比较经典的例题供参考:

1.

function fn(){
    console.log(this)
}
var obj={
    fn:fn
}
obj.fn()

此题this指向的是obj对象,因为是obj在调用这个函数

2.

var obj={
    fn:function fn(){
        console.log(this)
    }
}
var fn = obj.fn(;
fn()

此处this指向window对象

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。