当迭代数组并打印键和值时,还包括_proto_函数,为什么?
When iterating an array and print the key and value, also included _proto_ functions, Why?
我做了一个小脚本,迭代和打印一个JSON对象的值,如果对象的值是另一个对象或数组,我将调用这个工作来迭代值(数组或对象)。
这是我提出的一个问题,当我打印数组的值,并打印值,也增加值在__ proto__数组的一部分注意,您需要在您的HTML中有一个id为jsonUls
的<ul>
元素才能使此代码工作。代码:
var json = '{"jsonObject":{"value1":"value2", "array1" : ["value1","value2","value3"]}}'; /* Create Json */
var element = $('#jsonUls');
var object = JSON.parse(json); /* Create object */
/* call the function*/
recursivePrintObjectValues(object, element);
function recursivePrintObjectValues(object, element) {
for(key in object) { /* Iterate the object */
var value = object[key]; /*Get the object value */
/* Verify if value is of type object or an array */
if(typeof value === 'object' || Array.isArray(value)){
/*Generate random */
var random = new Date().valueOf() * Math.random() + 351;
/* Append Li with key */
appendLi(key, '', element);
/*Append UL and get the selector*/
var ul = appendUl(random, element);
/*Call the function with the object and the selector to append (to iterate childs of this object)*/
recursivePrintObjectValues(value, ul);
} else {
appendLi(key, value, element);
}
}
}
function appendUl(random, element) {
var ul = $('<ul></ul>', {
id: random
})
ul.appendTo(element);
return ul;
}
function appendLi(key, value, element) {
if(value == '[object Object]') {
value = '';
}
$('<li></li>', {
text: key + ' : '+ value
}).appendTo(element);
}
结果如下,我不知道为什么和如何避免它,希望有人能给我解释一下。
<pre>
<ul id="jsonUls">
<li>jsonObject : </li>
<ul id="448773395479.7797">
<li>value1 : value2</li>
<li>array1 : </li>
<ul id="295240780591.31195">
<li>0 : value1</li>
<li>1 : value2</li>
<li>2 : value3</li>
<li>$pnmap$ : function $$JSCompiler_prototypeAlias$$$$pnmap$$($f$$30$$,$opt_obj$$28$$){return $goog$array$map$$.apply($JSCompiler_alias_NULL$$,$pn$aargs_$$(this,arguments))}</li>
<li>$pnforEach$ : function $$JSCompiler_prototypeAlias$$$$pnforEach$$($f$$32$$,$opt_obj$$30$$){$goog$array$forEach$$.apply($JSCompiler_alias_NULL$$,$pn$aargs_$$(this,arguments));return this}</li>
<li>$pnequals$ : function $$JSCompiler_prototypeAlias$$$$pnequals$$($arr2$$13$$,$opt_equalsFn$$2$$){return $goog$array$equals$$.apply($JSCompiler_alias_NULL$$,$pn$aargs_$$(this,arguments))}</li>
<li>$pnfindIndex$ : function $$JSCompiler_prototypeAlias$$$$pnfindIndex$$($f$$41$$,$opt_obj$$43$$){return $goog$array$findIndex$$.apply($JSCompiler_alias_NULL$$,$pn$aargs_$$(this,arguments))}</li>
<li>$pnindexOf$ : function $$JSCompiler_prototypeAlias$$$$pnindexOf$$($obj$$76$$,$opt_fromIndex$$10$$){return $goog$array$indexOf$$.apply($JSCompiler_alias_NULL$$,$pn$aargs_$$(this,arguments))}</li>
</ul>
</ul>
</ul>
</pre>
这是因为for...in
也会迭代从对象原型继承的属性。
一种避免方法是使用hasOwnProperty
检查并拒绝它们:
for(key in object) {
if (!object.hasOwnProperty(key)) continue;
// your other code follows
}
另一个选择是使用defineProperty
在原型上定义不可枚举的属性,但这也可能改变代码其他部分的行为。
您需要使用Object.hasOwnProperty
函数,如下所示:
var obj = {},
property;
for (property in obj) {
if ( obj.hasOwnProperty(property) ) {
// Your code goes here
}
}
相关文章:
- 包括用于facebook评论框的JavaScript SDK
- 查找元素高度,包括边距
- asp.net,包括iss上的javascript slow
- SuiteScript2.0-包括一个自定义文件
- javascript加密实现,包括可信否认
- 在iOS和Android上使用React native时,我还能使用本机第三方lirbraries吗
- 在ng中给出文件路径包括什么
- 包括angular 1.3.0项目上的angular bootstrap ui
- 如何将单词(包括单词)与连字符匹配
- 根据下拉值包括或加载php
- 根据另一个数组对数组进行排序,包括位置和字符串[ES6]
- PHP 包括 Javascript 生成的文件名
- 在scala或scalajs Diode中,现有类型中的任何一种都符合“;更新一个没有'还不存在”;
- 包括android中的HTML UI
- modernizr.js还有用吗
- 如何将页面上的所有电话号码更改为可点击链接,不包括特定类别的元素
- 在HTML中,如果第二次加载相同的脚本文件,它还会被加载吗
- Javascript:包括特殊字符的文本选择
- 包括php文件和几个js文件
- 当迭代数组并打印键和值时,还包括_proto_函数,为什么?