JS九九乘法表-千奇百怪的错，五彩斑斓的改

中年男人自学js的跬步之行，错的我自己都乐了...

自己练习for循环打乘法表，一路披荆斩棘，错误无数，状况百出，在此记录，以示后人。

 for(heng = 1;heng <= 9;heng++){for(shu = 1;shu <= heng;shu++){console.log(shu+' * '+heng+' = '+shu*heng)}}

运行后发现结果是这样

然后想找一个不换行的命令，没找到...

参考网上的方法，加了一个str变量，想把这个乘法表加到一个字符串里打印，完整代码如下：

    let str = '';for(heng = 1;heng <= 9;heng++){for(shu = 1;shu <= heng;shu++){str += shu+' * '+heng+' = '+shu*heng;}}console.log(str);

运行后是这样，没有换行...

于是在第6行加了换行（原来在第5行大括号后面加的，发下command+/注释掉的时候连着括号一起注释掉了，所以要单独一行），代码如下：

    let str = '';for(heng = 1;heng <= 9;heng++){for(shu = 1;shu <= heng;shu++){str += shu+' * '+heng+' = '+shu*heng;}console.log('\n');}console.log(str);

运行后结果是这样，还是没有换行，只是运行了9遍...

用谷歌浏览器断点调试测试分析得知：

26行之前正确输出了1*1=1，但是没有console.log(str),都存在缓存里，到了27打印了个换行，就有返回23继续循环了，如此反复了9次，打印了9个27行（换行），才最终打印了29行，所以出现了截图效果。

想着：把29提到27前面，先打印，再回车，是不是就可以了？

    let str = '';for(heng = 1;heng <= 9;heng++){for(shu = 1;shu <= heng;shu++){str += shu+' * '+heng+' = '+shu*heng;}console.log(str);console.log('\n');}

结果如下，只对了2行，从第3行就开始抽风：

继续断点调试：

分析如下，第一次打印后，进入第二次循环时，str已经包含了1*1=1，因为用了+=，所以每次打印都带着上一次的结果。那把+=改成=试试呢？

代码如下：

    let str = '';for(heng = 1;heng <= 9;heng++){for(shu = 1;shu <= heng;shu++){str = shu+' * '+heng+' = '+shu*heng;}console.log(str);console.log('\n');}

醉了...结果如下：

继续断点调试...

因为没有+=，只有=，所以每次都是第二个for里shu++之后大于heng（73行for范围和变化那里）了，才跳出循环，所以只打印跳出循环前最后生成的字符串...

没想法了，看了眼别人写好的，原来新建的空字符串是在第一层循环和第二层循环之间定义的，太难了...我感觉这不看答案根本想不到啊，大家都很容易的写出来了么，这个会写多了慢慢就好了么，还是就真的笨啊...

最终代码如下：

    for(heng = 1;heng <= 9;heng++){let str = '';for(shu = 1;shu <= heng;shu++){str += shu+' * '+heng+' = '+shu*heng+'   ';}console.log(str);console.log('\n');}

终于成功了：

.....然后无意间又看到有heng&shu相等时加换行的写法，理解思路了，有时间也试试，看看能怎么千奇百怪的错，怎么五彩斑斓的改的.......脑子是个好东西，可惜咱没有啊！！

JS九九乘法表-千奇百怪的错，五彩斑斓的改相关推荐

原生 js 九九乘法表
原生 js 九九乘法表 1效果图 2html 1效果图 2html <!DOCTYPE html> <html><head><meta charset=&qu ...
前端：JS/19/特殊运算符，运算符优先级，if条件判断语句，switch分支语句，while循环语句，for循环语句，break和continue循环控制语句，实例：九九乘法表
特殊运算符 new运算符:创建一个对象.如:var today=new Date(); delete运算符:删除数组的元素,或者对象的属性: typeof运算符:一元运算符,主要功能:判断变量的类型的 ...
JS实现上下左右对称的九九乘法表
JS实现上下左右对称的九九乘法表 css样式 <style>table{table-layout:fixed;border-collapse:collapse;}td{padding:10 ...
用html制作三角形九九乘法表,用js实现打印九九乘法表
用js在控制台打印九九乘法表运行结果思考在学习了流程控制和条件判断后,我们可以利用js打印各式各样的九九乘法表不管是打印什么样三角形九九乘法表,我们都应该找到有规律的地方,比如第一列的数字是什 ...
使用JS打印九九乘法表
今天博主看到天眼查的一道面试题,让候选人说出如何使用JS打印九九乘法表,这道题目对很多人来说可能很简单,但是博主还是想和大家分享一下,如何解决这个问题,分析下这个问题的思路,以帮助大家巩固基础,让我们 ...
js代码实现打印九九乘法表
js代码实现九九乘法表的打印当然实现的方法有很多种,在这里我就分享一下我用的几种方式(废话不多说,直接上代码!!!) 一.首先是输出在页面的代码 <script>for (var i = ...
js中如何打印九九乘法表
九九乘法表对于学编程的人来说应该都不陌生,不管是在C语言中还是在JavaScript中都会接触到,现在我就说一说在js中如何打印出九九乘法表,我们最终打印出的样子应该是这样的对于前面两种我们应该十分 ...
使用JS代码简单实现九九乘法表
开发工具与关键技术: Visual Studio Code/JS 作者:唐嘉怡撰写时间:2022/6/18 大家从小学开始就应该被老师要求要熟练背诵九九乘法表吧.那么大家如若要展示给其他不认识九九乘 ...
JS实现九九乘法表和时间问候语
编码小练习,练习使用循环实现一个九九乘法表第一步,最低要求:在Console中按行输出 n * m = t 然后,尝试在网页中,使用table来实现一个九九乘法表 1 <!DOCTYPE h ...

JS九九乘法表-千奇百怪的错，五彩斑斓的改

JS九九乘法表-千奇百怪的错，五彩斑斓的改相关推荐

最新文章

热门文章