Javascript知识【JS数组】重点

柔情只为你懂 2023-10-01 23:22 1阅读 0赞

### 1，JS数组【重点】 ###

#### 1.1：四种定义方式 ####

目标：通过学习JS数组，掌握JS中多条目数据的保存方式。

路径：1，四种定义方式 2，遍历方式

第一种：var arr = \[1,2,3,"a",true\]

第二种：var arr = new Array();

第三种：var arr = new Array(4);

第四种：var arr = new Array("a","b",true)

#### 1.2：遍历方式 ####

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:492.65pt;"> &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;meta charset="UTF-8"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;title&gt;Title&lt;/title&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;script&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var arr = [10,11,12,13]; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//两种遍历方式 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//普通for循环遍历：(适用于所有数组) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for (var i = 0; i &lt;arr.length ; i++) { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(arr[i]); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log("-------"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//for..in遍历：类似于java的增强for循环 （适用于自定义数组） &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for (var i in arr){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(arr[i]); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log("-------"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//以下建议使用普通for循环 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var inputArr = document.getElementsByTagName("input"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for (var i in inputArr){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(arr[i]); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;input/&gt;&lt;input/&gt;&lt;input/&gt; &lt;/body&gt; &lt;/html&gt; </td> 
 </tr> 
 </tbody> 
</table>

小结：

**普通for循环：适用于所有数组**

**for(var i = 0;i<数组.length;i++)\{**

**数组\[i\];**

**\}**

**for..in循环：适用于自定义数组**

**for(var i in 数组)\{**

**数组\[i\];**

**\}**

扩展：

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:492.65pt;"> &lt;script&gt; &nbsp;&nbsp;&nbsp;&nbsp;//1、数组扩容：理解为用一个扩一个。 如果使用的索引不存在，就将当前索引 ~ 使用索引全部进行依次创建 &nbsp;&nbsp;&nbsp;&nbsp;var arr = new Array();//0 &nbsp;&nbsp;&nbsp;&nbsp;arr[0] = 10;//1 &nbsp;&nbsp;&nbsp;&nbsp;arr[9] = 90;//因为索引1、2、3、4、5、6、7、8、9都不存在，依次创建。其他未赋值的索引元素，默认值undefined &nbsp;&nbsp;&nbsp;&nbsp;//alert(arr.length);//10 &nbsp;&nbsp;&nbsp;&nbsp;//alert(arr); &nbsp;&nbsp;&nbsp;&nbsp;//2、数组属性：理解为可以自定义赋值的键值对 &nbsp;&nbsp;&nbsp;&nbsp;var arr2 = new Array(); &nbsp;&nbsp;&nbsp;&nbsp;arr2[0] = 10; &nbsp;&nbsp;&nbsp;&nbsp;arr2[1] = 20; &nbsp;&nbsp;&nbsp;&nbsp;arr2["username"]="爱吃豆的土豆"; &nbsp;&nbsp;&nbsp;&nbsp;arr2["age"]=18; &nbsp;&nbsp;&nbsp;&nbsp;alert(arr2);//10、20 &nbsp;&nbsp;&nbsp;&nbsp;alert(arr2["username"]);//爱吃豆的土豆 &nbsp;&nbsp;&nbsp;&nbsp;//10，20 &nbsp;&nbsp;&nbsp;&nbsp;for (var i = 0; i &lt;arr2.length ; i++) { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(arr2[i]); &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;console.log("------"); &nbsp;&nbsp;&nbsp;&nbsp;//10,20，爱吃豆的土豆,18 &nbsp;&nbsp;&nbsp;&nbsp;for(var i in arr2){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(arr2[i]); &nbsp;&nbsp;&nbsp;&nbsp;} &lt;/script&gt; </td> 
 </tr> 
 </tbody> 
</table>