Javascript 获取数组长度, 对象成员个数, 字符串数

绝地灬酷狼 2023-07-25 06:28 24阅读 0赞

1.应用场景

<table> 
 <tbody> 
 <tr> 
 <td>获取数组长度, 对象成员个数, 字符串数.</td> 
 </tr> 
 </tbody> 
</table>

2.学习/操作

<table> 
 <tbody> 
 <tr> 
 <td> Q1.Javascript怎么得到数组长度(也就是数组的元素个数)? Q2.Javascript怎么获取对象的成员个数? &nbsp; Q1&nbsp;你肯定想到了array.length!? 那么我们来测试一下下面这个例子. &lt;script type="text/javascript"&gt; var a = []; a[50] = 50; alert(a.length); &lt;/script&gt; 请问数组a有多少个元素, 或者换一句话说, 数组a的长度为多少? 你会告诉我长度为1, 但浏览器会告诉你a.length为51. 有点意思吧?&nbsp; //其实也好理解, 类比于PHP中的索引数组, 一切根据key的变化而定。 <img alt="" height="157" src="https://img-blog.csdnimg.cn/20200514143658856.png" width="336"> &nbsp; 那我们再看一个例子. 
 <blockquote> 
 &lt;script type="text/javascript"&gt; 
 var a = []; 
 a['age'] = '18'; 
 a['sex'] = 'Male'; a['site'] = 'http://www.qSyz.net'; 
 alert(a.length); 
 &nbsp; 
 &lt;/script&gt; 
 </blockquote> 请问数组a有多少个元素, 或者换一句话说, 数组a的长度为多少? 我们都知道现在数组a的元素个数为3个,但浏览器会告诉你a.length为0 !! &nbsp; 备注：<code>undefined</code>和<code>null</code>，与空位是不同的概念~~ <img alt="" height="195" src="https://img-blog.csdnimg.cn/20200514143530444.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dpbGxpYW1fbg==,size_16,color_FFFFFF,t_70" width="546"> &nbsp; Q2&nbsp;js怎么获取对象的成员个数? 用length属性吗? 
 <blockquote> 
 &lt;script type="text/javascript"&gt; 
 var a = {'age':30,'sex':'male'}; 
 alert(a.length); 
 &nbsp; 
 &lt;/script&gt; 
 </blockquote> 以上代码得到结果为undefined! &nbsp; 综上所述, length不可靠, 要想准确获取js数组元素个数或者对象的成员个数, 我们需要自己动手写一个函数. &nbsp; 备注: 数组 如果不是通过[key]修改的, 而是直接声明初始化赋值/或者使用push, pop修改, 是可以使用的. 如下: <img alt="" height="439" src="https://img-blog.csdnimg.cn/20200509145147129.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dpbGxpYW1fbg==,size_16,color_FFFFFF,t_70" width="419"> &nbsp; &nbsp; 统一解决办法: 自定义函数, 但是有时候可能大材小用[数据类型确定, 就针对一种写解决方法即可] &nbsp; 如果传入数组则计算数组长度, 如果传入对象则计算对象成员数, 如果传入字符串则计算字符串的字数, 其他类型返回false &nbsp; 备注: 字符串与数组的相似性仅此而已。实际上，无法改变字符串之中的单个字符,&nbsp; <code>length</code>属性返回字符串的长度，该属性也是无法改变的。 所以可以字符串可以使用length属性来取值 
 <blockquote> 
 &lt;script type="text/javascript"&gt; 
 &nbsp; 
 //方式一 
 function count(o){ &nbsp;&nbsp; &nbsp;var t = typeof o; &nbsp;&nbsp; &nbsp;if(t == 'string'){ &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return o.length; &nbsp;&nbsp; &nbsp;}else if(t == 'object'){ &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;var n = 0;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;for(var i in o){ &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;n++; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;} &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return n; &nbsp;&nbsp; &nbsp;} &nbsp;&nbsp; &nbsp;return false; } 
 &nbsp; 
 &nbsp; 
 // 方式二： 
 function countTwo(value){ &nbsp;&nbsp; &nbsp;var type = typeof value; &nbsp;&nbsp; &nbsp;if(type == 'string'){ &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return value.length; &nbsp;&nbsp; &nbsp;}else if(type == 'object'){ &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;var type = value instanceof Array;&nbsp; //或者直接通过value.filter来检测判断亦可， 数组有该方法， 对象没有 &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;if(type){ &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return value.filter(function(ele){ &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return !!ele || ele == 0; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;}).length; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;} &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;return Object.getOwnPropertyNames(value).length; &nbsp;&nbsp; &nbsp;} &nbsp;&nbsp; &nbsp;return false; } 
 &nbsp; 
 &nbsp; 
 &lt;/script&gt; 
 </blockquote> 现在在测试一下刚才的例子? 
 <blockquote> 
 &lt;script type="text/javascript"&gt; 
 &nbsp; 
 var a = []; 
 a[50] = 50; 
 alert(count(a)); 
 &nbsp; 
 &lt;/script&gt; 
 </blockquote> 得到结果为2 &nbsp; 
 <blockquote> 
 &lt;script type="text/javascript"&gt; 
 &nbsp; 
 var a = []; 
 a['age'] = '18'; 
 a['sex'] = 'Male'; a['site'] = 'http://www.qSyz.net'; 
 alert(count(a)); 
 &nbsp; 
 &lt;/script&gt; 
 </blockquote> 得到结果为3. &nbsp; 
 <blockquote> 
 &lt;script type="text/javascript"&gt; 
 var a = {'age':30,'sex':'male'}; 
 alert(count(a)); 
 &nbsp; 
 &lt;/script&gt; 
 </blockquote> 得到结果为2 &nbsp; &nbsp; 补充: 如果是数组, 可以使用 var arr = [0, 1, 50]; var count = arr.filter(function(a)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;!!a; //注意判断条件 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}).length; 但是: 因为有个元素为0 , 获取的长度为2, 所以要留心判断条件 &nbsp; &nbsp; 后续补充 ... </td> 
 </tr> 
 </tbody> 
</table>

3.问题/补充

4.参考

<table> 
 <tbody> 
 <tr> 
 <td><a href="https://www.cnblogs.com/sunnywindycloudy/p/7382226.html" rel="nofollow">https://www.cnblogs.com/sunnywindycloudy/p/7382226.html</a>&nbsp; //js获取数组长度，对象成员个数、字符串数</td> 
 </tr> 
 </tbody> 
</table>

后续补充

...