JS系列 - this

Posted vs1435

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS系列 - this相关的知识,希望对你有一定的参考价值。

this的绑定方式:

  • 默认绑定(非严格模式下this指向全局对象, 严格模式下this会绑定到undefined)

  • 隐式绑定,this 永远指向最后调用它的那个对象(如 obj.foo()的调用方式, foo内的this指向obj)

  • 显示绑定(apply、call、bind)

  • new绑定

  • 箭头函数绑定(this的指向由外层作用域决定的)

一些特殊例子:

1. let 或者 const,变量是不会被绑定到window上的;var 会

let a = 10 ;const b = 20;

function foo () { console.log(this.a);console.log(this.b) }

foo(); console.log(window.a)

答案:undefined  undefined  undefined

 
 

2.把一个函数当成参数传递到另一个函数的时候,也会发生隐式丢失的问题,与包裹着它的函数的this指向无关。在非严格模式下,this绑定到window上,严格模式undefined

var a = 2

function foo () { console.log(this.a) }

function doFoo (fn) {

// obj2.doFoo 调用该函数,this指向obj2,但是之后调用fn(就是foo)函数,this 指向的是 window

 

console.log(this)

fn()

}

var obj = { a: 1, foo }

var obj2 = { a: 3, doFoo }

obj2.doFoo(obj.foo) // 结果:{ a:3, doFoo: f } 和 2

 

3.匿名函数,它里面的this在非严格模式下始终指向的都是window

var a = 3

var obj2 = {

a: 2,

foo1: function () {console.log(this.a)},

foo2: function () {

setTimeout(function () {

console.log(this) console.log(this.a)

}, 0)

}

}

obj2.foo1(); obj2.foo2() // 结果:2 window 3

 
 
 
 
 

以上是关于JS系列 - this的主要内容,如果未能解决你的问题,请参考以下文章

sublime text 3 添加代码片段

JS基础系列-聊聊this

HLS.js 获取视频片段信息

很实用的JQuery代码片段(转)

laravel特殊功能代码片段集合

vue2.0 代码功能片段