javascript - 嵌套的setTimeouts具有相同的名称，这样做有什么影响？

我只是浏览了typed.js的源代码，基本上这个插件中的主要功能使用了多个setTimeout相互嵌套的设计模式，请看一下代码：

self.timeout = setTimeout(function() {
    // check for an escape character before a pause value
    // format: \^\d+ .. eg: ^1000 .. should be able to print the ^ too using ^^
    // single ^ are removed from string
    var charPause = 0;
    var substr = curString.substr(curStrPos);
    if (substr.charAt(0) === '^') {
        var skip = 1; // skip atleast 1
        if (/^\^\d+/.test(substr)) {
            substr = /\d+/.exec(substr)[0];
            skip += substr.length;
            charPause = parseInt(substr);
        }

        // strip out the escape character and pause value so they're not printed
        curString = curString.substring(0, curStrPos);
    }

    if (self.contentType === 'html') {
        // skip over html tags while typing
        var curChar = curString.substr(curStrPos).charAt(0);
        if (curChar === '<' || curChar === '&') {
            var tag = '';
            var endTag = '';
            if (curChar === '<') {
                endTag = '>';
            } else {
                endTag = ';';
            }
            while (curString.substr(curStrPos).charAt(0) !== endTag) {
                tag += curString.substr(curStrPos).charAt(0);
                curStrPos++;
            }
            curStrPos++;
            tag += endTag;
        }
    }

    // timeout for any pause after a character
    self.timeout = setTimeout(function() {
        if (curStrPos === curString.length) {
            // fires callback function
            self.options.onStringTyped(self.arrayPos);

            // is this the final string
            if (self.arrayPos === self.strings.length - 1) {
                // animation that occurs on the last typed string
                self.options.callback();

                self.curLoop++;

                // quit if we wont loop back
                if (self.loop === false || self.curLoop === self.loopCount)
                    return;
            }

            self.timeout = setTimeout(function() {
                self.backspace(curString, curStrPos);
            }, self.backDelay);
        } else {

            /* call before functions if applicable */
            if (curStrPos === 0)
                self.options.preStringTyped(self.arrayPos);

            // start typing each new char into existing string
            // curString: arg, self.el.html: original text inside element
            var nextString = curString.substr(0, curStrPos + 1);
            if (self.attr) {
                self.el.attr(self.attr, nextString);
            } else {
                if (self.isInput) {
                    self.el.val(nextString);
                } else if (self.contentType === 'html') {
                    self.el.html(nextString);
                } else {
                    self.el.text(nextString);
                }
            }

            // add characters one by one
            curStrPos++;
            // loop the function
            self.typewrite(curString, curStrPos);
        }
        // end of character pause
    }, charPause);

    // humanized value for typing
}, humanize);

我在理解上面的代码时没有问题，但是我对使用相同名称的多个setTimeouts相互怀疑表示怀疑。

self.timeout

这可以吗？使用setTimeouts相互嵌套会有什么影响？还是这种编码方法完全正确？当我实际上在代码中看到同名的setTimeouts时，我脑海中浮现出一个很大的问号。

CODE ON GIT

谢谢。

亚历克斯

最佳答案

将多个setTimeout()返回值分配给同一变量self.timeout是没有问题的。

但是，由于每次使用最后一个clearTimeout()返回值覆盖self.timeout时，都将无法清除setTimeout()以前的所有超时。

但是，在特定的代码示例中，未使用提供的clearTimeout()。因此，虽然没有达到目的，但将返回值分配给相同的变量self.timeout也是没有用的。