天天看点

web开发 -3- JavaScript

简介:

  • 基于对象和事件驱动 并具有安全性能的脚本语言
  • 使用它的目的是与HTML超文本标记语言、Java脚本语言一起实现在一个网页中链接多个对象 与网络客户交互作用 从而可开发客服端的应用程序
  • 它是通过嵌入式或调入在标准的HTML语言中实现的

特点:

  • 动态的 可以直接对用户或客服端做出响应 无须经过web服务程序
  • 是一种脚本语言 本身提供了丰富的内部对象供设计人员使用
  • 是一种可以嵌入web网页中的解释性编程语言 其源代码在发往客户端执行之前不需进行编译 而是将文本格式的字符代码发送给客户 有浏览器解释执行
  • 变量声明 采用其弱类型 即变量在使用前不需作声明 而由解释器在运行时检查其数据类型
  • JavaScript的代码是一种文本字符格式 可以直接嵌入HTML文档中 并且可以动态装在
  • 使用< script >…< /script >来标识

JS的数据类型和变量

六种

主要:
	number :  数值数据类型 支持整数和浮点数 整数可以使正数、0、负数;
			   浮点数可以包含小数点 也可以包含一“e” 
			  (大小写均可 在科学计数法中表示为“10的幂”)
			   或同时包含这两项
	string:   字符串类型 字符串是用单引号或双引号说明的
			  (使用单引号来输入包含引号的字符串)
	object:   对象
	Boolean:  可能的Boolean值有true和false 这是两个特殊值 不能用作1和0
其他:
	null:     没有任何值 什么也不表示
	undefined:一个为underfined的值就是指在变量被创建后 
			   但未给该变量赋值以前所具有的值
           
  • 在JavaScript中变量用来存放脚本中的值 在需要用这个值的地方就可以用变量来代表 一个变量可以是一个数字 文本或其他一些东西
  • JavaScript是一种对数据类型变量要求不太严格的语言 所有不必声明每一个变量的类型 变量声明尽管不是必须的 但在使用变量之前先进行声明是一种好的习惯
可以使用var语句来进行变量声明 例如:
var men = true;       //men中存储的值为Boolean类型
           

变量命名:

JavaScript是一种区分大小写的语言 因此将一个变量命名为computer和将其命名为Computer 是不一样的

另外 变量名称的长度是任意的 但必须遵守以下规则:

  • 第一个字符必须是一个字母 (大小写均可) 或一个下划线_ 或一个美元符$
  • 后续的字符可以使字母 数字 下划线 或美元符
  • 变量名称不能是保留字
JS的语句及语法

JavaScript所提供的语句共分为6个大类 分别是:变量声明赋值语句;函数定义语句;条件和分支语句;循环语句;对象操作语句;注释语句。

变量声明,赋值语句

变量:没有固定值 可以改变的数

在JavaScript中使用var关键字声明变量

var 变量名称 [= 初始值]
Var a;
Var a,b,c;
var a = 32          //定义一个变量 且有初始值为32
           

条件和分支语句

if…else条件语句 :分支功能 如果其中的条件成立 则程序执行紧接着条件的语句或语句块 否则程序执行else中的语句或语句块

if(result == true)
	{
	reponse = "you are right!"
	}else
	reponse = "you are wrong!"
	}
           

switch分支语句:选择语句 根据一个变量的不同取值选择不同的处理方法

Switch(score){
Case 50:
	Result = " 悲哀呀,你挂科了";
	Break;
Case 60:
	Result = "很幸运,你勉强通过";
	Break;
Case 70:
	Result = "不错,还需要加油呀";
	Break;
Case 80:
	Result = "还能更进一步吗?"
	Break;
Case 90:
	Result ="高手呀,佩服佩服";
	Break;
	}
           

Break关键字用来跳出分支语句 直接跳出switch语句 不再进行下面的判断

当分支条件比较少时 if…else与switch都可以使用 在分支条件较多时使用switch最为有效

循环语句

实现重复计算或操作的语句 循环语句也是高级语言中常用语句之一

常用循环语句有 :for, for…in, while, do while.

for语句用于在执行次数一定的情况下 语法如下:

for(变量=开始值;变量<=结束值;变量=变量+步进值)
	{
	需要反复执行的语句;
}
           

