Chorme浏览器中for循环里面console.log打印二维数组,展开后数据全部一样,出现value below was evaluated just now问题

本文主要是介绍Chorme浏览器中for循环里面console.log打印二维数组,展开后数据全部一样,出现value below was evaluated just now问题,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前言

之前在做蚁群算法研究时,遇到数据爆炸,想打印查看js数据极限点,于是设置迭代次数为5,预期是每次迭代就打印一次信息数矩阵,5次迭代打印5组不同的二维数组,好来查看每次循环中信息素的变化情况。但是console.log出来的所有数据是一样的,点击右上角的感叹号,出现Value below was evaluated just now。与预期不符。

(说明:开始猜想for循环打印的东西都一样,是不是闭包问题,试着往闭包方向去解决,采用let定义,都无效。结果证明此问题不是闭包问题,是console.log取值问题)

 

然后我模拟该算法,采用一套简单逻辑分析其原因。代码如下,设置循环次数(蚂蚁迭代次数为5次),查看每次迭代信息数的变化情况。预期情况也是每次迭代就打印一次数组,5次迭代有5组不同结果:

出现的结果却是与预期相符的,每次循环迭代出现结果不同

但是,当我点开数组后发现:又出现了Value below was evaluated just now。没展开的值,如黄色框内是不同的,展开后,如红色框内的值全是一样的。究其原因,可以发现其实是在Chrome Console.log()点击展开数组时,会重新去读一遍内存真实的值然后显示,所以展开后都是最终值。

 

因此,在打印二维数组时,其实如若不展开,他显示的就是当前值,但是点击展开后,会重新去内存读值,所以展开的值,全是最终值,所以看到所有二维数组打印的都是一个值的情况。

但是如果不展开,又看不到值,所以本文介绍以下几种解决方案:

方案一:document.write()输出显示

可以得到想要的结果,篇幅问题就不截图了。

方案二:打印之前克隆对象

function deepClone(obj){var result,oClass=isClass(obj);//确定result的类型if(oClass==="Object"){result={};}else if(oClass==="Array"){result=[];}else{return obj;}for(key in obj){var copy=obj[key];if(isClass(copy)=="Object"){result[key]=arguments.callee(copy);//递归调用}else if(isClass(copy)=="Array"){result[key]=arguments.callee(copy);}else{result[key]=obj[key];}}return result;
}
//返回传递给他的任意对象的类
function isClass(o){if(o===null) return "Null";if(o===undefined) return "Undefined";return Object.prototype.toString.call(o).slice(8,-1);
}
function sleep(numberMillis) {var now = new Date();var exitTime = now.getTime() + numberMillis;while (true) {now = new Date();if (now.getTime() > exitTime)return;}
}

可以看到,这样打印出来的就是每次都不一样了。 

方案三:Json.Stringify转换成字符串

这篇关于Chorme浏览器中for循环里面console.log打印二维数组,展开后数据全部一样,出现value below was evaluated just now问题的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/827395

相关文章

大数据spark3.5安装部署之local模式详解

《大数据spark3.5安装部署之local模式详解》本文介绍了如何在本地模式下安装和配置Spark,并展示了如何使用SparkShell进行基本的数据处理操作,同时,还介绍了如何通过Spark-su... 目录下载上传解压配置jdk解压配置环境变量启动查看交互操作命令行提交应用spark,一个数据处理框架

通过ibd文件恢复MySql数据的操作方法

《通过ibd文件恢复MySql数据的操作方法》文章介绍通过.ibd文件恢复MySQL数据的过程,包括知道表结构和不知道表结构两种情况,对于知道表结构的情况,可以直接将.ibd文件复制到新的数据库目录并... 目录第一种情况:知道表结构第二种情况:不知道表结构总结今天干了一件大事,安装1Panel导致原来服务

Flask解决指定端口无法生效问题

《Flask解决指定端口无法生效问题》文章讲述了在使用PyCharm开发Flask应用时,启动地址与手动指定的IP端口不一致的问题,通过修改PyCharm的运行配置,将Flask项目的运行模式从Fla... 目录android问题重现解决方案问题重现手动指定的IP端口是app.run(host='0.0.

Seata之分布式事务问题及解决方案

《Seata之分布式事务问题及解决方案》:本文主要介绍Seata之分布式事务问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Seata–分布式事务解决方案简介同类产品对比环境搭建1.微服务2.SQL3.seata-server4.微服务配置事务模式1

mysql关联查询速度慢的问题及解决

《mysql关联查询速度慢的问题及解决》:本文主要介绍mysql关联查询速度慢的问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录mysql关联查询速度慢1. 记录原因1.1 在一次线上的服务中1.2 最终发现2. 解决方案3. 具体操作总结mysql

Jmeter如何向数据库批量插入数据

《Jmeter如何向数据库批量插入数据》:本文主要介绍Jmeter如何向数据库批量插入数据方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Jmeter向数据库批量插入数据Jmeter向mysql数据库中插入数据的入门操作接下来做一下各个元件的配置总结Jmete

一文教你解决Python不支持中文路径的问题

《一文教你解决Python不支持中文路径的问题》Python是一种广泛使用的高级编程语言,然而在处理包含中文字符的文件路径时,Python有时会表现出一些不友好的行为,下面小编就来为大家介绍一下具体的... 目录问题背景解决方案1. 设置正确的文件编码2. 使用pathlib模块3. 转换路径为Unicod

Spring MVC跨域问题及解决

《SpringMVC跨域问题及解决》:本文主要介绍SpringMVC跨域问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录跨域问题不同的域同源策略解决方法1.CORS2.jsONP3.局部解决方案4.全局解决方法总结跨域问题不同的域协议、域名、端口

Java中数组转换为列表的两种实现方式(超简单)

《Java中数组转换为列表的两种实现方式(超简单)》本文介绍了在Java中将数组转换为列表的两种常见方法使用Arrays.asList和Java8的StreamAPI,Arrays.asList方法简... 目录1. 使用Java Collections框架(Arrays.asList)1.1 示例代码1.

SpringBoot自定义注解如何解决公共字段填充问题

《SpringBoot自定义注解如何解决公共字段填充问题》本文介绍了在系统开发中,如何使用AOP切面编程实现公共字段自动填充的功能,从而简化代码,通过自定义注解和切面类,可以统一处理创建时间和修改时间... 目录1.1 问题分析1.2 实现思路1.3 代码开发1.3.1 步骤一1.3.2 步骤二1.3.3