类似于Java中的方法,是完成特定任务的代码语句块
特点
分类
系统函数
自定义函数
parseInt("字符串");
parseFloat("字符串");
从下标为0起,依次判断每个字符是否可以转换为一个有效数字
- 如果不是有效数字,则返回NaN,不再继续执行其他操作
- 如果是有效数字,则该函数将查看下标为1的字符,进行同样的测试,直到发现非有效数字的字符或全部检测完为止
isNaN(x);
通常,使用isNaN()函数检测parseInt()和parseFloat()的运算结果,判断它们表示的是否是合格的数字;
也可以使用isNaN()函数检测操作数是否有错误,例如:用0作为除数的情况
与 Java 语言一样,JavaScript中需要先定义函数,再调用函数
定义函数的方式
由关键字 function、函数名、一组参数及置于括号中的待执行的 JavaScript 语句组成
function 函数名([参数1[, 参数2[, 参数3,…] ] ]) {
// 参数是可选的
//JavaScript语句;
[return 返回值]
// 可有可无
}
JavaScript是弱数据类型,对于函数参数没有类型检查和类型限定
事件名="函数名([参数值1[, 参数值2[, 参数值3,…] ])";
一般和表单元素的事件一起使用
定义并调用无参函数,输出5次“欢迎学习JavaScript”
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input name="btn" onclick="study( )" type="button" value="显示5次欢迎学习JavaScript"/>
// 单击此按钮时,调用函数study( ),执行函数体中的代码
</body>
<script type="text/javascript">
function study() {
for (var i = 0; i < 5; i++) {
document.write("欢迎学习JavaScript
");
}
}
// 定义无参函数study()
</script>
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-7fBHZrSs-1681957325917)(./assets/image-20230420093013462.png)]
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LUt8JZmJ-1681957325919)(./assets/image-20230420093029638.png)]
键盘接收“欢迎学习JavaScript”输出行数,并按指定数字输出到网页
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input name="btn" onclick="study(prompt('请输入显示欢迎学习JavaScript的次数:',''))"
type="button"
value="请输入显示欢迎学习JavaScript的次数"/>
</body>
</html>
<script type="text/javascript">
function study(count) {
for (var i = 0; i < count; i++) {
document.write("欢迎学习JavaScript
");
}
}
// 使用系统函数prompt()接受行数,作为参数传递给自定义函数study()
</script>
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-jIbe6i1M-1681957325920)(./assets/image-20230420093311411.png)]
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ywK4Ciqb-1681957325920)(./assets/image-20230420093458717.png)]
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tkTGudgj-1681957325920)(./assets/image-20230420093506323.png)]
将函数赋给变量
var 变量 = function([参数值1[, 参数值2[, 参数值3,…] ]) {
//JavaScript语句;
};
变量([参数值1[, 参数值2[, 参数值3,…] ]);
<script>
//函数声明
function f1() {
console.log("今天天气真好!");
}
f1();
function f1() {
console.log("今天天气好晴朗,处处好风光!");
}
f1();
</script>
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Dl1Jgqyj-1681957325921)(./assets/image-20230420100122769.png)]
<script>
//函数表达式
var f2 = function () {
console.log("哇~");
};
f2();
var f2 = function () {
console.log("哇哈哈~");
};
f2();
</script>
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-280B8VJ9-1681957325921)(./assets/image-20230420100209252.png)]
使用函数声明方式定义两个同名的函数时,后面的函数将会覆盖前面的函数;
使用函数表达式方式定义同名的函数时,会从上到下,逐行执行代码,并输出结果
顾名思义就是提前解析代码,主要完成两项工作
<script>
console.log(num); //undefined
var num = 10;
// 结论1 预解析可以把变量的声明提前
f1();
function f1() {
var num = 100;
console.log(num); //100
}
// 结论2 预解析可以把函数的声明提前
</script>
自定义函数分类
(function() {
//函数体
})();
// 声明并调用匿名函数
匿名函数的特点与好处
函数没有名字,在声明的同时便直接调用
同名函数之间不会有冲突
将函数作为另一个函数的参数使用
<script>
// 回调函数
function f1(fn) {
console.log("f1函数调用了");
fn();
}
function f2() {
console.log("f2函数调用了");
}
f1(f2);
// 函数f2()作为函数f1()的参数
</script>
如果没有指定回调函数的名称,则称之为 匿名回调函数
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-efSUqgEl-1681957325921)(./assets/image-20230420100752068.png)]
根据变量作用范围不同,分类
局部变量
全局变量
<script>
var x = 10;
// 全局变量
function f1() {
var y = 5;
// 局部变量
console.log(x);
console.log(y);
}
f1();
console.log(x);
console.log(y);
// 在函数f1()外部输出局部变量y值时
// 会报错“y is not defined”
</script>
局部变量 | 全局变量 | |
---|---|---|
作用域 | 仅作用在函数中 | 作用在整个脚本 |
声明位置 | 函数中 | 使用之前的任何位置 |
生存期 | 在函数运行以后被删除 | 在页面关闭后被删除 |
如果变量声明时,没有使用关键字var,则被称为隐式全局变量
var a1 = 1; //全局变量
a2 = 2; //隐式全局变量
如果在函数内部声明变量时,没有使用关键字var,则也是隐式全局变量
function f1() {
num = 200;
// 隐式全局变量
}
f1();
console.log( num );
// 函数外可以访问变量 num
声明全局变量a1和隐式全局变量a2
var a1=1;
a2=2;
delete a1;
delete a2;
console.log(typeof a1); //number
console.log(typeof a2); //undefined
隐式全局变量可以被删除,全局变量不可以被删除
作用域
块级作用域
使用场景
Scope Chain
当执行函数时,先从函数内部寻找局部变量
<script>
var num=10
//