美文网首页
js中this的指向

js中this的指向

作者: 一半春夏一半秋冬 | 来源:发表于2019-12-13 10:09 被阅读0次

一、作为函数调用,this指向全局对象

  var q = 'window'
var func = function {
    console.log(this.q)
}

func()   //window

二、作为对象的调用方法,this指向该对象

var q = 'window'
var func = function() {
    console.log(this.q)
}

var obj = {
    q: 'obj',
    func: func,
    anotherObj: {
        q: 'anotherObj',
        func: func
    }
}

obj.func()   //obj
obj.anotherObj.func() //anotherObj

三、作为构造函数调用,构造函数试图初始化这个新创建的对象,并将这个对象作为其调用上下文,this 指向这个新创建的对象。

var q = 'window'

function Func() {
    this.q = 'Func'
    console.log(this.q)
}

var obj = new Func  //Func

console.log(this.q)  //window

四、通过函数的call/apply方法间接调用, call/apply方法的第一个参数是调用上下文,在函数体内,通过this获得对它的引用。

var q = 'window'

function func() {
 console.log(this.q)
}

var obj = {
 q: 'obj'
}

func.apply()  //window
func.call() //window

func.apply(obj) //obj
func.call(obj) //obj

五、箭头函数中this对象就是定义时所在的作用域,也就是说箭头函数本身没有this,内部的this就是外层代码块作用域中的this。
1)、独立函数

var a = 0
var test = ()=> {
    var a = 1
    console.log(this.a)
}

test()  //0

2)、对象的方法

var a = 0
var obj = {
    a: 1,
    foo: ()=> {
        console.log(this.a)
    }
}

obj.foo()  //0

即:
var a = 0
var obj = new Object
obj.a = 1
obj.foo = ()=> {
    console.log(this.a)
}
obj.foo()

3)、当函数作为对象的方法调用时this指向该对象

var a = 0
function foo(){
    var func = () => {
        console.log(this.a)
    }
    return func
}
var obj = {
    a : 1,
    foo:foo
}
obj.foo()()  //1

4)、bind/call改变this指向

func定义在全局,因此打印0,同对象方法
var a = 0

var func = ()=> {
    console.log(this.a)
}

var obj = {
    a: 1
}

func.call(obj)  //0
var a = 0

var func = function() {
    var boo = ()=> {
        console.log(this.a)
    }
    return boo
}

var obj = {
    a: 1
}

func.call(obj)() //1

相关文章

  • JS进阶篇-this指向问题

    JS中this的指向问题不同于其他语言,JS中的this不是指向定义它的位置,而是在哪里调用它就指向哪里。 JS中...

  • JS中this指向

    一、全局作用域中的thises5与es6中严格模式与非严格模式全局函数的this都指向window 二、全局作用域...

  • JS中this指向

    函数有4种调用方式,对应就有4种绑定规则:默认绑定、隐式绑定、硬绑定和构造函数绑定。 1、默认绑定 当作为普通函数...

  • js中this指向

    1.this总是指向函数的直接调用者2.如果有new关键字,this指向new出来的那个对象3.DOM事件中thi...

  • JS中this指向

    (1)事件调用环境:谁触发事件,函数里面的this指向就是谁(某个DOM)。 (2)node全局环境:this指向...

  • js中this指向

    当我们需要把函数当做另外函数参数传入时,我们使用箭头函数。 关于this的指向。 问题:箭头函数中的this是如何...

  • JS中this的指向

    什么是this? 它是函数运行时,在函数体内部自动生成的一个对象,只能在函数体内部使用。 JS中this的指向,取...

  • JS中this的指向

    JS中this的指向 1.背景介绍 2.知识剖析 3.常见问题 4.解决方案 5.编码实战 6.扩展思考 7.参考...

  • JS中this的指向

    1、普通函数中this的指向( 普通函数中的this指针指向于调用者) 2、定时器中的this的指向 3、在对象...

  • JS中THIS的指向?

    大家好,我是IT修真院北京分院第22期的学员杨纲,一枚正直纯洁善良的WEB前端程序员。 1.背景介绍 this对象...

网友评论

      本文标题:js中this的指向

      本文链接:https://www.haomeiwen.com/subject/zztfnctx.html