一、JavaScript的概述
###<1>JavaScript的概念
又称ECMAScript,和java没有任何关系
嵌入在HTML元素中的 被浏览器解释运行的 一种脚本语言。
###<2>特点
操作方便:任何文本编辑器都可以编写,有浏览器就可以执行
面向对象:内置了大量的对象
脚本语言:解释执行,事先不编译,逐行执行
###<3>作用(使用HTML动态效果)
实现客户端数据格式的验证
处理浏览器的事件
制作特殊动态效果(轮播图,广告设计,特效等等)
###<4>使用方式
1. 直接在HTML中使用(内联方式)
2. 定义在html的head标签中的script子标签中(内部方式)
3. 定义在外部的js文件中,然后在需要使用的页面中引入(外部方式)
创建一个.js的文件
<script type="text/javascript" src="外部文件的位置"></script>
###<5>组成
1. ECMAScript,是js的核心内容:js的语法,数据类型,变量,关键字,函数等等
2. DOM,文档对象模型,整个HTML页面内容
3. BOM,浏览器对象模型,整个浏览器页面内容
# 二、JavaScript的ECMAScript
###<1>变量的定义
注意:所有的变量都使用var来申明,var 变量名 [= 值];
弱类型,没有强制的类型申明
语句的分号可以不写(建议写)
var 也可以省略(方法内部写和不写是有区别)
不要去使用js中的关键字来作为变量名称
语法格式:var 变量名称 [=变量值];
例如:
var age;
var x = 10;
var name="老王";
注释://
/**/
###<2>数据类型
var testnum = 10;//数据类型是动态定义的
alert("类型:"+typeof(testnum))
基本数据类型:
Number : 可以使用各种进制
String
Boolean
复杂的数据类型:
Array
Object
特殊的数据类型:
null
undefined
###<3>运算
布尔类型参与运算时,转换成数值型。
数据类型的隐式转换 :
数值型+字符串 :字符串
数值型+布尔型 :数值型 (true:1 ; fasle:0)
字符型+布尔型 :字符串
布尔型+布尔型 :数值型
转换函数:
parseint(需要转换的字符串,需要转换的字符串的进制)
toString()
== 和 ===的区别
==:仅仅比较内容
===:比较类型和数据内容
###<4>分支和循环结构
语法格式和java一样
###<5>验证数据的格式
<script type="text/javascript">
function checkNum() {
alert("验证")
//1.获取输入框对象
var username = document.getElementById("user").value;
var pwd = document.getElementById("pwd").value;
var pwd2 = document.getElementById("pwd2").value;
alert("username:"+username)
//2.判断
if(username==""){
alert("用户名不能为空");
return ;
}
if(pwd==""){
alert("密码不能为空");
return ;
}
if(pwd!=pwd2){
alert("密码输入不一致");
return ;
}
alert("输入正确")
}
</script>
#三、JavaScript的内置对象
1. String
属性:length
方法:split()
subString()
indexOf()
charAt()
2. Array
属性:length
方法:sort()
reverse()
3. Math
方法:round():四舍五入
random():生成随机数
math()
abs()
4. Number
toFixed(小数位):将数值转换成字符串,保留指定的小数位(四舍五入)
5. RegExp (重点) :https://regexper.com/
用户名和密码的格式进行限定:只能包含英文字母,数字,"_",必须以英文字母开头,分区大小写
1. 创建正则对象/创建正则字面值
var nameReg = /^$/;
var pwdReg = new RegExp("/^$/");
2. 调用test方法验证
var flag = nameReg/pwdReg.test(验证的数据);
[a-zA-Z][a-zA-Z0-9_]{5}
/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/
注意:某些符号需要转译
6. Date
var date = new Date(); //当前系统时间
setDate()/setHour()/setMonth()...
7. function对象(重点)
方式一:函数的定义:
function 方法名称(参数列表){
方法体
return 结果;
}
调用:方法名称(实参列表);
方式二:匿名函数定义的语法格式:
function (){
方法体
return 结果;
}
调用:匿名函数结构块(实参列表);
函数的调用和引用:
调用:函数名称()
引用:函数名称
例如:
arry.sort(function (){ //匿名方式引用
方法体
return 结果;
});
arry.sort(函数名称); //实名方式引用
8. 参数对象
函数的实参会被封装到arguments对象中,数组对象
属性:length,获取实参的个数
方法:argument[index],获取某个具体的实参
9. 全局函数
parseInt/parseFloat
isNaN
eval
decodeURI/encodeURI等
#四、JavaScript的浏览器对象
BOM
#五、JavaScript的文档对象(HTML的信息)
DOM
#六、JavaScript的自定义对象
JSON