js中的this

  • 普通函数:this指向最后调用函数的对象
function f() {
    return this
}

var obj = {
    f() {
        return this
    },
    a: {
        b() {
            return this
        }
    },
    d() {
        return function () { return this }
    },
    e() {
        return () => this       //箭头函数,使用封闭词法环境作用域
    }
}

f() == window           //true
obj.f() == obj          //true
var f1 = obj.f
f1() == window          //true
obj.a.b() == obj.a      //true
var f2 = obj.a
f2.b() == f2            //true
var f3 = obj.a.b
f3() == window          //true
obj.d()() == window     //true
obj.e()() == obj        //true
var x = obj.e
x()() == window         //true
var x = obj.e()
x() == obj              //true
  • Function.prototype.call/apply: 绑定this到第一个参数
  • Function.prototype.bind: 绑定this到第一个参数
function f() {
    return this
}
var g = f.bind(f)
g() === f           //true
g.bind({})() === f  //true, bind只生效一次
  • 箭头函数: 与封闭词法环境的this保持一致
    • 箭头函数,call,bind,apply失效
//箭头函数:全局作用域
var f = () => this
var f1 = function () { return this }
f.call({}) == window        //true
f.bind({})() == window      //true
f1.call({}) == window       //false


//箭头函数:函数作用域
var obj = {
    f() {
        return () => this
    }
}
obj.f()() === obj       //true
  • 原型链中的this
var o = {
    f() {
        return this
    }
}

var p = Object.create(o)
p.f() == p              //true
  • 构造函数
    • this指向构造的对象
    • 可手动返回其他对象(null除外)
//构造函数
function F() {
    this.a = 1
}
new F()     //F {a: 1}

function F() {
    this.a = 1
    return {}
}
new F()     //{}

function F() {
    this.a = 1
    return null
}
new F()     //F {a: 1}
发布了35 篇原创文章 · 获赞 0 · 访问量 290
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 游动-白 设计师: 上身试试

分享到微信朋友圈

×

扫一扫,手机浏览