运行时JavaScript typewriter函数未定义问题求助
问题解决:typewriter函数未定义的原因及修复
核心问题:多余的闭合花括号
你提供的typewriter函数代码末尾存在多余的2个闭合花括号,这直接导致函数语法错误,JavaScript引擎无法正确解析函数定义,所以调用时会提示函数未定义。
原代码最后部分的三个}是错误的:
} } }
typewriter函数只需要一个}来闭合,多余的括号破坏了语法结构。
修正后的完整代码
function typewriter() { sContents = ""; //repeated though iRow = Math.max(0, iIndex - iScrollAt); //rhis only tries to see which is the largest number. if you solve iindex-iscrollat, you'd get -20. between -20 and zero, zero is bigger, so math.max picks it and it is now assigned to iRow. you can console.log iRow to check its value. i think it is better to just say iRow is equal to zero, instead of passing through the stress. var destination = document.getElementById("typed"); //get the element that it the array text would be appended to. while (iRow < iIndex) { //the while here is a type of loop, while the iRow is less than the position of the text in the array. execute the below code as long as the condition is true. this condition is only true when the iIndex has been moved to 1 or the next string. that means this code for the next text string after the first. tested with console.log(iRow, iIndex); sContents += aText[iRow] + "<br>"; //mind you, increment of zero is 1. iRow++; } destination.innerHTML = sContents + aText[iIndex].substring(0, iTextPos) + blinky.innerHTML; //this code will run first for the first string text ie iIndex equal to 0. then it will run a second time, but this time it will add the next steing text to the first one, which will make them stay in the same element called destination it was tested with this "console.log(sContents);" //the substring starts from 0, thats first character and returns the following characters as iTextPos increments. one by one. if (iTextPos++ == iArrLength) { //the heart of the code. this says if the increment in the textposition is equal to the length of the text in that particular string. it won't work if iTextpos++ is put as iTextpos, because it is always incrementing. check this out to see "console.log(iTextPos);" iTextPos = 0; //text position is reseted here.blinky.style.borderRight = "10px solid white"; //to show itself blinky.style.display = "inline"; //very important, to make it inline with the text which i alredy made display as inline too, in order for them to appear on same line together. iIndex++; //iIndex is incremented, and thats what causes iIndex to turn to 1 meaning next line, if theres another, it will turn to 2 and so on. if (iIndex != aText.length) { //it will almost likely never be equal to it, so the below code will always run. iArrLength = aText[iIndex].length; //the iArrLength is updated with new length for new string or next string. setTimeout("typewriter()", 500); //function is then called again after 500ms, so as to render the next text out. } } else { setTimeout("typewriter()", iSpeed); //if no new line, call function after iSpeed value } }
额外优化建议
- 把
setTimeout里的字符串调用改成函数引用,避免潜在的作用域问题:setTimeout(typewriter, 500); // 替代 setTimeout("typewriter()", 500); - 尽量避免使用未声明的全局变量(你提到已在环境中声明,但最好在函数内用
var/let/const明确声明,避免意外的作用域问题)。
内容的提问来源于stack exchange,提问作者Victory Osiobe
相关产品推荐
相关产品推荐

