1.简介
js是一种基于对象和事件驱动的并具有相对安全性的客户端脚本语言。也是一种广泛用于web客户端开发的脚本语言,常用来给html网页添加动态功能,如响应用户的各种操作。主要的目的是为了解决服务器端语言遗留的速度问题,为客户提供更流畅的浏览效果。
2.javaScript的特点
1)是解释性语言:所有的语言都必须转换为机器语言,也就是程序员写出的代码,要翻译为机器语言才可以用。
2)语法结构与java和c++ 十分的相似。
3)基于对象的语言
4)跨平台性:只与浏览器有关,与操作环境无关
3.优缺点
优点:
1)在客户端进行 数据验证,节省服务器资源
2)使网页更加友好
3) 支持分布式的运算和处理(客户端),不需要网络和服务器的参与
缺点:
1)浏览器兼容性问题
2)不能读写打开和保存计算机上的文件
4.引入javaScript三种方式:
1)使用<Script></Script>标签内部样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js使用方式2:内部js</title>
<script type="text/javascript">
//声明一个函数(整个文档都可以使用)
function surprise() {
alert('恭喜你中了一百万')/*弹出框*/
}
</script>
</head>
<body>
<input type="button" value="点击有惊喜" οnclick="surprise()"><!--调用函数-->
<input type="button" value="点击" οnclick="surprise()">
</body>
</html>
2)使用外部js文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js使用方式3:外部js</title>
<!--很多html页面都可以调用js4.js页面-->
<script src="../../js/js4.js" type="text/javascript" charset="utf-8">
</script>
</head>
<body>
<input type="button" value="点击" οnclick="test()">
</body>
</html>
3)直接写在HTML标签中的行内样式。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js使用方式1:行内js</title>
</head>
<body>
<input type="button" value="点击有惊喜" οnclick="javascript:alert('哈哈哈哈')">
<!--onclick:点击触发一个事件,alert:弹出一个对话框-->
</body>
</html>
5.js语法:
1)区分大小写2)注意变量,函数等命名规范
3)每行代码以分号结束
6.数据类型与变量
1)全局变量与局部变量
局部:指的的是在特定的区域块内使用,全局是在整个区域可以使用
在函数的外部:加var和不加var 都是全局变量
在函数的内部,加var是局部变量,不加var 是全局变量
在函数外部定义一个全局变量和在函数内部定义一个相同的全局变量,在函数外部,使用的话,函数内部的全局变量会覆盖函数外部的全局变量。
2)数据类型
A.基本类型:数字类型、字符串类型、布尔类型
a.数字类型 (number):js中的所有数字类型均为浮点类型
基本运算符:+、-、*、/、%、Math对象
特殊值:NaN、Infinity等
判断函数:isNaN()和isFinite()
可以使用typeof运算符查看数据类型
b.字符串类型(string):用单引号或双引号括起来,在js与html一起使用的时候建议使用单引号。
常用属性与方法:
加号:+、 长度:length
方法:charAt(i)、substring(i、j)、substr(i、j)、indexOf(i、j)、split()c. 布尔值(boolean):使用true和false
转换(boolean转换常常是自动进行的):
数字环境中:true -> 1 、 false -> 0
0 -> false 、非 数 字 -> true
字符串环境:
true -> "true" false -> "false "
空字符串 -> false 、 非空字符串 -> true
其他环境:
null 、 undefined 转 换 为 false
非空对象转换为 trueB.复合类型:对象(对象、函数、数组等)
注:函数是对象、对象与数组相似但不相同
a.对象(object):js中对象是已命名的数据的集合(即数值有名字,好似键值对。这些数据即为属性,数据名为属性名)
利用构造方法创建对象:->new语法
->一旦创建了对象就可以随意的为其添加属性
对象的直接量JSON(JavaScript Object Notation)
var o = {}; //Object对象
var o = {
name:"张三"
sayHello:function(){
Alert("你好")
}
}
在js中对象可以作为关联数组使用
o.name
o.sayHello()
o["name"]
o["sayHello"]()
b.数组 (Array):数组与对象类似,但不太相同。数组是数值有序集合
数组的创建与使用
-> new 语法
-> 直接使用索引下添加成员、引用成员
数组的直接量
var arr = [ ] .
c.函数(function):函数是一个可以执行的JavaScript代码片段,函数没有重载
1.系统函数
ParseInt();转换为整数 45.9a转换为45;a6转换返回为NaN(Not a Number)isNaN(判断是不是数字)
typeof(var);判断是什么数据类型
eval(“5+2”);计算表达式值
2.自定义函数
Function 函数名(){javaScript代码}Function 函数名(参数1,参数2){javaScript代码 return 返回值(可选)}
3.js中函数的调用:
事件名=“函数名(传递的参数值)“;函数名(传递的参数值);
匿名函数:
匿名函数的声明:
Var 变量名=function(参数){ 函数体 return 返回值;} ;
调用
变量名(参数)
4.函数的参数
当实际参数的个数大于形式参数的个数,多余的实际参数会被省略掉;
当实际参数的个数小于形式参数的个数,形式参数多余的个数就会被定义为NaN
C.无类型:null、undefined
null表示空,没有引用对象
undefined表示未定义,不存在-> 定义变量未赋值
-> 返回只有return
-> 未定义的属性
null与undefined的比较
= =视两个相同 , 一 般使用= = = 和!= = 进行判断
undefined不是js的保留字,是ecmascropt的标准写类库时可以在开始的时候使用代码var undefined; 保证其可用