箭头函数中的this

箭头函数中的this

箭头函数根据外层(函数或者全局)作用域来决定this

  • 这样this就像其他面向对象的语言,在哪里定义就指向哪里
function foo() {
    return (x) => {
        console.log(this);
    }
}

var obj1 = {
    x: 1
};

var obj2 = {
    x: 2
};

var bar = foo.call(obj1);

bar(); //=> { x: 1 }
bar.call(obj2); //=> { x: 1 } foo()的this绑定到obj1,箭头函数的绑定无法修改

编写程序时要么全部用箭头函数风格的this机制,要么用ES6以前的this风格,尽量不要混用

原文地址:https://www.cnblogs.com/wydumn/p/11816189.html

时间: 2024-08-30 07:29:54

箭头函数中的this的相关文章

深入理解ES6箭头函数中的this

简要介绍:箭头函数中的this,指向与一般function定义的函数不同,箭头函数this的定义:箭头函数中的this是在定义函数的时候绑定,而不是在执行函数的时候绑定. (1)一般函数this指向在执行是绑定  当运行obj.say()时候,this指向的是obj这个对象. var x=11; var obj={ x:22, say:function(){ console.log(this.x) } } obj.say(); //console.log输出的是22 (2)所谓的定义时候绑定,就

JavaScript箭头函数中的this详解

前言 箭头函数极大地简化了this的取值规则. 普通函数与箭头函数 普通函数指的是用function定义的函数: var hello = function () { console.log("Hello, Fundebug!"); } 箭头函数指的是用=>定义的函数: var hello = () => { console.log("Hello, Fundebug!"); } JavaScript箭头函数与普通函数不只是写法上的区别,它们还有一些微妙的不

箭头函数中 的this指向

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

箭头函数中的this指向

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

ES6箭头函数中的this绑定问题

关于this指向问题的讨论一直是学习js不可忽视的重要部分,那些一个又一个围绕this挖的笔试坑,仿佛永远也填不完 var obj={ fn:function(){ console.log(this); } } obj.fn();//object 以上这段代码是再浅显不过的this指向问题,也就是谁调用的函数,函数体中的this就指向谁 再看下面这段 var obj={ fn:function(){ setTimeout(function(){ console.log(this); }); }

区别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在定义时,

ECMAscript中的箭头函数

ECMAscript6中新增了一些新的内容,今天来谈谈其中的箭头函数: 箭头函数: 箭头函数相当于匿名函数,并且简化了函数定义. 格式: (参数)=>{函数体}; 相当于匿名函数: function(参数){函数体}; 箭头函数与匿名函数的区别就是this的指向不同: 1.箭头函数中this默认指向在定义它时,它所处的对象,而不是执行时的对象, 定义它的时候,可能环境是window: 2.普通函数中的this总是代表它的直接调用者, 例如 obj.func ,那么func中的this就是obj:

ES6中箭头函数与普通函数this的区别

普通函数中的this: 1. this总是代表它的直接调用者, 例如 obj.func ,那么func中的this就是obj 2.在默认情况(非严格模式下,未使用 'use strict'),没找到直接调用者,则this指的是 window 3.在严格模式下,没有直接调用者的函数中的this是 undefined 4.使用call,apply,bind(ES5新增)绑定的,this指的是 绑定的对象 箭头函数中的this 默认指向在定义它时,它所处的对象,而不是执行时的对象, 定义它的时候,可能

js中this,箭头函数和普通函数

四种基本用法 1. 一般方法中,this代指全局对象 window 2. 作为对象方法调用,this代指当前对象 3. 作为构造函数调用,this 指代new 出的对象 function test(){ this.x = 1; } var o = new test(); alert(o.x); //1 4. 调用方法的apply和call方法,可以改变函数的调用对象/作用域 (this)用法: f.apply([thisObj [,argArray] ]); f.call([thisObject