vue 使用forEach报错,this指向问题

 
更多

vue 使用forEach的过程中,关于 this 的指向问题。

function PhpernoteChart(data) {
    this.data = data;
    this.width = 0;

    this.data.list.forEach(function (item) {
        if (this.width > parseInt(item.x)) {
            this.width = parseInt(item.x);
        }
    });
}

var a = new PhpernoteChart(data);

每一个用function声明的函数在调用时都会在函数内创建自己的this。this一般是函数所操作的对象。如果没有操作的对象。this在”use strict”;严格模式下是 undefined,非严格模式下是 window。
也就是说,function声明的函数总是有自己的this。从而遮盖外层作用域中的this。
如果用es6的箭头函数()=>{}就没有自己的this。在箭头函数()=>{}中访问this,是访问外层作用域中的this

function PhpernoteChart(data) {
    this.data = data;
    this.width = 0;

    this.data.list.forEach(item => {
        if (this.width > parseInt(item.x)) {
            this.width = parseInt(item.x);
        }
    });
}
打赏

本文固定链接: https://www.cxy163.net/archives/3157 | 绝缘体

该日志由 绝缘体.. 于 2021年12月03日 发表在 未分类 分类下, 你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站或博客。
原创文章转载请注明: vue 使用forEach报错,this指向问题 | 绝缘体
关键字: , , , ,

vue 使用forEach报错,this指向问题:等您坐沙发呢!

发表评论


快捷键:Ctrl+Enter