烟台Java培训
达内烟台中心

18300268127

热门课程

JavaScript中this的显式绑定

  • 时间:2016-10-12
  • 发布:烟台Java培训
  • 来源:烟台java培训

“this”这个学过编程的都知道,它可以说是 javascript 中最耐人寻味的一个特性,就像高中英语里各种时态,比如被动时态,过去时,现在时,过去进行时一样,无论弄错过多少次,下一次依然可能弄错。烟台java培训小编在这里跟大家探讨一下JavaScript中this显式绑定模式。

烟台java培训

显式绑定,顾名思义,显示地将this绑定到一个上下文,javascript中,提供了三种显式绑定的方法,apply,call,bind。apply和call的用法基本相似,它们之间的区别是:

           apply(obj,[arg1,arg2,arg3,...] 被调用函数的参数以数组的形式给出

call(obj,arg1,arg2,arg3,...) 被调用函数的参数依次给出

而bind函数执行后,返回的是一个新函数。下面以代码说明。

// 不带参数

function speak() {

    console.log(this.name)

}

var name = "global"

var obj1 = {

    name: 'obj1'

}

var obj2 = {

    name: 'obj2'

}

speak() // global 等价于speak.call(window)

speak.call(window)

speak.call(obj1) // obj1

speak.call(obj2) // obj2

因此可以看出,apply, call 的作用就是给函数绑定一个执行上下文,且是显式绑定的。因此,函数内的this自然而然的绑定在了call 或者 apply 所调用的对象上面。

// 带参数

function count(num1, num2) {

    console.log(this.a * num1 + num2)

}

var obj1 = {

    a: 2

}

var obj2 = {

    a: 3

}

count.call(obj1, 1, 2) // 4

count.apply(obj1, [1, 2]) // 4

count.call(obj2, 1, 2) // 5

count.apply(obj2, [1, 2]) // 5

上面这个例子则说明了 apply 和 call 用法上的差异。

而 bind 函数,则返回一个绑定了指定的执行上下文的新函数。还是以上面这段代码为例

// 带参数

function count(num1, num2) {

    console.log(this.a * num1 + num2)

}

var obj1 = {

    a: 2

}

var bound1 = count.bind(obj1) // 未指定参数

bound1(1, 2) // 4

var bound2 = count.bind(obj1, 1) // 指定了一个参数

bound2(2) // 4 

var bound3 = count.bind(obj1, 1, 2) // 指定了两个参数

bound3() //4

var bound4 = count.bind(obj1, 1, 2, 3) // 指定了多余的参数,多余的参数会被忽略

bound4() // 4

所以,bind 方法只是返回了一个新的函数,这个函数内的this指定了执行上下文,而返回这个新函数可以接受参数。

如果你还有什么疑问,就来烟台Java培训班咨询吧。

上一篇:JavaScript中this的隐式绑定模式
下一篇:JavaScript中this的new绑定

java初中级从业者应该懂这12条

Java笔试题解答,帮你应聘上满意公司!

Java笔试题解答,帮你应聘上满意公司(三)

Java笔试题解答,帮你应聘上满意公司(二)

选择城市和中心
贵州省

广西省

海南省

达内教育

有位老师想和您聊一聊