zoukankan      html  css  js  c++  java
  • this指向 一般函数与箭头函数

    es6对象内函数一般有两种写法:

    var person1 = {
        name: "p1",
        sayThis() {
            console.log(this);
        }
    };
    
    var person2 = {
        name: "p2",
        sayThis:()=> {
            console.log(this);
        }
    };
    
    person1.sayThis()
    person2.sayThis()

    输出:

    person1的写法,类似于:

    var person1 = {
        name: "p1",
        sayThis: function() {
            console.log(this);
        }
    };

    this指向当前调用此方法的对象

    person2的写法,使用了箭头函数,箭头函数的this指向当前的执行环境(创建它时所处的上下文)(箭头函数可以捕获其所在上下文的this值),这里当然是window对象,箭头函数并没有自己的this值,它的this继承自外围作用域

    function Person() {  
        this.age = 0;  
        setInterval(() => {
            // 回调里面的 `this` 变量就指向了期望的那个对象了
            this.age++;
        }, 3000);
    }
    
    var p = new Person();

    备注:call,apply,bind对es6中的this,无效

    var objProject = this;
    var foo = (() => this);
    console.log(foo());  // window
    console.log(objProject);  // window
    console.log(foo() === objProject ); // true
    // 作为对象的一个方法调用
    var obj = {foo: foo};
    console.log(obj.foo() === objProject ); // true
    // 尝试使用call来设定this
    console.log(foo.call(obj) === objProject ); // true
    // 尝试使用bind来设定this
    foo = foo.bind(obj);
    console.log(foo() === objProject ); // true
  • 相关阅读:
    汇编语言 标志位介绍
    PHP中的二进制位运算和权限存储
    iframe 父窗口和子窗口相互的调用方法集锦
    document.compatMode
    $.browser.msie
    seo外链的真正做法
    APP常用控件学习理解
    家庭记账本APP开发准备(一)
    Android常用布局和控件
    安卓APP开发的初步了解
  • 原文地址:https://www.cnblogs.com/yanze/p/7645347.html
Copyright © 2011-2022 走看看