for…in 语句与for语句有一点不同 它循环的范围是一个对象所有的属性或是一个数组的所有元素

for (变量 in 对象或数组)
{
要执行的语句...
}
           

while语句所控制的循环不断地测试条件 如果条件始终成立 则一直循环 直到条件不再成立

while(变量 <= 结束值)
{
要执行的语句...
}
           

do…while语句与while语句很相似 在判断之前先执行一次语句 然后判断是否符合指定条件 当条件符合时候接着在执行语句

var i = 0
do
{
document.write("已运行次数: " + i)
document.write("<br/>")
i = i+1
}
while(i<0)
           
do…while语句至少执行一次 而while语句则不然 当指定条件不成立时候 语句不被执行

函数定义语句

使用关键字function

function 函数名称 (函数所带的参数)
{
函数执行部分
}
           

return语句将结束函数并返回后面表达式的值 return语句的语法为:“return 表达式”

函数结束时可以没有return语句 但是只要遇到return语句函数就结束

对象操作语句

JavaScript是一种基于对象的编程语言 它为我们提供了丰富的对象 这就需要我们懂得如何去操作这些对象 这就是对象操作语句

常用的对象操作语句有:with, new, this

with:如果你想使用某个对象的许多属性或方法时 只要在with语句的() 中写出这个对象的名称 然后在下面的执行语句中直接写这个对象的属性名或方法名就可以了

with(对象名称)
{
执行语句
}
           

new语句是一种对象构造器 可以用new语句来定义一个新对象

新对象名称 = new 真正的对象名
例如:我们可以这样定义一个新的日期对象 : var cuur = new Date()
           

this运算符总是指向当前的对象

注释语句

单行注释: //

多行注释:

JS的对象及其属性和方法

JavaScript为我们提供了一些非常有用的常用内部对象和方法 用户不需要用脚本来实现这些功能 这正是基于对象编程的真正目的

字符串对象String

  • 获取字符串长度length属性
  • 截取字符串substring方法
  • 字符串替换replace方法
  • 大小写转换toLowerCase 和 toUpperCase

数组对象 Array

数组同字符串对象一样 是一种数据类型 通过数组可以把若干变量有序地组织起来 也是最常用的数据类型之一

有两种创建方式 其一通过数组直接创建 其二通过Array关键词进行创建

var a = [123,44, '3',22];     //直接创建数组
var b = new Array(6);      //6个元素数组
           

数组常用的属性方法有获取数组的长度、添加数组中的元素

同字符串一样 数组也是通过length函数获取长度的

Var a=['1','2','3','4','5']
Var b = a.length               // b=5
           

向数组中添加数据使用 unshift关键字操作

Var a=['1','2','3','4','5']
a.unshift(0);                //a = [0,1,2,3,4,5]
           
在JavaScript语言中 数值中值的数据类型可以不一致 这一点与其他语言有区别

日期和时间对象Date

var now = new Date();         //返回的是一个表示当前时间的对象
其他常用属性和方法:
getFullYear() :  返回对象中的年份部分 用四位数表示
getMonth() : 返回对象中的月份部分(从0开始计算)
getDate() : 放回对象所代表的一月中的第几天
getHours : 返回对象中的小时部分
getMinutes() : 返回对象中的分钟部分
getSeconds() :返回对象中的秒部分
getMilliseconds() : 返回对象中的毫秒部分
getTime() : 返回对象的内部毫秒表示
例:
var now = new Date();
var curryear = now.getFullYear()  //返回当前月份curryear=‘2019’
           

对象只是一种特殊的数据

JS的事件处理

事件是浏览器响应用户交互操作的一种机制 JavaScript的事件处理机制可以改变浏览器响应用户操作的一种方式 这样就开发出具有交互性并易于使用的网页

必须使用的事件有三类:

  • 引起页面这件跳转的事件 主要是超链接事件
  • 事件浏览器自己引起的事件
  • 事件在表单内部同界面对象的交互

界面事件包括Click(单击)、MouseOut(鼠标移出)、MouseOver(鼠标移过)、MouseDown(鼠标按下)等

单击事件 : οnclick= 函数或是处理语句

处理下拉列表: onchange = 函数或是处理语句

继续阅读