es6箭头函数以及this的指向问题

梦里梦外; 2022-05-16 01:25 230阅读 0赞

### es3，es5中的构造函数与es6中的箭头函数区别： ###

es3 es5中的函数的写法：

function ()\{

\}

es6中的箭头函数的写法：

()=>\{

\}

注意：如果参数只有一个，并且函数体内直接将参数作为返回值，则可以省略()和\{\}。

{
        var array = [1,2,3,4,5];
        var adds = array.map(function (v) {
          return v+1;
        });
        console.log(array,adds);
    }
    {
        let arr = [1, 2, 3, 4, 5];
        let odd = arr.map((v) => {
            return v + 1;
        });
        console.log(arr, odd);
    }

### es3 es5以及es6中的this的指向问题： ###

在es3和es5中的this的指向问题，this指向的是该函数被调用时的对象，在下面的代码中，c对象调用了b()，所以this指向的就是c对象， 所以最后输出的就是”a+“。

{
        var factory = function () {
            this.a = 'a';
            this.b = 'b';
            this.c =  {
                a: "a+",
                b: function f() {
                  return this.a;
                }
            }
        };
        console.log(new factory().c.b());
    }

es6中的this的指向问题，this的指向是定义时this的指向 ，定义时this的指向是构造函数的实例，即new factory()。 new factory()的实例是上面的a 。

{
        let factory = function () {
            this.a = 'a';
            this.b = 'b';
            this.c =  {
                a: "a+",
                b: () => {
                    return this.a;
                }
            }
        };
        console.log(new factory().c.b());
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，230人围观）

还没有评论，来说两句吧...

相关阅读

相关 ECMAScript6-ES6箭头函数：箭头函数语法、箭头函数里的this指向

ES6标准新增了一种新的函数：Arrow Function（箭头函数）。一、通常函数的定义方法 var fn1 = function(a, b) {

谁践踏了优雅/ 2023年10月05日 19:05/ 0 赞/ 32 阅读

相关 ES6的箭头函数用法以及出现的this问题

箭头函数 ES6的箭头函数极大的减缓了函数的语法 var fn=()=>\{\} 相当于下面函数 var fn=function ()\{\} 箭头函数如果没有

桃扇骨/ 2023年07月24日 09:29/ 0 赞/ 3 阅读

相关 JavaScript ES6语法之箭头函数及其this指向问题

箭头函数所谓的箭头函数是函数的另一种语法形式。语法规则 const fun = function(){} 普通函数 const fun

墨蓝/ 2023年07月24日 08:12/ 0 赞/ 6 阅读

相关 ES6中箭头函数（=＞)的this

一，了解前须知 1，箭头函数：出现的作用除了让函数的书写变得很简洁，可读性很好外；最大的优点是解决了this执行环境所造成的一些问题。比如：解决了匿名函数this指向的问题（

末蓝、/ 2022年12月17日 14:57/ 0 赞/ 208 阅读

相关 es6箭头函数以及this的指向问题

es3，es5中的构造函数与es6中的箭头函数区别： es3 es5中的函数的写法： function ()\{ \} es6中的箭头函数的写法： ()=>\{

梦里梦外;/ 2022年05月16日 01:25/ 0 赞/ 231 阅读

相关 es6中箭头函数this指向问题

普通函数：根据调用我的人（谁调用我，我的this就指向谁）箭头函数：根据所在的环境（我在哪个环境中，this就指向谁）看下面的例子 document.onc

偏执的太偏执、/ 2022年04月10日 10:37/ 0 赞/ 258 阅读

相关 ES6箭头函数修复ES5中this指向问题

长期以来，ES5中this对象一直的指向一个令人头痛的问题，在对象方法中使用此，必须非常小心例如： class Animal { constructo

系统管理员/ 2022年04月08日 10:54/ 0 赞/ 268 阅读

相关 ES6中箭头函数的this指向

一直以来对于ES6中箭头函数有些疑虑，其中一项就是this的指向问题，所以不敢放手去使用。因为跟之前我所熟悉掌握的函数内部this的指向是有些地方不同的，但是在箭头函数中thi

Myth丶恋晨/ 2022年03月07日 08:52/ 0 赞/ 293 阅读

相关 ES6 箭头函数及this指向详解

箭头函数相当于匿名函数，箭头函数简化了函数的定义，比函数表达式更简洁，并且没有自己的[this][]，[arguments][]。。。基础语法 `(参数1, 参数2,

快来打我*/ 2021年12月05日 15:13/ 0 赞/ 347 阅读

相关 ES6 箭头函数+this

一.箭头函数 1.基本用法 1.基本用法 var f = v => v; 上面的箭头函数等同于： var f

深藏阁楼爱情的钟/ 2021年09月15日 04:22/ 0 赞/ 444 阅读