01_JavaScript的函数
普通格式:
function 函数名(a,b,c) {
}
匿名函数
function (a,b,c) {
}
示例:
定义
function sum(a,b) {
return a + b;
}
调用
var result = sum(1,2);
alert(result);
总结:
在js中方法就是对象
方法名就是指向方法对象的一个引用
在js中如果没有显示的调用return,则没有返回值
在js中没有方法的重载
02_数组
元素可以是任意类型
长度可以变化
JS中的数组看成是Java中的ArrayList
格式:
var 数组名 = new Array();
var 数组名 = new Array(长度);
var 数组名 = new Array(元素1,元素2);
var 数组名 = [元素1,元素2];
遍历
var arr = ["itcast","itheima"];
for(var x = 0;x < arr.length;x++) {
alert(arr[x]);
}
注意:
js数组的元素,长度任意,类型任意
js中没有数组越界这个概念
03_数组案例1
定义一个函数,用来获取指定数组中的最大的元素
function getMax(arr) {
//定义一个参照物
var max = arr[0];
//遍历数组
for(var x = 1;x < arr.length;x++) {
//使用数组中的元素和参照物进行比较
if(arr[x] > max) {
//把数组中的元素赋值给参照物
max = arr[x];
}
}
return max;
}
04_数组案例2
定义一个函数,用来获取指定数组中指定元素第一次出现的索引位置
function getIndex(arr,element) {
//遍历数组
for(var x = 0;x < arr.length;x++) {
//获取数组中的每一个元素并与指定的元素进行比较
if(arr[x] == element) {
return x;
}
}
return -1;
}
05_JavaScript的常用对象(Array)
Array
join() 用于把数组中的所有元素放入一个字符串
toString() 方法可把数组转换为字符串,并返回结果。
push() 可向数组的末尾添加一个或多个元素,并返回新的长度
reverse() 用于颠倒数组中元素的顺序
//练习
定义一个js数组 [2,1,4,7,9,5],向里面添加8和11,然后在按照从小到大排序!!!
06_JavaScript的常用对象(String)
String
charAt() 可返回指定位置的字符
indexOf() 可返回某个指定的字符串值在字符串中首次出现的位置。
big() 用于把字符串显示为大号字体
//练习
将字符串"heimachengxuyuan"中的"cheng"截取出来并转换成大写
将字符串"What is you name"分割为字符串数组
注意:
indexOf()虽然可以从指定的位置上进行查找,但是返回的仍然是这个变量在整个字符串中的位置
扩展
substr() 从起始索引号提取字符串中指定数目的字符。
substring() 提取字符串中两个指定的索引号之间的字符。
07_JavaScript的常用对象(全局对象)
所谓的全局变量,你可以简单认为是window下面的对象
他的作用域是针对整个window,是js给我们预定义好的对象
全局对象没有名称,我们无法访问,但是我们可以使用他的方法和属性
全局方法
parseFloat() 解析一个字符串并返回一个浮点数。
parseInt() 解析一个字符串并返回一个整数。
isNaN() 检查某个值是否是数字。
全局属性
NaN 指示某个值是不是数字值。
undefined 指示未定义的值。
08_案例(校验qq号码)
校验qq号码
要求必须是5-15位
0不能开头
必须都是数字
校验手机号
1,必须11位
2,第一位以1开头
3,第二位必须是3,5,7,8,9任意一个
4,全部是数字
09_正则表达式的概述
概述:
描述了一种字符串的匹配模式,
可以用来判断一个字符串是否符合指定规则
提供了一套完整的字符用来制定规则。
单字符,单数字 代表自己 "1[35789][0-9]{9}" "1[35789]\\d{9}"
单词字符包括:a-z、A-Z、0-9,以及下划线。
[]表示范围
[12345] 1-5中的任意一个
[0-9] 0-9中的任意一个
[a-zA-Z]字母
[^0-9]非数字
数量词 表示数量词前面的字符出现的次数
[0-9]+ +至少一次
[0-9]* *任意次
[0-9]? ?表示0次或者一次
[0-9]{x} 出现x次
[0-9]{x,} 至少出现x次
[0-9]{x,y} 至少出现x次,至多出现y次
元字符 类似java中的关键字
\d 0-9
\D ^0-9
\w a-zA-Z_0-9
\W ^a-zA-Z_0-9
^开头 $结尾
10_使用正则表达式改写校验qq号码
//创建正则表达式的对象
var reg = new RegExp("^[1-9][0-9]{4,14}$");
//校验QQ号码
var flag = reg.test(qq);
11_判断字符串”qaq”中间的字符是否是元音
元音:aeiou AEIOU
var reg = new RegExp("^q[aeiouAEIOU]q$");
var flag = reg.test(s);
12_事件
事件通常和JS的脚本代码组合使用,可以通过事件的发生来执行一段JS的脚本代码(函数)
三个要素
事件源:
事件:
事件处理程序:
电动车上装了一个报警器,你踹他一脚,他就响
事件源:电动车
事件处理程序:报警器响 监听器
事件:踹
三个步骤:
写一个事件源:
写一个监听器:
绑定事件源和监听器
onclick 点击时触发
onchange 元素发生变化时触发
onkeydown 键盘按下时触发
onsubmit 表单提交时触发
<script>
document.getElementById("myBtn").οnclick=function(){displayDate()};
</script>
13_BOM概述&window对象(对话框)
BOM
浏览器对象模型,用于执行浏览器的相关动作,获取修改浏览器的地址信息,弹出各种对话框,打开关闭窗口
BOM常用对象
window
alert()//提示一个信息
confirm()//带有确定取消按钮,可以让用户进行一个选择,根据方法的返回值做不同的操作
prompt() //对话框.可以接收用户的一些信息
open() //
close()
setTimeout() //
history
location
14_window对象(其他方法)
open() //主要用于打开一个窗口
close()
setTimeout() //定时
注意:只有通过 JavaScript 代码打开的窗口才能够由 JavaScript 代码关闭。这阻止了恶意的脚本终止用户的浏览器。
15_location对象
URL
统一资源定位符,用于标识网络资源(图片、文件、HTML)在网络上的位置
http://www.itcast.cn:端口号/images/slidead/BEIJING/2017471909473900.jpg
http 网络协议
www.itcast.cn 域名,IP地址的别名
IP地址 网络设备在网络上的位置
端口号 应用在设备上的位置,web服务器
/images/slidead/BEIJING 路径
location
包含了当前页面的URL信息
属性
protocol//网络协议
hostname//主机名 IP地址
port//端口号
host//主机名+端口号
pathname//路径
href//完整的URL
16_history对象
包含了当前窗口用户访问过的URL
back() //后退
forward()//前进
go()
普通格式:
function 函数名(a,b,c) {
}
匿名函数
function (a,b,c) {
}
示例:
定义
function sum(a,b) {
return a + b;
}
调用
var result = sum(1,2);
alert(result);
总结:
在js中方法就是对象
方法名就是指向方法对象的一个引用
在js中如果没有显示的调用return,则没有返回值
在js中没有方法的重载
02_数组
元素可以是任意类型
长度可以变化
JS中的数组看成是Java中的ArrayList
格式:
var 数组名 = new Array();
var 数组名 = new Array(长度);
var 数组名 = new Array(元素1,元素2);
var 数组名 = [元素1,元素2];
遍历
var arr = ["itcast","itheima"];
for(var x = 0;x < arr.length;x++) {
alert(arr[x]);
}
注意:
js数组的元素,长度任意,类型任意
js中没有数组越界这个概念
03_数组案例1
定义一个函数,用来获取指定数组中的最大的元素
function getMax(arr) {
//定义一个参照物
var max = arr[0];
//遍历数组
for(var x = 1;x < arr.length;x++) {
//使用数组中的元素和参照物进行比较
if(arr[x] > max) {
//把数组中的元素赋值给参照物
max = arr[x];
}
}
return max;
}
04_数组案例2
定义一个函数,用来获取指定数组中指定元素第一次出现的索引位置
function getIndex(arr,element) {
//遍历数组
for(var x = 0;x < arr.length;x++) {
//获取数组中的每一个元素并与指定的元素进行比较
if(arr[x] == element) {
return x;
}
}
return -1;
}
05_JavaScript的常用对象(Array)
Array
join() 用于把数组中的所有元素放入一个字符串
toString() 方法可把数组转换为字符串,并返回结果。
push() 可向数组的末尾添加一个或多个元素,并返回新的长度
reverse() 用于颠倒数组中元素的顺序
//练习
定义一个js数组 [2,1,4,7,9,5],向里面添加8和11,然后在按照从小到大排序!!!
06_JavaScript的常用对象(String)
String
charAt() 可返回指定位置的字符
indexOf() 可返回某个指定的字符串值在字符串中首次出现的位置。
big() 用于把字符串显示为大号字体
//练习
将字符串"heimachengxuyuan"中的"cheng"截取出来并转换成大写
将字符串"What is you name"分割为字符串数组
注意:
indexOf()虽然可以从指定的位置上进行查找,但是返回的仍然是这个变量在整个字符串中的位置
扩展
substr() 从起始索引号提取字符串中指定数目的字符。
substring() 提取字符串中两个指定的索引号之间的字符。
07_JavaScript的常用对象(全局对象)
所谓的全局变量,你可以简单认为是window下面的对象
他的作用域是针对整个window,是js给我们预定义好的对象
全局对象没有名称,我们无法访问,但是我们可以使用他的方法和属性
全局方法
parseFloat() 解析一个字符串并返回一个浮点数。
parseInt() 解析一个字符串并返回一个整数。
isNaN() 检查某个值是否是数字。
全局属性
NaN 指示某个值是不是数字值。
undefined 指示未定义的值。
08_案例(校验qq号码)
校验qq号码
要求必须是5-15位
0不能开头
必须都是数字
校验手机号
1,必须11位
2,第一位以1开头
3,第二位必须是3,5,7,8,9任意一个
4,全部是数字
09_正则表达式的概述
概述:
描述了一种字符串的匹配模式,
可以用来判断一个字符串是否符合指定规则
提供了一套完整的字符用来制定规则。
单字符,单数字 代表自己 "1[35789][0-9]{9}" "1[35789]\\d{9}"
单词字符包括:a-z、A-Z、0-9,以及下划线。
[]表示范围
[12345] 1-5中的任意一个
[0-9] 0-9中的任意一个
[a-zA-Z]字母
[^0-9]非数字
数量词 表示数量词前面的字符出现的次数
[0-9]+ +至少一次
[0-9]* *任意次
[0-9]? ?表示0次或者一次
[0-9]{x} 出现x次
[0-9]{x,} 至少出现x次
[0-9]{x,y} 至少出现x次,至多出现y次
元字符 类似java中的关键字
\d 0-9
\D ^0-9
\w a-zA-Z_0-9
\W ^a-zA-Z_0-9
^开头 $结尾
10_使用正则表达式改写校验qq号码
//创建正则表达式的对象
var reg = new RegExp("^[1-9][0-9]{4,14}$");
//校验QQ号码
var flag = reg.test(qq);
11_判断字符串”qaq”中间的字符是否是元音
元音:aeiou AEIOU
var reg = new RegExp("^q[aeiouAEIOU]q$");
var flag = reg.test(s);
12_事件
事件通常和JS的脚本代码组合使用,可以通过事件的发生来执行一段JS的脚本代码(函数)
三个要素
事件源:
事件:
事件处理程序:
电动车上装了一个报警器,你踹他一脚,他就响
事件源:电动车
事件处理程序:报警器响 监听器
事件:踹
三个步骤:
写一个事件源:
写一个监听器:
绑定事件源和监听器
onclick 点击时触发
onchange 元素发生变化时触发
onkeydown 键盘按下时触发
onsubmit 表单提交时触发
<script>
document.getElementById("myBtn").οnclick=function(){displayDate()};
</script>
13_BOM概述&window对象(对话框)
BOM
浏览器对象模型,用于执行浏览器的相关动作,获取修改浏览器的地址信息,弹出各种对话框,打开关闭窗口
BOM常用对象
window
alert()//提示一个信息
confirm()//带有确定取消按钮,可以让用户进行一个选择,根据方法的返回值做不同的操作
prompt() //对话框.可以接收用户的一些信息
open() //
close()
setTimeout() //
history
location
14_window对象(其他方法)
open() //主要用于打开一个窗口
close()
setTimeout() //定时
注意:只有通过 JavaScript 代码打开的窗口才能够由 JavaScript 代码关闭。这阻止了恶意的脚本终止用户的浏览器。
15_location对象
URL
统一资源定位符,用于标识网络资源(图片、文件、HTML)在网络上的位置
http://www.itcast.cn:端口号/images/slidead/BEIJING/2017471909473900.jpg
http 网络协议
www.itcast.cn 域名,IP地址的别名
IP地址 网络设备在网络上的位置
端口号 应用在设备上的位置,web服务器
/images/slidead/BEIJING 路径
location
包含了当前页面的URL信息
属性
protocol//网络协议
hostname//主机名 IP地址
port//端口号
host//主机名+端口号
pathname//路径
href//完整的URL
16_history对象
包含了当前窗口用户访问过的URL
back() //后退
forward()//前进
go()