JavaScript函数
function,是被设计为执行特定任务的代码块
有利于精简代码方便复用
函数不调用自己不执行, 使用中方便控制执行位置
随时调用,随时执行,可重复调用
函数的使用
实参及形参概括
函数声明时,小括号里面的是形参,形式上的参数
函数调用时,小括号里面的是实参,实际的参数
尽量保持形参和实参的个数一致 ,中间用逗号符号隔开
// 如果 实参个数大于形参,则后续传递进去的值会忽略
// 如果 实参个数小于形参,则形参默认为undefined
function getSum(x, y) {
return x + y
}
console.log(getSum(1, 2)); //调用函数打印得到实参x+y的返回值
逻辑中断解决
开发中形参如果不被赋值,就是undefined
// 鲁棒性 -> 健壮性
function getSum(a, b) {
a = a || 0
b = b || 0
document.write(a + b)
}
getSum(1)
// 给函数的形参设置默认值
function getSum(a = 0, b = 0) {
document.write(a + b)
}
getSum(9, 10)
函数返回值return
为什么要让函数有返回值
- 函数内部不需要输出结果,而是返回结果
- 对执行结果的扩展性更高,可以让其他的程序使用这个结果
函数返回值语法及注意事项
- 语法:return 数据
- return后面不接数据或者函数内不写return,函数的返回值是undefined
- return能立即结束当前函数, 所以 return 后面的数据无效
作用域
注意点:局部变量或者块级变量 没有let 声明直接赋值的当全局变量看
作用域链:采取就近原则的方式来查找变量最终的值
arguments 的介绍及用法
arguments在函数参数中是个伪数组,可以代替形参遍历来使用.但是没有没有数组的一些增减功能.
传递的实参不需要加 [ ]
// 函数中 arguments代表传递进来参数的伪数组,伪数组无法使用一些数组的方法
function getSum() {
// 遍历数组
let sum = 0
for (let i = 0; i < arguments.length; i++) {
sum = sum + arguments[i]
}
document.write(sum)
}
getSum(10, 20, 30)
立即执行函数写法
(function (){
函数体
})();
// 立即执行函数,作用:避免重复声明变量名导致代码bug
转换时间案例
<script>
/* 封装输入秒装换案例
小时: h = parseInt(总秒数 / 60 / 60 % 24)
分钟: m = parseInt(总秒数 / 60 % 60 )
秒数: s = parseInt(总秒数 % 60)
*/
//用户输入弹出; 由于用户输入的是字符串 '+' 转换为数字
//console.log(typeof times) 查看类型
//第一步
let times = +prompt(`请输入要装换的秒数`)
// 第三步
function data(time) {
// 第二步
let h = parseInt(time / 60 / 60 % 24)
let m = parseInt(time / 60 % 60)
let s = parseInt(time % 60)
//补零操作;注意点 1 加字符串的零加时间,先零在时间 2 三元计运算符写好记得=赋值
h = h >= 10 ? h : '0' + h
m = m >= 10 ? m : '0' + m
s = s >= 10 ? s : '0' + s
return [h, m, s] //以字符串形式转出三个不同的数
//打印下是否能接收到装换数据
// console.log([h, m, s]);
}
// 第四步
let res = data(times) //新建个变量接收函数的返回数组
//data(这里为全局变量的time 赋值给data函数;形参=实参)
console.log(res); //查看能否打印
document.write(`您输入的秒数为${times},转换的时间为:${res[0]}:${res[1]}:${res[2]}`) //注意res为数组,选择第几个[索引]
</script>