Web前端技术课件-5.Javascript语言_第1页
Web前端技术课件-5.Javascript语言_第2页
Web前端技术课件-5.Javascript语言_第3页
Web前端技术课件-5.Javascript语言_第4页
Web前端技术课件-5.Javascript语言_第5页
已阅读5页,还剩34页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

JavaScript语言学习导图5.1JavaScript简介5.1JavaScript简介JS是一种在浏览器中运行的解释性脚本语言。在html基础上,JS可以开发交互式Web网页。TIOBE编程语言排行榜5.1JavaScript简介JS是由ES(ECMAScript)、DOM(文档对象模型)、BOM(浏览器对象模型)组成。ECMAScript6.0(简称ES6)是JavaScript语言的下一代标准,已经在2015年6月发布。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言。Node.js是一个基于ChromeV8引擎的JavaScript运行环境,是让JS运行在服务端的开发平台,它使得JS成为与PHP、Python等服务端语言相似的语言。Node.js就只有ES,目前浏览器比较流行的版本就是ES6(ES2015)。5.2基本语法5.2.1代码书写规范区分大小写JavaScript语言是严格区分大小写的。一般来说,对于变量、函数以及事件的命名建议采用小写和大写组合的形式,例如studentId、getNumber、onClick等。代码格式每条功能执行语句的最后必须以分号结束,一个单独的分号也可以表示一条语句,叫做空语句。一行可以写一条语句,也可以写多条语句。代码注释单行注释,以两个斜杠//开头,后面跟上注释文字;另一种是多行注释,以符号/*作为起始,以*/作为结束,中间是待注释的内容,注释内容可以跨越多行。5.2.2标识符和保留字标识符标识符就是一个名称,主要用来命名程序中的常量、变量和函数等。在JS中,要求一个合法的标识符可以由字母、数字、下划线(_)和美元符号($)组成,但不能以数字开头,并且不能使用JavaScript中定义的保留字。。保留字保留字是指在程序中有特定含义,已成为编程语言语法体系的一部分字符,这些字符只能在JavaScript语法规定的场合下使用,而不能用作变量名、函数名等标识符。5.2.3常量与变量程序运行时,值可以改变的量为变量,值不变的量为常量常量声明:constname='Bill';变量声明:使用var关键词声明变量,可以同时声明多个变量vari,j,k;在声明变量的同时对其赋值vari=1,j=2,k=3;如果只是声明了变量,并未对其赋值,则其值默认为undefinedJS拥有动态类型,相同的变量名可用作不同的类型var现在已经不推荐使用了,因为会有变量提升等问题5.2.3常量与变量ES6新增了let命令,用来声明局部变量,它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。let声明变量letname='Bill';5.2.4数据类型JS采用了弱类型的方式,所以在声明变量时无需事先指定数据类型,可在使用或赋值时再确定其数据类型。在JS中数据类型主要分为值类型(基本类型)和引用类型两类,其中值类型又包括数字型、字符串型、布尔类型、空类型、未定义类型等;引用类型包括数组、函数、对象等类型。字符串是由Unicode字符、数字、标点符号等组成的序列,用单引号或双引号进行包含。字符串数据也可看成是一个String对象,可以通过String对象的属性和方法对字符串进行操作。数字型(Number)是最基本的数据类型,JS中不区分整数和浮点数,所有数字都是由浮点型来表示。5.2.4数据类型布尔数据类型只有两个取值:true或false。JavaScript中还有一些特殊的数据类型,包括转义字符、未定义值、空值等。处于未赋值状态的变量是undefined类型,表示未知状态,而null类型则表示变量被赋予空值,用于定义空或不存在的引用,如果引用一个没有定义的变量,同样也会返回null值。JS中还有一种特殊类型的数字常量NaN,表示非数字。5.3流程控制语句5.3流程控制语句JavaScript中提供了if条件判断、switch多分支、for循环、while循环、do…while循环、break、continue等7种流程控制语句。条件判断语句5.3流程控制语句循环语句5.4函数5.4.1函数的定义JavaScript使用关键字function定义函数,函数可以通过声明定义,也可以是一个表达式。函数一般定义在HTML文档的<head>部分,在<script>元素内部;函数也可以单独定义在外部的脚本文件中。函数定义语法格式5.4.2函数的调用JavaScript中,函数调用有三种方式:函数的直接调用、在事件响应中调用、通过链接调用。函数的直接调用是指直接使用函数名,使用具体的实际参数替换形式参数。在事件响应中调用,通过将函数与事件相关联完成事件响应的过程。在超链接标签中的href属性中使用“javascript:关键字”格式,通过链接调用函数。5.4.2函数的调用在事件响应中调用函数直接调用函数JS程序按照在HTML中出现的顺序逐行执行。但是函数体内的代码,不会立即执行,只有当所在函数被其它程序调用时,代码才会执行5.4.3常用内置函数JavaScript还提供了一些常用的内置函数5.5自定义对象5.5.1自定义对象的创建JavaScript提供了两种创建自定义对象的方法。一种称为字面量表示法,即手动的写出对象的内容来创建一个对象。5.5.1自定义对象的创建另外一种方法是使用new关键字创建对象。或者5.5.2对象成员的访问与操作当需要访问对象属性或方法,可以使用点(.),后面跟要访问的属性或方法即可。也可以用一个对象来做另一个对象成员的值,例如可以将person对象中的name属性值定义为一个对象。5.5.2对象成员的访问与操作还可以使用中括号访问对象的属性,例如person['age'],person['name']['first'],这种方式看起来更像是访问一个数组元素。有时需要判断一个对象有无属性,此时可以使用关键字in。5.6内置对象5.6.1Array对象Array对象是使用单独的变量名存储一连串相同或不同类型的数据。创建Array数组对象有两种方式创建数组访问数组:通过指定数组名以及索引号,可以访问某个特定的元素5.6.2String对象String对象用来保存和处理字符串变量。创建String对象很简单,直接使用newString即可,例如varstr1=newString("Thisisastring");5.6.3Math对象Math对象包含用来进行数学计算的各类属性和方法。Math和其他对象不同,它不是一个构造函数,它属于一个工具类不用创建对象。5.6.4Date对象Date对象用来获取日期和时间。创建Date对象的基本语法为:vardate=newDate(日期参数)。日期参数有几种情况:一是省略不写,此时获取系统当前日期和时间。二是采用格式为“月日,公元年时:分:秒”或“月日,公元年”的日期字符串,例如vardate=newDate("Apil1,202011:40:20")。第三种是一律以数值表示,格式为“公元年,月,日,时,分,秒”或“公元年,月,日”的形式,例如vardate=newDate(2020,4,1,11,40,20)。5.6.4Date对象5.7JavaScript脚本的编写5.7.1脚本直接嵌入在script元素中这种方式首先将<script>元素插入到<head></head>之间或者<body></body>之间,然后在<script></script>之间根据需要编写JavaScript脚本。该方式比较简单,在页面加载时,脚本即可运行。5.7.2在事件响应中嵌入和执行脚本为了避免在页面加载时直接执行脚本,可以将脚本编写为函数,在事件响应中触发执行。5.7.3脚本直接嵌入在script元素中将JavaScript代码编写为一个独立的以.js为扩展名的脚本文件,然后在页面中用script元素链接外部脚本文件。5.8JavaScript脚本的调试5.8.1使用alert方法调试脚本使用alert方法进行调试比较简单,直接在需要调试输出的地方输出字符串或变量即可,例如varname=”abc”;alert(name);。5.8.2使用console.log调试脚本新一代的浏览器,如Firefox、Ch

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论