JavaScript动态网页设计 课件 2-1 数组定义及常用方法

项目2数组及其常用方法主讲：***2024年1月2日JavaScript动态网页设计1子项目2024年1月2日JavaScript动态网页设计2学习任务

任务1数组的创建及赋值

任务2数组的访问与修改

任务3常用数组操作函数2024年1月2日JavaScript动态网页设计3任务1数组的创建及赋值

数组就是某类数据的集合，数组的类型可以是整形、字符串，甚至是对象。JavaScript不支持多维数组，因为数组里面可以包含对象。数组对象的作用是：使用单独的变量名来存储一系列的值。数组有多种创建及赋值的方法，最常用的有以下三种：（1）使用构造函数（2）对数组直接赋值（3）当无法提前预知数组最终元素个数时，可声明不知道个数的数组2024年1月2日JavaScript动态网页设计41、使用构造函数vararray1=newArray();//空数组vararray2=newArray(5);//指定数组长度vararray3=newArray(“a”,“b”,“c”);//定义并赋值2、对数组直接赋值vararray4=["a","b","c"];3、当无法提前预知数组最终元素个数时，可声明不知道个数的数组varfruit=newArray();fruit[0]="Apple";fruit[1]="Orange";fruit[2]="Pear";2024年1月2日JavaScript动态网页设计5任务2数组的访问与修改1、通过指定数组名以及索引号码，可以访问某个特定的元素document.write(fruit[1]);即可输出：Orange2、如需修改已有数组中的值，只要向指定下标号添加一个新值即可fruit[1]="Cherry";此刻上面的语句：document.write(fruit[1]);将输出：Cherry3、获取数组长度Javascript的数组不需要预先设定长度，会自己进行扩展，“数组名.length”会返回元素个数。2024年1月2日JavaScript动态网页设计61、push():将一个或多个新元素添加到数组未尾，并返回数组新长度: arrayObj.push([item1[,item2[,...[,itemN]]]]);push()方法可以把它的参数顺序添加到ayyayObj的尾部。它直接修改arrayObj,而不是创建一个新的数组。范例2-1：程序代码如下：<script>vararrayNum=[1,2];varlen=arrayNum.push(3,4);alert("长度为："+len+"--"+arrayNum);</script>运行效果：任务3常用数组操作函数对数组操作的常用函数包括对数组元素的增加、删除、截取和合并等操作。2024年1月2日JavaScript动态网页设计72、unshift():将一个或多个新元素添加到数组开始，数组中的元素自动后移，返回数组新长度: arrayObj.unshift([item1[,item2[,...[,itemN]]]]);范例2-2：程序代码如下：<script>vararrayNum=[1,2];varlen=arrayNum.unshift(3,4);alert("长度为："+len+"--"+arrayNum);</script>运行效果：2024年1月2日JavaScript动态网页设计83、shift():用于把数组的第一个元素从数组中删除，并返回该元素的值： arrayObj.shift();如果数组是空的，那么shift()方法将不进行任何操作，返回Undefined值。范例2-3：程序代码如下：<script>varfruit=newArray();fruit[0]="Apple";fruit[1]="Orange";fruit[2]="Pear";alert(fruit+"\n"+fruit.shift()+"\n"+fruit);</script>运行效果：2024年1月2日JavaScript动态网页设计94、pop():用于把数组的最后一个元素从数组中删除，并返回该元素的值： arrayObj.pop();范例2-4：程序代码如下：<script>varfruit=newArray();fruit[0]="Apple";fruit[1]="Orange";fruit[2]="Pear";alert(fruit+"\n"+fruit.pop()+"\n"+fruit);</script>运行效果：2024年1月2日JavaScript动态网页设计10返回5、slice():以数组的形式返回数组的一部分，即截取数组的一部分：arrayObj.slice(start,[end]);

注意：数组截取时不包括end对应的元素，如果省略end将复制start之后的所有元素。范例2-5：程序代码如下：<script>vararr1=newArray();arr1[0]="one";arr1[1]="two";arr1[2]="three";arr1[3]="four";arr1[4]="five";vartemp=arr1.slice(1,2);alert(temp);</script>运行效果：2024年1月2日JavaScript动态网页设计116、concat():将多个数组（也可以是字符串，或者是数组和字符串的混合）连接为一个数组，返回连接好的新的数组:arrayObj.concat([item1[,item2[,...[,itemN]]]]);

该方法不会改变现有的数组，返回被连接数组的副本。该副本数组将所有item参数添加到arrayObj中，如果要进行concat()操作的参数是数组，那么添加的是数组中的元素，而不是数组。范例2-6：程序代码如下：<script>vararr1=newArray(3);arr1[0]="one";arr1[1]="two";arr1[2]="three";vararr2=newArray(3);arr2[0]="four";arr2[1]="five";arr2[2]="six";vartemp=arr1.concat(arr2);alert(temp);</script>2024年1月2日JavaScript动态网页设计12运行效果：2024年1月2日JavaScript动态网页设计137、sort():字面上对数组元素排序： sort(item1,item2[,...[,itemN]]]]);范例2-7：程序代码如下：<script>vararr=newArray(6);arr[0]="George";arr[1]="Jo