数组只有4个元素,但即使在删除空元素

时间:2018-01-09 07:24:58

标签: javascript jquery arrays

我有一个包含4个元素的数组,在一个场景中我想从数组中弹出一个元素。但是在pop数组给出与之前相同的结果之后。 我已经检查了控制台窗口,在那里我发现了一个不同的行为,如数组长度为4,它显示它有5个元素。 enter image description here

我也试图删除空元素,但仍然会出现同样的问题。

var brudcrumbDataArray=JSON.parse(brudcrumbDataString);

            brudcrumbDataArray = brudcrumbDataArray.filter(function(n){ return n != undefined }); 
            console.log(brudcrumbDataArray)
            brudcrumbDataArray.pop();
            console.log(brudcrumbDataArray)

她是阵列:

[{"name":"Dashboard","url":"","path":"","class":"icon-home2 position-left","type":"MainMenu","queryParams":""},{"name":"Main","url":"#/dashboard","path":"/dashboard","class":"","type":"SubMenu","queryParams":""},{"name":"Sub Accounts","url":"#/account/customers","path":"/account/customers","class":"","type":"SubMenu","queryParams":""},{"name":"End Users","url":"#/account/endusers","path":"/account/endusers","class":"","type":"SubMenu","queryParams":""},{"name":"Profile","url":"#/user-dashboard","path":"/user-dashboard","class":"","type":"SubMenu","queryParams":""}]

pop后,数组给出相同的数据和相同的长度。有人可以帮我解决这个问题吗?

摘录,检查您的控制台以查看问题:

var brudcrumbDataString =`[{"name":"Dashboard","url":"","path":"","class":"icon-home2 position-left","type":"MainMenu","queryParams":""},{"name":"Main","url":"#/dashboard","path":"/dashboard","class":"","type":"SubMenu","queryParams":""},{"name":"Sub Accounts","url":"#/account/customers","path":"/account/customers","class":"","type":"SubMenu","queryParams":""},{"name":"End Users","url":"#/account/endusers","path":"/account/endusers","class":"","type":"SubMenu","queryParams":""},{"name":"Profile","url":"#/user-dashboard","path":"/user-dashboard","class":"","type":"SubMenu","queryParams":""}]`;

var brudcrumbDataArray=JSON.parse(brudcrumbDataString);

brudcrumbDataArray = brudcrumbDataArray.filter(function(n){ return n != undefined }); 
console.log(brudcrumbDataArray)
brudcrumbDataArray.pop();
console.log(brudcrumbDataArray)

2 个答案:

答案 0 :(得分:1)

控制台上的结果似乎是正确的。操作后,控制台窗口上的两个日志都显示结果。 为什么第一个日志显示结果呢?因为在javascript中,复杂对象通过引用存储,这就是为什么第一个日志也会在其中显示结果。

以参考方式存储?这是什么意思? :https://docstore.mik.ua/orelly/webprog/jscript/ch04_04.htm

尝试下面一个,

var brudcrumbDataString =`[{"name":"Dashboard","url":"","path":"","class":"icon-home2 position-left","type":"MainMenu","queryParams":""},{"name":"Main","url":"#/dashboard","path":"/dashboard","class":"","type":"SubMenu","queryParams":""},{"name":"Sub Accounts","url":"#/account/customers","path":"/account/customers","class":"","type":"SubMenu","queryParams":""},{"name":"End Users","url":"#/account/endusers","path":"/account/endusers","class":"","type":"SubMenu","queryParams":""},{"name":"Profile","url":"#/user-dashboard","path":"/user-dashboard","class":"","type":"SubMenu","queryParams":""}]`;

var brudcrumbDataArray=JSON.parse(brudcrumbDataString);

brudcrumbDataArray = brudcrumbDataArray.filter(function(n){ return n != undefined }); 
console.log(JSON.parse(JSON.stringify(brudcrumbDataArray)))
brudcrumbDataArray.pop();
console.log(JSON.parse(JSON.stringify(brudcrumbDataArray)))

仔细观察,我们正在使用JSON操作进行深度数据复制,通过JSON.parse(JSON.stringify( ))中的周围对象进行深度数据复制,现在不再指向引用。

日志将更加清晰,如下所示,

enter image description here

答案 1 :(得分:-1)

它显示因为对同一object的引用所以当你pop最后一个元素时,对象被修改并显示长度为4,因此第一个安慰对象也会更新。

var brudcrumbDataArray = [{"name":"Dashboard","url":"","path":"","class":"icon-home2 position-left","type":"MainMenu","queryParams":""},{"name":"Main","url":"#/dashboard","path":"/dashboard","class":"","type":"SubMenu","queryParams":""},{"name":"Sub Accounts","url":"#/account/customers","path":"/account/customers","class":"","type":"SubMenu","queryParams":""},{"name":"End Users","url":"#/account/endusers","path":"/account/endusers","class":"","type":"SubMenu","queryParams":""},{"name":"Profile","url":"#/user-dashboard","path":"/user-dashboard","class":"","type":"SubMenu","queryParams":""}]


//var brudcrumbDataArray=JSON.parse(brudcrumbDataString);

            var newBrudcrumbDataArray = brudcrumbDataArray.filter(function(n){ return n != undefined }); 
            console.log(brudcrumbDataArray)
            newBrudcrumbDataArray.pop();
            console.log(newBrudcrumbDataArray)