Javascript JS:'；这'；在承诺链中，上下文始终显示为未定义

我在访问

then（）

承诺链中的

此

上下文时遇到问题。当调试器停止在

then（）

我搜索了之前关于这个的问题，并根据答案，尝试在范围之外创建一个变量

foo

，该变量等于

this

，但当我试图在调试器停止代码时查看它的值时，该变量返回为未定义

    updateQuantity: function(e,item) {
            if (e === null || e === "") {
                return
            }
            let originalQuantity = item.original_quantity;
            let updatedQuantity  = parseFloat(e)

            var foo = this;

            // can access other functions here, ex: this.updateName();

            axios.post('/api/inventory/' + item.inventory_id + '/update-quantity', {
                original_quantity: item.original_quantity,
                quantity: updatedQuantity
            })
            .then(response => {
                if (response.data && response.data.status == "success") {
                    this.showFlashMsg(response.data.message, true)
                    debugger
                } else if (response.data && response.data.status == "error") {
                    debugger
                }
            })
            .catch(err => {
                console.log(err);
            });
        },

---

看起来你很接近

TLDR； 至少在使用Typescript或更新的EcmaScript（JS）版本时，使用lambda函数（

=>

）将

此

绑定到正确的对象，因此Saurabh Agrawal发表了评论

当使用JS/EcmaScript的旧变体时，您必须获得要传递到链接方法中的

this

的引用，然后使用该引用而不是

this

。如果我记得的话，这也是Typescript或其他Transpiler在针对旧版本时使用的

使用您的代码（未测试），如下所示：

updateQuantity: function(e,item) {
            if (e === null || e === "") {
                return
            }
            let originalQuantity = item.original_quantity;
            let updatedQuantity  = parseFloat(e)

            // ADDED COMMENT -- looks like you already had a reference, just weren't using it
            var foo = this;

            // can access other functions here, ex: this.updateName();

            axios.post('/api/inventory/' + item.inventory_id + '/update-quantity', {
                original_quantity: item.original_quantity,
                quantity: updatedQuantity
            })
            .then(response => {
                if (response.data && response.data.status == "success") {
                    // EDIT -- use your variable reference to `this`
                    foo.showFlashMsg(response.data.message, true)
                    debugger
                } else if (response.data && response.data.status == "error") {
                    debugger
                }
            })
            .catch(err => {
                console.log(err);
            });
        },

---

@SaurabhAgrawal-你读过代码了吗？是的，这是我所期望的，但它显示为

未定义的

。而

foo

，我希望它能给我函数之外的作用域，现在它又恢复为未定义的，太奇怪了，这是可行的。为什么在

调试器
语句上方运行
console.log（foo）
时会显示
未定义的
？我不确定。不过，请确保在开发工具中显示了
日志
值。有时这些会被过滤掉。哦，因为
console.log
不返回值，所以它会在窗口中输出
undefined
。但是，如果您在chrome控制台过滤器中选择了
verbose
，您应该可以同时看到控制台输出和
undefined