JavaScript第7章

联系方式：北京源智天下科技有限公司第七讲：数组讲师：杨贵e-mail:[e-mail]1-2北京源智天下科技有限公司联系方式：课程内容安排•数组介绍•创建数组•数组元素的基本操作•数组对象常见的操作1-3北京源智天下科技有限公司联系方式：数组介绍•数组的概念：JavaScript数组是指将多个数据对象编码存储、提供一致的存取方式的集合。–与其它程序语言不同的是，JavaScript的数组元素的数据类型可以不相同。实际开发中，总是面临大量数据存储的问题。JavaScript语言不像C/C++那样合适用于数据结构的设计，因此需要系统内部提供针对大量数据存储的工具，数组因此而产生。JavaScript数组的目标是能组织存储各种各样的数据，并且访问方式和其它语言一样，特点是能混合存储类型不相同的数据。•数组元素：是指存储在数组中并赋予唯一索引号的数据段。–各元素的数据类型可以是任意有效的JavaScript数据类型，元素按添加进数组的顺序存储于数组中。示意图如下：1-4北京源智天下科技有限公司联系方式：数组介绍•单维数组•与多维数组等效的数组1-5北京源智天下科技有限公司联系方式：创建数组•创建一个空数组•通过指定数组长度创建数组•通过指定数组元素创建数组•直接创建数组1-6北京源智天下科技有限公司联系方式：创建数组•创建一个空数组–数组在创建时可以不包含任何元素数据，即空数组。创建后返回一个数组对象，使用该对象可以往数组中添加元素。语法如下：–上述语句将创建一个空数组。变量Obj引用创建后的数组对象，通过此变量可以操作数组，Array()为数组对象的构造函数。varObj=newArray();1-7北京源智天下科技有限公司联系方式：创建数组•通过指定数组长度创建数组–在创建数组时可以指定数组的元素长度，通过这种方式可以创建一个有指定元素个数的数组对象。语法如下：–Size指明新建的数组有多少个元素。数组对象的length将被设置为Size，仅指定长度但没有实际填充元素及其数据的数组将得不到数据存储空间varObj=newArray(Size);1-8北京源智天下科技有限公司联系方式：创建数组•通过指定数组元素创建数组–新建的数组将包含创建时指定的元素，通常用在数据已经准备就绪的场合。语法如下：varObj=newArray(元素1,元素2,…,元素N);•创建数组演示：数组善于将每个独立的数据组织起来，提供一致的访问方式。现在创建一个数组用于保存“Peter”、“Tom”、“Vicky”和“Jet”这几个学生的名字。1-9北京源智天下科技有限公司联系方式：!--文档体--02h1通过指定元素创建数组/h1!--标题--03scriptlanguage=javascript//脚本程序开始04varstudents=newArray(Peter,Tom,Vicky,Jet);//通过指定元素创建数组05for(ninstudents)//逐个输出数组中的名字06{07document.write(students[n]+);//将名字写入当前文档流中08}09/script!--脚本程序结束--10/body•直接创建数组–JavaScript创建数组的另一种简便的方式是使用“[]”运算符直接创建，数组的元素也是创建时被指定。这种方法的目标也是创建数组，与前面的方法相比仅仅是语法上的不同。varObj=[元素1,元素2,元素3,…,元素N];1-10北京源智天下科技有限公司联系方式：数组元素的基本操作•读取数组元素•添加数组元素•删除数组元素•数组元素的个数以下是最基本的数组操作，我们在使用数组时基本上都涉及到，后面我们将对它们逐一进行讲解。提示：尽管有很多种创建方式，但通常使用其中一种就足够。1-11北京源智天下科技有限公司联系方式：数组元素的基本操作•读取数组元素–读取数组元素最简单的方法就是使用“[]”运算符，此运算符在第四章已经讲过。使用“[]”运算符可以一次读取一个数组元素，语法如下：–目标元素通常由下标索引号决定，例如读取第一个元素为“数组名[0]”，依此类推–下面的代码从一个填有商品名字数组中读出第二种商品的名字。数组名[下标索引];varproducts=newArray(“洗衣粉”,“香皂”,“洗洁精”);//商品列表varproduct=products[1];//取出第二种商品1-12北京源智天下科技有限公司联系方式：数组元素的基本操作•添加数组元素–JavaScript的数组可以动态添加新元素，也可以动态删除原有的元素，下一小节讲解如何删除。添加新元素通常使用Array对象的push方法，push方法是将新元素添加到数组的尾部。使用unshift可以将指定个数的新元素插入数组的开始位置，形成新的数组,下面是添加元素的一般形式：–也可以使用“[]”运算符指定一个新下标来添加新元素，新元素添加到指定的下标处。如果指定的下标超过数组的长度，数组将被扩展为新下标指定的长度。varstudents=newArray();//创建一个没有任何元素的数组students.push(“Lily”);//将Lily的名字添加到数组中1-13北京源智天下科技有限公司联系方式：数组元素的基本操作•删除数组元素–通常使用delete运算符删除一个指定的元素，如果需要删除全部元素只需要删除数组对象即可。使用语法如下：–例如，使用数组作为学生名单，现要删除数组中第一个元素，代码如下：delete数组名[下标];varnames=Array(“李莉”,“杨杨”);//有两个名字的名单deletenames[0];//删除第一名字“莉莉”1-14北京源智天下科技有限公司联系方式：数组元素的基本操作•数组元素的个数–数组对象的length（长度）属性指示了数组元素的个数。–通过设定length属性可以指定数组的长度。–在得知长度情况下可以方便的遍历整个数组，读取数组元素个数信息的方法如下代码所示：–尽管指定了数组的length属性，真正的有效元素只包含已经存入数据的元素，其它没有真正填充数据的元素仍然为空。varObj=newArray(1,2,3);varcount=Obj.length;1-15北京源智天下科技有限公司联系方式：数组对象常见的操作•将数组转换为字符串–toString方法将数组表示为字符串，各个元素按顺序排列组合成为字符串返回。–radix为可选项参数，表示进制。当对象是数字对象时，该参数起作用。对象名是数组对象变量名，方法执行后各元素以“，”隔开按顺序加入字符串中。•将数组元素连接成字符串–可以使用join方法将各元素组合为字符串，连接符号由用户指定。语法如下：–分隔符：必选项，是一个字符串串对象，作为各元素间的分隔字符串。对象名.toString([radix]);数组名.join(分隔符);1-16北京源智天下科技有限公司联系方式：数组对象常见的操作•在数组尾部添加元素–push方法一次可以添加单个元素或多个元素到数组末端。使用语法如下：–元素：可选项，可以是一个或多个JavaScript对象，使用“，”分隔。数组名.push([元素1,[元素2,[…,[元素N]]]]);•删除数组的最后一个元素–pop方法的作用是移除数组末尾的一个元素。前面讲过使用delete运算符删除指定的元素，与delete不同，pop方法删除最后一个元素后还将其返回。语法如下：数组名.pop();1-17北京源智天下科技有限公司联系方式：数组对象常见的操作•移除数组顶端的元素–pop方法是移除数组末端的一个元素，而shift方法正好相反，其移除数组的第一个元素并将其返回。该方法执行后数组剩下的元素向前移动，下标索引号重新调整从0开始按顺序赋予所有元素。Shift的语法如下：–在大家所熟知的基本数据结构中，队列非常有用，其遵循选进先出（FIFO）的规则，与堆栈不同。shift和push方法结合使用，可以将数组当成队列使用。数组名.shift();1-18北京源智天下科技有限公司联系方式：数组对象常见的操作•在数组顶端插入元素–unshift是将元素插入数组的首部。一次可以插入单个或多个元素，所有元素按顺序插入，操作完成后返回新数组的引用。语法如下。：–unshift方法的使用与前面讲过的各方法一样。如果不计较元素插入的位置，则推荐使用push方法。因为unshift方法将引发所有下标的改动，可能会影响依靠下标才能准确进行的计算。数组名.unshift([元素1,[元素2,[元素3,[…,[元素N]]]]]);1-19北京源智天下科技有限公司联系方式：数组对象常见的操作•添加元素并生成新数组–concat方法可以将多个数组的元素连接一起成为新的数组，新数组中的元素按连接时的顺序排列。当需要合并多个数组时，此方法比较方便。语法如下：–item：可选项，要连接到“数组名”引用的数组末尾的其它项目。可以是数组对象也可以是单个数组元素，或者是其它JavaScript对象。数组名.concat([item1,[item2,[item3,[…,[itemN]]]]]);1-20北京源智天下科技有限公司联系方式：数组对象常见的操作•删除、替换或插入数组元素–splice方法的作用是，从一个数组中移除一个或多个元素。剩下的元素组成一个数组，移除的元素组成另一个数组并返回它的引用。同时，原数组可以在移除的开始位置处顺带插入一个或多个新元素，达到修改替换数组元素的目的。–start：必选项，表示从数组中剪切的起始位置下标索引号。–deleteCount：必选项，表示将从数组中切取的元素的个数。–item：可选项，表示切取时插入原数组切入点开始处的一个或多个元素，要求为有效的JavaScript数组名.splice(start,deleteCount,[item1[,item2[,...[,itemN]]]]);1-21北京源智天下科技有限公司联系方式：数组对象常见的操作•删除、替换或插入数组元素–splice方法的作用是，从一个数组中移除一个或多个元素。剩下的元素组成一个数组，移除的元素组成另一个数组并返回它的引用。同时，原数组可以在移除的开始位置处顺带插入一个或多个新元素，达到修改替换数组元素的目的。–start：必选项，表示从数组中剪切的起始位置下标索引号。–deleteCount：必选项，表示将从数组中切取的元素的个数。–item：可选项，表示切取时插入原数组切入点开始处的一个或多个元素，要求为有效的JavaScript数组名.splice(start,deleteCount,[item1[,item2[,...[,itemN]]]]);1-22北京源智天下科技有限公司联系方式：数组对象常见的操作•颠倒数组元素的顺序–可以使用reverse方法将一个Array对象中所有元素的次序反转，然后返回元素顺序反转后的Array对象的引用。数组名.reverse();•对数组元素进行排序–Array对象的sort方法可以将一个数组中的所有元素排序。执行时先将调用该方法的数组中的元素按用户指定的方法进行排序，排序后的所有元素构成一个