Html之有意思的javascript 的 “BUG”

系统管理员 2022-12-27 09:20 81阅读 0赞

### Html之有意思的javascript 的 “BUG” ###

*  主程序文件
 *  问题描述
 *  结果展示
 *  问题
 *  原因

--------------------

***(声明：本教程仅供本人学习使用,如有人使用该技术触犯法律与本人无关)  
(如果有错误，还希望指出。共同进步)***

--------------------

【附上查询资料】

JavaScript 函数之：[箭头函数][Link 1]

JavaScript 方法之：[forEach() 方法][forEach_]

--------------------

# 主程序文件 #

<!DOCTYPE html>
    <html>
    <head>
    	<title></title>
    </head>
    <body>
    	<script src="https://cdn.micoworld.net/static/jquery.min.js"></script>
    	<script type="text/javascript">
    		var callbacks = [];
    		for (var i = 0; i < 2; ++i) {
         
    		  callbacks.push(() => console.log(i));
    		}
    		callbacks.forEach((a)=>a());
    		// console.log(callbacks)
    	</script>
    </body>
    </html>

# 问题描述 #

js语言：用一个列表存储 for循环中的变量，然后打印出来

# 结果展示 #

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzYzMzc5Nw_size_16_color_FFFFFF_t_70]

console端： 打印了两次“2”

# 问题 #

为什么不是1, 2两个数字

# 原因 #

【查看下callbacks列表中存储的数据】  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzYzMzc5Nw_size_16_color_FFFFFF_t_70 1]

1.  可以看到callbacks中存储的是 “console.log(i)”, 其中“i”是作为形参存储在列表中;
2.  由于 " ++i " 导致 i 的值最后变为 2。

[Link 1]: https://www.cnblogs.com/twoheads/p/9876396.html
[forEach_]: https://www.runoob.com/jsref/jsref-foreach.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzYzMzc5Nw_size_16_color_FFFFFF_t_70]: /images/20221120/86c4a89aea5446e6a68f15fab64faba0.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzYzMzc5Nw_size_16_color_FFFFFF_t_70 1]: /images/20221120/4dfb167e09864757963d7b0a6a966e3a.png