1、JavaScript脚本语言 基本知识,目标,JavaScript简介 JavaScript与HTML网页 JavaScript基本语法 函数的使用 程序流程控制,6.1 JavaScript简介,为什么引入JavaScript,采用超链接技术只能提供一种静态的信息资源,缺少动态的客户端与服务器端的交互。因而在一段时间防碍了Internet技术的发展。而JavaScript的出现,无凝为Internet网上用户带来了一线生机。可以这样说,JavaScript的出现是时代的需求,是当今的信息时代造就了JavaScript。,2018/11/14,4,JavaScript给我们带了什么,JavaS
2、cript的出现,它可以使得信息和用户之间不仅只是一种显示和浏览的关系,而是实现了一种实时的、动态的、可交式的表达能力。从而使静态的HTML页面被可提供动态实时信息,并对客户操作进行反应的Web页面的取代。 JavaScript脚本正是满足这种需求而产生的语言。它深受广泛用户的喜爱的欢迎。它是众多脚本语言中较为优秀的一种,它与WWW的结合有效地实现了网络计算和网络计算机的蓝图。,2018/11/14,5,JavaScript是什么,JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java小
3、程序一起实现在一个Web页面中链接多个对象,与Web客户交互作用。从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷,它是Java与HTML折衷的选择,具有以下几个基本特点:,2018/11/14,6,脚本编写语言,2018/11/14,7,JavaScript是一种脚本语言,它采用小程序段的方式实现编程。像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个简易的开发过程。 它的基本结构形式与C、C+、VB、Delphi十分类似。但它不像这些语言一样,需要先编译,而是在程序运行过程中被逐行地解释。它与HTML
4、标识结合在一起,从而方便用户的使用操作。,基于对象的语言,2018/11/14,8,JavaScript是一种基于对象的语言,同时以可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。,简单性,2018/11/14,9,JavaScript的简单性主要体现在:首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计, 从而对于学习Java是一种非常好的过渡。其次它的变量类型是采用弱类型,并未使用严格的数据类型。,安全性,2018/11/14,10,JavaScript是一种安全性语言,它不允许访问本地的硬盘,并不能将数
5、据存入到服务器上,不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失。,动态性,2018/11/14,11,JavaScript是动态的,它可以直接对用户或客户输入做出响应,无须经过Web服务程序。它对用户的反映响应,是采用以事件驱动的方式进行的。所谓事件驱动,就是指在主页(Home Page)中执行了某种操作所产生的动作,就称为“事件”(Event)。比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。,跨平台性,2018/11/14,12,JavaScript是依赖于浏览器本身,与操作环境无关,只要能运行浏览
6、器的计算机,并支持JavaScript的浏览器就可正确执行。从而实现了“编写一次,走遍天下”的梦想。,网页交互性,2018/11/14,13,实际上JavaScript最杰出之处在于可以用很小的程序做大量的事。无须有高性能的电脑,软件仅需一个字处理软件及一浏览器,无须WEB服务器通道,通过自己的电脑即可完成所有的事情。 JavaScript语言可以做到回应使用者的需求事件 (如: form 的输入) ,而不用任何的网路来回传输资料,所以当一位使用者输入一项资料时,它不用经过传给服务器端 (server)处理,再传回来的过程,而直接可以被客户端 (client) 的应用程式所处理。,综上所述,J
7、avaScript是一种有较强生命力和发展潜力的脚本描述语言,它可以被直接嵌入到HTML文档中,供浏览器解释执行,直接响应客户端事件,并调用相应的处理方法,迅速返回处理结果并更新页面实现WEB交互性和动态的要求,同时将一部分工作交给客户端处理,将WEB服务器的资源消耗降到最低。,JavaScript能做什么,JavaScript脚本语言由于其效率高、功能强大等特点,在表单数据合法性验证、网页特效、交互式菜单、动态页面、数值计算等获得广泛的应用。,JavaScript和Java的区别,虽然JavaScript与Java有紧密的联系,但却是两个公司开发的不同的两个产品。 Java是SUN公司推出的
8、新一代面向对象的程序设计语言,特别适合于Internet应用程序开发; JavaScript是Netscape公司的产品,其目的是为了扩展Netscape Navigator功能,而开发的一种可以嵌入Web页面中的基于对象和事件驱动的解释性语言,它的前身是Live Script;,基于对象和面向对象,Java是一种真正的面向对象的语言,即使是开发简单的程序,必须设计对象。 JavaScript是种脚本语言,它可以用来制作与网络无关的,与用户交互作用的复杂软件。它是一种基于对象(Object Based)和事件驱动(Event Driver)的编程语言。因而它本身提供了非常丰富的内部对象供设计人
9、员使用。,解释和编译,两种语言在其浏览器中所执行的方式不一样。Java的源代码在传递到客户端执行之前,必须经过编译,因而客户端上必须具有相应平台上的仿真器或解释器,它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。 JavaScript是一种解释性编程语言,其源代码在发往客户端执行之前不需经过编译,而是将文本格式的字符代码发送给客户编由浏览器解释执行。,强变量和弱变量,两种语言所采取的变量是不一样的。 Java采用强类型变量检查,即所有变量在编译之前必须作声明。如: Integer x; String y; x=1234; x=4321; 其中X=1234说明是一个整数,Y=43
10、21说明是一个字符串。 JavaScript中变量声明,采用其弱类型。即变量在使用前不需作声明,而是解释器在运行时检查其数据类型,如: x=1234; y“4321“; 前者说明x为其数值型变量,而后者说明y为字符型变量。,代码格式不一样,Java是一种与HTML无关的格式,其代码以字节代码的形式保存在独立的文档中。 JavaScript的代码是一种文本字符格式,可以直接嵌入HTML文档中,并且可动态装载。编写HTML文档就像编辑文本文件一样方便。,嵌入方式不一样,在HTML文档中,两种编程语言的标识不同; JavaScript使用.来标识 Java使用.来标识。,JavaScript程序运行
11、环境,软件环境: Windows 95/98或其以上。 浏览器 用于编辑HTML文档的字符编辑器 硬件配置: 首先必须具备运行Windows 95/98或Windows NT的基本硬件配置环境。推荐: 基本内存32M。 CRT只少需要256颜色,分辨率在640X480以上。 CPU只少233以上。 鼠标和其它外部设置(根据需要选用)。,下面我们通过一个例子,编写第一个JavaScript程序。通过它可说明JavaScript的脚本是怎样被嵌入到HTML文档中的。举例:1.html,2018/11/14,23,2018/11/14,24,1.html,编写第一个JavaScript程序,如同HT
12、ML标识语言一样, JavaScript程序代码是一些可用字处理软件浏览的文本,它在描述页面的HTML相关区域出现。 在.之间就可加入JavaScript代码。 alert()是JavaScript的窗口对象方法,其功能是弹出一个具有OK对话框并显示()中的字符串。通过标识说明:若不认识JavaScript代码的浏览器,则所有在其中的标识均被忽略;若认识,则执行其结果。使用注释这是一个好的编程习惯,它使其他人可以读懂你的代码。,2018/11/14,25,6.2 JavaScript与HTML,为了运用JavaScript控制HTML页面上的对象,JavaScript的代码必须与HTML代码结
13、合在一起。,嵌入JavaScript代码的位置,之间 当脚本被调用时,或者当事件被触发时,脚本就会被执行。当你把脚本放置到head部分后,就可以确保在需要使用脚本之前,它已经被载入了。 之间 在页面载入时脚本就会被执行。当你把脚本放置于body部分后,它就会生成页面的内容。 两者混合使用,JavaScript代码与HTML代码常见的结合方式一般有两种:,将JavaScript直接嵌入HTML文档,基本语法:,举例: 例6.1.html,基本语法:-外部文件(*.js)的语法- ,2018/11/14,32,使用外部 JS 文件,举例: Myjs.js 例6.3.html,34,HTML表单标记
14、,网页中的表单用于创建: 问卷 注册信息 简答题 调查,表单在网页中用于向网站的 访问者请求信息,Form,表单的基本语法,基本语法:,举例: 例6.4.html,表单的input对象,基本语法:说明:text、password、checkbox、radio、image、 hidden、file、button、submit、resetname、value、checked,表2-11 标记的属性值,举例: 例6.5.html 3.html, 举例: 例6.6.html, 举例: 例6.7.html, 举例: 4.html,表单的select对象,基本语法:显示值1显示值2,下拉菜单 举例: 例6
15、.8.html 2.html 5.html,菜单列表 举例: 例6.9.html,表单的textarea对象,基本语法:,举例: 例6.10.html 6.html,表单对象的引用,语法: Document.表单名.对象名.属性举例: 例6.11.html,6.3 基本语法,编程术语,大小写敏感,JavaScript对大小写敏感,相同的字母,大小写不同,代表的意义也不同。 Name NAME name 写代码是一定要确保输入正确,数据类型,number JavaScript数值可以是整数和浮点值 整型值可以是正整数,负整数和 0。可以用 10 进制,8 进制和 16 进制来表示。在 JavaS
16、cript中大多数字是用十进制表示的。 浮点值为带小数部分的数。也可以用科学计数法来表示。这就是说,大写或小写“e”用来表示 10 的次方。 如45 3.45e2 0.01等。 NaN (不是数)。当对不适当的数据进行数学运算时使用,例如字符串或未定义值。 正无穷大。在JScript中如果一个正数太大的话使用它来表示。,53,数据类型,string 一个字符串值是排在一起的一串字母、数字和标点符号。字符串数据类型用来表示 JavaScript中的文本。脚本中可以包含字符串文字,这些字符串文字放在一对匹配的的单引号或双引号中。字符串中可以包含双引号,该双引号两边需加单引号,也可以包含单引号,该单
17、引号两边需加双引号。下面是字符串的示例: “Happy am I; from care Im free!“ “Avast, ye lubbers!“ roared the technician. “42“ 请注意,JavaScript中没有表示单个字符的类型(如 C+ 的 char)。要表示 JavaScript中的单个字符,应创建一个只包含一个字符的字符串。包含零个字符(“)的字符串是空(零长度)字符串。,54,boolean 尽管字符串和数字类型可以有无数不同的值,boolean 数据类型却只有两个值。它们是文字 true 和 false。Boolean值是一个真值,它表示一个状态的有效性
18、(说明该状态为真或假)。 null 表示什么也没有,它可以和任何类型进行安全的转换, undefined 声明变量后未赋值时的类型,方便后面使用 object 复杂的数据可以构成数据对象类型,可以把对象看成是一个命名好的容器,可以容纳数据(如该容器的某个属性值)以及对这些数据采取操作。,56,变量的声明,对于一个用var声明的变量,可以在声明时赋给它一个特殊的常量null。若声明了一个变量,但不给它任何值(包括null),那么这个变量确实存在,但是却处于未定义状态,其类型为undefined,这时如果直接引用,就会产生一个错误。例如,此用法是错误的:var abc;var def=5*abc;
19、变量的另一个重要属性就是变量的作用域。在JavaScript中同样有全局变量和局部变量。全局变量定义在所有函数之外,其作用范围是所有函数;而局部变量定义在函数内,只在该函数内有效。,变量 a、b 和 c 只能 在其各自的函数中 被访问,变量的作用域,脚本,函数function1 局部变量a,函数function2 局部变量b,函数function3 局部变量c,可由函数 1、函数 2 和函数 3 访问,全局变量 gg,全局变量不需要以 var 关键字进行声明,但局部变量则必须 以此关键字来声明,变量命名规则,变量的命名规则a)变量名必须以字母或下划线、$开始,其余字符可以是字母、数字、下划线等
20、。b)变量名中除下划线作为连字符外,不能有空格、“”、“”、“,”或其他符号。c)不能使用JavaScript中的关键字作变量名。注意: JavaScript区分字母大小写。,变量声明举例,Var a ; Var a , b , c ; Var a = 2 ; Var a = 2 , b = 5 ;,在JavaScript中,变量的类型由其值的类型来决定。a)在JavaScript中,变量可以用命令var作声明:如 var mytest;如 var mytest=”This is a book”;b)在JavaScript中,变量可以不作声明,而在使用时再根据数据的类型来确定其变量的类型。如:
21、x=100y=”125”xy=truecost=19.5 这里,X为整数,Y为字符串,XY为布尔型,COST为实型。,变量的类型,注释,语法:/这是单行注释 /*这是多行注释.*/,保留字和未来保留字,在JavaScript中定义了40多个关键字,也称保留字。这些保留字是JavaScript内部使用的,不能作为变量名、函数名、方法名和对象名。常用保留字参见课本。,表达式,表达式指具有一定值的、将常量、变量等由运算符按照一定的法则连接起来的式子。,63,运算符,运算符对一个或多个变量或值(操作数)进行运算,并返回一个新值 根据所执行的运算,运算符可分为以下类别: 算术运算符 逻辑运算符 赋值运算
22、符,算术运算符,逻辑运算符,思考: +x 与x+的区别,+号的用法: 1.数字相加 如:a=1+2; 2.链接字符串 如:a=a+b+c; +的用法: 1.如果不在赋值表达式中:i+ 同 +i 同 i=i+1; 2.如果在赋值表达式中:a=i+ 同 a=i;i+; a=+i 同 a=i+1;i+;,赋值运算符用“=”表示,是将内容或值传给变量。一般用于变量内容的设置。 X=5; x=5+x/2; 等 注意:“=”和“=”的区别 “=”与其他运算符的结合 X+=3 x-=3,赋值运算符,运算符的优先级,从高到低顺序为: 非运算符算术运算逻辑运算赋值运算 括号,71,语句,JavaScript程序
23、由若干语句组成; JavaScript语句包含若干表达式、关键词和运算符。 如:var hisname=“Mike”+”Jackson” ;,语句块,用括起来的一组JavaScript语句称为语句块 语句块作为一段单独的语句可以被其它JavaScript代码调用。 比如:函数 、选择语句、循环语句,程序流程控制,课程内容安排,JS控制语句概述 选择语句 if语句 、if-else语句 、if-else-if语句、switch语句 循环语句 for语句 、while语句 、do-while语句 、for-in语句、break和continue语句 异常处理语句 try-catch语句 、try-
24、catch-finally语句 、throw语句,JS控制语句概述,JavaScript中提供了多种用于程序流程控制的语句,这些语句分为选择和循环两大类 选择语句是指根据条件来选择一个任务分支的语句统称,实现分支程序设计 switch实现多路选择功能,在给定的多个选择中选择一个符合条件的分支来执行 在编程中有些指令需要重复执行很多遍,这就要编写大量的代码。而计算机则是专门用来快速完成重复和繁琐的工作,因此编程语言也就提供循环语句来减少重复指令的编写,if语句,if语句 生活中一个形象的例子,某人在看钟表上的时间,如果小于凌晨6点就决定继续睡,如果大于6点,就起床去上班 。编程中也有类似的问题,
25、此时可用if语句来描述之,其测试一个Boolean表达式,结果为真则执行某段程序。,if( ) / 条件语句 语句组 ; / 程序语句序列 ,if-else语句,if-else语句 if语句仅根据表达式的值决定是否执行某个任务,没有其它更多的选择,而if-else语句则提供双路选择功能。,if ( ) / 表达式成立时 语句组1; / 有效的程序语句 else / 表达式不成立时 语句组2; / 有效的程序语句 ,if-else-if语句,if-else-if语句 当有多个可供判断选择的条件时,单个if-else语句显然不能表达,于是有了if-else-if语句。严格的说if-else-if不
26、是单独的语句,而是由多个if-else组合而成,实现多路判断,if( ) 语句组1; else if( ) 语句组2; else 语句组3; ,switch语句,switch语句 用if-else语句实现多路选择结构使程序看起来不清晰,也不容易维护,于是可以选择switch语句代替之。switch实现多路选功能,在给定的多个选择中选择一个符合条件的分支来执行。,switch ( ) case : 语句组1; case : 语句组2; default: 语句组3; ,例5-4,循环语句,在编程中有些指令需要执行很多遍,这就要编写大量的代码。而计算机则是专门用来快速完成重复和繁琐的工作,因此编程语
27、言也就提供循环语句来减少重复指令的编写 将重复执行的动作放在循环语句中,计算机将根据条件执行之。 JavaScript的循环语句包括:for、while、do-while、for-in等4种,for语句,遇到重得执行指定次数的代码时,使用for循环比较合适 在执行for循环执行体中的语句前,有三个语句将得到执行,这三个语句的运行结果将决定是否要进入for循环体,for( 表达式1; 表达式2 ; 表达式3 ) 语句组; ,while语句,while循环在执行循环体前测试一个条件,如果条件成立则进入循环体,否则跳到循环后的第一条语句。 一些重复执行动作的情形比较简单时就不需要用for循环,可以使
28、用while循环代替,while( 条件表达式 ) 语句组; ,do-while语句,do-while语句先执行一遍循环体,循环体内的语句执行之后再测试一个条件表达式 。 如果表达式成立则继续执行下一轮循环,否则跳到do-while代码段后的第一条语句。,do 语句组; while( 条件表达式 );,for-in语句,for-in语句是for语句的一个变体,同样是for循环语句 for-in通常用于遍历某个集合的每个元素,比如数组由很多元素,其元素索引构成了一个集合,使用for-in语句可以遍历该集合,进而取得所有元素数据 。,for ( n in set) 语句组; ,break语句将无条
29、件跳出并结束当前的循环结构,continue语句的作用是忽略其后的语句并结束此轮循环和开始新的一轮循环,异常处理语句,程序运行过程中难免会出错,出错后的运行结果往往是不正确的,因此运行时出错的程序通常被强制中止。运行时的错误统称为异常 try-catch try-catch-finally throw,为了能在错误发生时得到一个处理的机会,JavaScript提供了异常处理语句,try-catch语句,try-catch是一个异常捕捉和处理代码结构,当try块中的代码发生异常时,将由catch块捕捉以及处理。,try tryStatements catch(exception) catchSt
30、atements ,try-catch-finally语句,try-catch-finally语句作用与try-catch语句一样,唯一的区别就是当所有过程执行完毕之后前者的finally块无条件被执行 throw语句 当多个结构嵌套时,处于里层try-catch语句不打算自己处理异常则可以将其抛出,父级try-catch语句可以接收到子级抛出的异常。,trytryStatements; catch( exception )handleStatements; finallyfianllyStatements; ,数组,课程内容安排,数组介绍 创建数组 数组元素的基本操作 数组对象常见的操作,数
31、组介绍,数组的概念 :JavaScript数组是指将多个数据编码存储、提供一致的存取方式的集合 。 与其它程序语言不同的是,JavaScript的数组元素的数据类型可以不相同。,实际开发中,总是面临大量数据存储的问题。JavaScript语言不像C/C+那样合适用于数据结构的设计,因此需要系统内部提供针对大量数据存储的工具,数组因此而产生。JavaScript数组的目标是能组织存储各种各样的数据,并且访问方式和其它语言一样,特点是能混合存储类型不相同的数据。,数组介绍,单维数组,与多维数组等效的数组,数组元素:是指存储在数组中并赋予唯一索引号的数据段 。 各元素的数据类型可以是任意有效的Jav
32、aScript数据类型,元素按添加进数组的顺序存储于数组中。 示意图如下:,创建数组,创建一个空数组 通过指定数组长度创建数组 通过指定数组元素创建数组 直接创建数组,创建数组,创建一个空数组 数组在创建时可以不包含任何元素数据,即空数组。创建后返回一个数组对象,使用该对象可以往数组中添加元素。语法如下:上述语句将创建一个空数组。变量Obj引用创建后的数组对象,通过此变量可以操作数组,Array()为数组对象的构造函数。,var Obj = new Array();,创建数组,通过指定数组长度创建数组 在创建数组时可以指定数组的元素长度,通过这种方式可以创建一个有指定元素个数的数组对象 。语法
33、如下: Size指明新建的数组有多少个元素。数组对象的length将被设置为Size,仅指定长度但没有实际填充元素及其数据的数组将得不到数据存储空间,var Obj = new Array( Size );,创建数组,通过指定数组元素创建数组 新建的数组将包含创建时指定的元素,通常用在数据已经准备就绪的场合。语法如下:,var Obj = new Array( 元素1, 元素2, , 元素N );,创建数组演示:数组善于将每个独立的数据组织起来,提供一致的访问方式。现在创建一个数组用于保存“Peter”、“Tom”、“Vicky”和“Jet”这几个学生的名字 。,创建数组演示,01 02 通过
34、指定元素创建数组 03 / 脚本程序开始 04 var students = new Array( “Peter“, “Tom“, “Vicky“, “Jet“ ); 05 for( n in students ) / 逐个输出数组中的名字 06 07 document.write( studentsn + “ “ );/ 将名字写入当前文档流 08 09 10 ,直接创建数组 JavaScript创建数组的另一种简便的方式是使用“”运算符直接创建,数组的元素也是创建时被指定。这种方法的目标也是创建数组,与前面的方法相比仅仅是语法上的不同 。,var Obj = 元素1, 元素2, 元素3,
35、, 元素N ;,数组元素的基本操作,读取数组元素 添加数组元素 删除数组元素 数组元素的个数,以下是最基本的数组操作,我们在使用数组时基本上都涉及到, 后面我们将对它们逐一进行讲解。,提示:尽管有很多种创建方式,但通常使用其中一种就足够。,数组元素的基本操作,读取数组元素 读取数组元素最简单的方法就是使用“”运算符。使用“”运算符可以一次读取一个数组元素,语法如下: 目标元素通常由下标索引号决定,例如读取第一个元素为“数组名0”,依此类推 下面的代码从一个填有商品名字数组中读出第二种商品的名字。,数组名下标索引;,var products = new Array( “洗衣粉”, “香皂”, “
36、洗洁精” ); / 商品列表 var product = products 1 ; / 取出第二种商品,数组元素的基本操作,添加数组元素 JavaScript的数组可以动态添加新元素,也可以动态删除原有的元素,下一小节讲解如何删除。添加新元素通常使用Array对象的push方法,push方法是将新元素添加到数组的尾部。使用unshift可以将指定个数的新元素插入数组的开始位置,形成新的数组 ,下面是添加元素的一般形式: 也可以使用“”运算符指定一个新下标来添加新元素,新元素添加到指定的下标处。如果指定的下标超过数组的长度,数组将被扩展为新下标指定的长度。,var students = new
37、Array(); / 创建一个没有任何元素的数组 students.push( “Lily” ); / 将Lily的名字添加到数组中,数组元素的基本操作,删除数组元素 通常使用delete运算符删除一个指定的元素,如果需要删除全部元素只需要删除数组对象即可。使用语法如下:例如,使用数组作为学生名单,现要删除数组中第一个元素,代码如下:,delete 数组名下标;,var names = Array( “李莉”, “杨杨” ); / 有两个名字的名单 delete names0; / 删除第一名字“莉莉”,数组元素的基本操作,数组元素的个数 数组对象的length(长度)属性指示了数组元素的个数
38、。 通过设定length属性可以指定数组的长度。 在得知长度情况下可以方便的遍历整个数组,读取数组元素个数信息的方法如下代码所示:尽管指定了数组的length属性,真正的有效元素只包含已经存入数据的元素,其它没有真正填充数据的元素仍然为空。,var Obj = new Array( 1, 2, 3 ); var count = Obj.length;,数组对象常见的操作,将数组转换为字符串 toString方法将数组表示为字符串,各个元素按顺序排列组合成为字符串返回 。radix为可选项参数,表示进制。当对象是数字对象时,该参数起作用。对象名是数组对象变量名,方法执行后各元素以“,”隔开按顺序
39、加入字符串中 。 将数组元素连接成字符串 可以使用join方法将各元素组合为字符串,连接符号由用户指定。语法如下:分隔符:必选项,是一个字符串串对象,作为各元素间的分隔字符串。,对象名.toString( radix );,数组名.join(分隔符);,数组对象常见的操作,在数组尾部添加元素 push方法一次可以添加单个元素或多个元素到数组末端。使用语法如下: 元素:可选项,可以是一个或多个JavaScript对象,使用“,”分隔。,数组名.push( 元素1, 元素2, , 元素N );,删除数组的最后一个元素 pop方法的作用是移除数组末尾的一个元素。前面讲过使用delete运算符删除指定
40、的元素,与delete不同,pop方法删除最后一个元素后还将其返回。 语法如下:,数组名.pop();,数组对象常见的操作,移除数组顶端的元素 pop方法是移除数组末端的一个元素,而shift方法正好相反,其移除数组的第一个元素并将其返回。该方法执行后数组剩下的元素向前移动,下标索引号重新调整从0开始按顺序赋予所有元素。Shift的语法如下: 在大家所熟知的基本数据结构中,队列非常有用,其遵循选进先出(FIFO)的规则,与堆栈不同。shift和push方法结合使用,可以将数组当成队列使用。,数组名.shift( );,数组对象常见的操作,在数组顶端插入元素 unshift是将元素插入数组的首部
41、。一次可以插入单个或多个元素,所有元素按顺序插入,操作完成后返回新数组的引用。语法如下。:unshift方法的使用与前面讲过的各方法一样。如果不计较元素插入的位置,则推荐使用push方法。因为unshift方法将引发所有下标的改动,可能会影响依靠下标才能准确进行的计算。,数组名.unshift( 元素1, 元素2, 元素3, , 元素N );,数组对象常见的操作,添加元素并生成新数组 concat方法可以将多个数组的元素连接一起成为新的数组,新数组中的元素按连接时的顺序排列。当需要合并多个数组时,此方法比较方便。语法如下:item:可选项,要连接到“数组名”引用的数组末尾的其它项目。可以是数组
42、也可以是单个数组元素,或者是其它JavaScript对象。,数组名.concat( item1, item2, item3 , , itemN );,数组对象常见的操作,删除、替换或插入数组元素 splice方法的作用是,从一个数组中移除一个或多个元素。剩下的元素组成一个数组,移除的元素组成另一个数组并返回它的引用。同时,原数组可以在移除的开始位置处顺带插入一个或多个新元素,达到修改替换数组元素的目的。 start:必选项,表示从数组中剪切的起始位置下标索引号。 deleteCount:必选项,表示将从数组中切取的元素的个数。 item:可选项,表示切取时插入原数组切入点开始处的一个或多个元素
43、,要求为有效的JavaScript,数组名. splice( start, deleteCount, item1 , item2 , . . . , itemN );,数组对象常见的操作,获取数组中的一部分元素 slice方法的作用是,获取指定下标索引区间中的元素作为新数组返回.End:slice方法一直复制到end所指定的元素,但是不包含该元素.,数组名. slice( start,end);,数组对象常见的操作,颠倒数组元素的顺序 可以使用reverse方法将一个Array对象中所有元素的次序反转,然后返回元素顺序反转后的Array对象的引用。,数组名.reverse( );,对数组元素进
44、行排序 Array对象的sort方法可以将一个数组中的所有元素排序。执行时先将调用该方法的数组中的元素按用户指定的方法进行排序,排序后的所有元素构成一个新数组并返回之。通常用来对数据排序,语法如下:,数组名.sort( sortfunction ),数组对象常见的操作,sortfunction:可选项。用来确定元素顺序的函数的名称。如果这个参数被省略,那么元素将按照ASCII字符顺序进行升序排列。 负值:表示传给sortfunction两个实参中,第一个的值比第二个的小。 零:表示传给sortfunction两个实参的值相等。 正值:表示传给sortfunction两个实参中,第一个的值比第二个的大。,结束语,硬爬过那道坎后,你会发现原来的挑战主要是来自已的内心。,