Question

我有两个功能，一个工作，另一个不工作。

它们是相同的，除了一个循环遍历变量，其中范围的全局对象被保存（希望这是有意义的），另一个尝试直接循环文本，但是失败，因为它抛出错误：

Uncaught TypeError: Cannot read property '0' of undefined

这是小提琴：

http://jsfiddle.net/4p1p4wjy/2/

根据我的理解，该函数的第二个版本无法正常工作，因为它无法从函数的回调中访问this.splittedText。

第一工作职能：

        loopThroughSplittedText: function() {
            // delete this
            var locationInString = 0;
            var splittedText = this.splittedText;

            function delayedOutput() {
                document.getElementById('output').innerHTML = splittedText[locationInString];

                locationInString++;

                if(locationInString < splittedText.length) {
                    setTimeout(delayedOutput, 200);
                }
            }

            delayedOutput();
        },

第二不工作功能：

        loopThroughSplittedTextNotWorking: function() {
            // delete this
            var locationInString = 0;

            function delayedOutput() {
                document.getElementById('output').innerHTML = this.splittedText[locationInString];

                locationInString++;

                if(locationInString < this.splittedText.length) {
                    setTimeout(delayedOutput, 200);
                }
            }

            delayedOutput();
        }

如何在不首先将对象保存在局部变量中的情况下使第二个功能起作用？我想尽可能使用双向数据绑定。

Answer 1

如何在不首先将对象保存在局部变量中的情况下使第二个功能起作用？

你不能。 this是一个变量，它始终是它所使用的函数的本地变量，它的值取决于函数的调用方式。如果要在不同的函数中使用其值，则需要将其复制到另一个变量中。

bind方法提供了这样做的简写。

setTimeout(delayedOutput.bind(this), 200);

Answer 2

简单回答，你不是。因为你的功能是通过超时调用的，所以它不再在同一个环境中了，而且这个＆＃39;将不再引用同一个对象。

你可以这样做：

        loopThroughSplittedTextNotWorking: function() {
        // delete this
        var locationInString = 0;

        var that = this;

        function delayedOutput() {
            document.getElementById('output').innerHTML = that.splittedText[locationInString];

            locationInString++;

            if(locationInString < that.splittedText.length) {
                setTimeout(delayedOutput, 200);
            }
        }

        delayedOutput();
    }

通过保存＆＃34;这个＆＃34;变量为局部变量，您可以在＆＃34; delayedOutput＆＃34;功能

我意识到它基本上就像你的工作实例一样，只是表达了一些不同，但通常我是这样做的。

两个相似函数之间的区别，为什么一个工作而另一个不工作

2 个答案: