Javascript中的函数
1.为什么要用函数?
1.函数可以把具有相同或相似逻辑的代码“包裹”起来,通过函数调用执行这些被“包裹”的代码逻辑,这么做的优势是有利于精简代码方便复用。
2.提高效率
2.函数如何使用
函数的语法书写有两部分
1.声明函数
for 函数名 () {
函数体
}
函数体是函数的构成部分,它负责将相同或相似代码“包裹”起来,直到函数调用时函数体内的代码才会被执行。函数的功能代码都要写在函数体当中。
注意的是: 声明(定义)的函数必须调用才会真正被执行,使用 () 调用函数
2.函数调用
函数名();
注意:函数声明之后可以被多次调用,重新执行
alert() , parseInt() 这种名字后面跟小括号的本质都是函数的调用
<script>
//函数使用分两步
//1.声明函数
function sayHi() {
console.log('你好');
console.log('你好啊');
console.log('敲代码啊');
}
//2.调用函数
sayHi()
</script>
1.函数名的书写注意事项
1.函数名命名规范
2.和变量命名基本一致
3.尽量小驼峰式命名法
4.前缀应该为动词
5.命名建议:常用动词约定
3.函数的参数
声明语法
for 函数名( 参数列表) {
函数体
}
调用函数
函数名 (传递的参数列表)
1.函数的形参
声明函数时写在函数名右边小括号里的叫形参(形式上的参数)
形参可以理解为是在这个函数内声明的变量(比如 num1 = 10)实参可以理解为是给这个变量赋值
2.函数的实参
调用函数时写在函数名右边小括号里的叫实参(实际上的参数)
形参可以理解为是在这个函数内声明的(比如 )实参可以
开发中尽量保持形参和实参个数一致,参数之间用逗号隔开
4.函数的返回值
当函数需要返回数据出去时,用return关键字
1.返回值语法书写
for 函数名( 参数列表) {
函数体代码
return 返回值
}
调用函数
函数名 (传递的参数列表)
<script>
//声明函数
function fn (x , y) {
//返回值给函数
return x+y
}
//调用函数
fn (20,30) // 50
console.log( fn (20,30)); //50
</script>
2.返回值注意的事项
在函数体中使用 return 关键字能将内部的执行结果交给函数外部使用
函数内部只能运行到 1 次 return,并且 return 后面代码不会再被执行,所以 return 后面的数据不要换行写
return会立即结束当前函数
函数可以没有 return,这种情况函数默认返回值为 undefined
5.作用域概述
通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突。
1.全局作用域
作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件
<script>
//再script里面运行的叫全局作用域
let num = 10 ; //全局
</script>
2.局部作用域(函数作用域)
作用于函数内的代码环境,就是局部作用域。 因为跟函数有关系,所以也称为函数作用域。
<script>
function getMax() {
//这个区域就叫局部作用域
//也可以叫函数作用域
let num = 100
return num
}
getMax()
</script>
3.块级作用域
let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问
<script>
for ( let i = 1 ; i <1 ; i++) {
//块级作用域
let num1 = 320;
}
while (true) {
//块级作用域
let num2 = 20;
}
</script>
6.变量的作用域
在JavaScript中,根据作用域的不同,变量可以分为全局变量,局部变量,块级变量
1.全局变量
全局变量在变量定义之后区域可以访问和修改
2.局部变量(函数内部变量)
局部变量只能在当前函数内部访问和修改
3.块级变量({}里面的变量)
let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问
4.变量的作用域特殊情况
如果函数内部或者块级作用域内部,变量没有声明,直接赋值,也当全局变量看,但是强烈不推荐
函数内部的形参可以看做是局部变量,所以形参相当于函数内部定义的局部变量,只有在函数内部可以使用
7.函数封装两个数的和案例
需求,由用户输入两个数字,然后得到两个数字的和
<script>
//用户输入两个数字
let mess1 = +prompt('请输入第一个数字')
let mess2 = +prompt('请输入第二个数字')
//声明函数中的是形参
function getSum (num1,num2) {
//页面输出
document.write(num1 + num2)
}
//调用函数括号里面的是实参
getSum (mess1,mess2)
</script>
8.函数封装数组中的和案例
需求是,求某数组中的元素和
<script>
//有一个数组
let arr1 = [ 10,64,37,46,02,61]
//函数封装关于数组的总和
function calcSum(arr) {
//声明一个变量来代表数组的和
let sum = 0
for ( let i = 0 ; i < arr.length ; i++) {
//循环累加数组的值
sum += arr[i]
}
//页面输出苏数组的和
document.write(`${sum}`)
}
//调用函数
calcSum(arr1)
</script>