js中枚举对象所有的属性名并输出属性值

╰+攻爆jí腚メ 2022-10-29 09:04 214阅读 0赞

枚举对象属性名：  
代码如下：

<!DOCTYPE html>
    <html lang="zh">
    <head>
    	<meta charset="UTF-8" />
    	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
    	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
    	<title>Document</title>
    	<script type="text/javascript">
    		var obj = {
    			name:'怪兽',
    			age:18,
    			sex:'男',
    			hobby:'girl'
    		}
    		for(var n in obj){
    			console.log(n);
    		}
    	</script>
    </head>
    <body>
    	
    </body>
    </html>

运行结果如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZpZ2h0aW5nX2RyZWFt_size_16_color_FFFFFF_t_70]  
我想把属性值一并输出，可以用如下方法：

<!DOCTYPE html>
    <html lang="zh">
    <head>
    	<meta charset="UTF-8" />
    	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
    	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
    	<title>Document</title>
    	<script type="text/javascript">
    		var obj = {
    			name:'怪兽',
    			age:18,
    			sex:'男',
    			hobby:'girl'
    		}
    		for(var n in obj){
    			console.log(n + ":" + obj[n]);
    		}
    	</script>
    </head>
    <body>
    	
    </body>
    </html>

运行结果如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZpZ2h0aW5nX2RyZWFt_size_16_color_FFFFFF_t_70 1]  
注意：  
![在这里插入图片描述][20210210165221235.png]**而obj\[“n”\]就类似于obj.n.我们都知道，obj是没有n这个属性的呀，只有name,sex那些**

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZpZ2h0aW5nX2RyZWFt_size_16_color_FFFFFF_t_70]: /images/20221024/248a52de511f4883b6fd9a0b8a3f683b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZpZ2h0aW5nX2RyZWFt_size_16_color_FFFFFF_t_70 1]: /images/20221024/e759c4402a0544a5b9e02468cf2e3ee5.png
[20210210165221235.png]: https://img-blog.csdnimg.cn/20210210165221235.png