# js中函数的调用方式

119 阅读2分钟

JS中,我们有四种方式调用函数:

  • 作为一个函数直接被调用
  • 作为一个方法被调用
  • 作为一个构造函数,实例化一个新对象
  • 通过函数的apply或者call方法

1.直接调用

以这种方式调用时,函数上下文(this)有两种可能性:

非严格模式下,它是Windows对象

严格模式下,它是undefined

2.作为方法被调用

一个函数被赋值给一个对象的属性,并且通过对象属性引用的方式调用函数时,函数会作为对象的方法调用

此时,该对象会成为函数的上下文,并且函数内部可以通过参数访问到

3.作为构造函数调用

一般new调用函数会有以下步骤:

  • 创建一个空对象
  • 设置原型,将空对象的原型设置为函数的prototype对象
  • 让函数的this指向这个对象,执行构造函数的代码(该对象就是构造函数的上下文)
  • 判断函数的返回值类型,如果是值类型,则返回创建的这个对象,如果是引用类型,则返回这个引用类型的对象(构造函数内部有返回一个对象)

4.使用apply或者call

func.apply(object, [...])
​
func.call(object,arguments )

两种方法都可以指定任何对象作为函数的上下文

参数有两个,object是作为函数上下文的对象,另一个是函数调用的参数,apply需要一个数组,而call只需要以参数列表形式传递即可

5.解决函数上下文问题

如果函数的上下文与预期不符,除了使用call和apply,还有另外两个选择:箭头函数和bind方法

  • 箭头函数

    箭头函数没有自己的this,其this取决于函数被创建时的上下文,即包裹箭头函数的第一个普通函数的this

  • bind

    bind可以创建一个新的函数,其与原始函数的函数体相同,但是新函数被绑定到传入的对象上

    function.bind(thisArg, arg1, arg2, ...)
    

可以将返回的新的函数储存在一个变量中,需要时候调用

this有优先级:

new 绑定 > 显示绑定 > 隐式绑定 > 默认绑定

最后,放一个把this指向写的比较全的文章链接:

juejin.cn/post/700536…