关于箭头函数里this的指向

es6箭头函数里this的指向和普通的this还是有区别的,它是创建的时候就确定的,

其实我发现箭头函数的指向就是同级下的console.log(this)里的this,这样的话就能比较简单的理解多层嵌套情况下箭头函数里this的指向问题了

var f1 = {
        f2: {
            f3: {
                f6: console.log(this),//window
                f4: () => console.log(this)
            }
        }
    };
    f1.f2.f3.f6;//window

相当于,在f4同级下放一个console.log(this)不就是箭头函数里this的指向

再加一个代码

var test = () => {
    console.log(this.a);
}
//形式上等价于
var test = function(){
    console.log(this.a);
}
//实质上等价于
function fn(){
    var that = this;
    var test = function(){
        console.log(that.a);
    }
}

这个里面test相当于箭头函数,那么它里面的this就是和它同级的this,既console.log(this)里的this了

原文地址:https://www.cnblogs.com/WildSky/p/11246693.html

时间: 2024-07-31 03:11:48

关于箭头函数里this的指向的相关文章

进阶路上有你我-相互相持篇之ES6里箭头函数里的this指向问题

首先复习下普通函数里的this指向: 1 function test(){ 2 console.log(this) 3 } 4 test() 你会秒杀的毫无疑问的回答:window,针对普通函数:谁调用了函数  函数里的this就指向谁,test()等价于window.test(),所以是window 1 var name="outername" 2 var o={ 3 name:"innername", 4 getname:function(){ 5 consol

箭头函数里this理解

先来看代码: var obj1={ id:4, fn:function(){ var f=() => { console.log(this); //object,f()定义在obj1对象中,this就指向obj1,这就是箭头函数this指向的关键 setTimeout(function() { console.log(this);//window,非箭头函数的情况下还是要看宿主对象是谁,如果没有被对象调用,函数体中的this就绑定的window上 }); } f(); } } obj1.fn()

箭头函数中的this指向

最近做的项目中遇到了在箭头函数里使用this时报错的问题,把箭头函数的写法改成function()后,this的指向才达到预期.关于这个问题值得研究一下. 在箭头函数出现之前的ES5时代,this指向它的调用者.是哪个对象调用了这个属性或方法,this就指向这个对象.这有点像"我"这个人称代词,是从谁的嘴里说出了"我",这个"我"就指代了谁. 一个简单的例子: // 用var定义的变量,this指向window // 调用sayName()等于调

箭头函数中 的this指向

在javscript中,this 是在函数运行时自动生成的一个内部指针,它指向函数的调用者. 箭头函数有些不同,它的this是继承而来, 默认指向在定义它时所处的对象(宿主对象),而不是执行时的对象. var name = "window"; var test = { name:"demo", // 传统函数 getName1: function(){ console.log(this.name); // demo var that = this; setTimeo

区别ES3ES5和ES6this的指向问题。区分普通函数和箭头函数中this的指向问题

ES3 ES5this的指向问题 this指的是该函数被调用的对象 var foo = function () { this.a = 'a', this.b = 'b', this.c = { a: 'new a', b: function () { //new a 此时this指的是该函数被调用的对象 return this.a; } } } console.log(new foo().c.b()); //new a ES6的箭头函数 箭头函数的this指的是定义时this的指向,b在定义时,

2、Es常用语法 箭头函数、类

1.箭头函数 什么是箭头函数 箭头函数的语法非常简单,看一下最简单的箭头函数表示法 () => console.log('Hello') () => {console.log('Hello')} 等同于 function(){ console.log('hello') } 箭头函数里的this: 箭头函数里的this指向定义时的作用域 普通函数里的this指向调用者的作用域 箭头函数不绑定arguments let arrowfunc = () => console.log(argume

ES6 箭头函数this指向

箭头函数有几个使用注意点. (1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. (2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误. (3)不可以使用arguments对象,该对象在函数体内不存在.如果要用,可以用Rest参数代替. (4)不可以使用yield命令,因此箭头函数不能用作Generator函数. 上面四点中,第一点尤其值得注意.this对象的指向是可变的,但是在箭头函数中,它是固定的. function foo() { setTi

es6箭头函数 this 指向问题

es5中 this 的指向 var factory = function(){ this.a = 'a'; this.b = 'b'; this.c = { a:'a+', b:function(){return this.a} } }; console.log(new factory().c.b()); // a+ 通过es5的语法调用,返回的是 a+ ,this 的指向是该函数被调用的对象,也就是说函数被调用的时候,这个 this 指向的是谁,哪个对象调用的这个函数,这个 this 就是谁.

关于es6的箭头函数使用与内部this指向

特型介绍:箭头函数是ES6新增的特性之一,它为JS这门语言提供了一种全新的书写函数的语法. 'use strcit'; let arr = [1,2,3]; //ES5 let es5 = arr.map(function(n){ return n*2; }); //ES6 let es6 = arr.map(n => n*2); console.log(es5); //[2,4,6] console.log(es6); //[2,4,6] 箭头函数简化了原先的函数语法,不需要再写 functi