JS函数的概念
函数就是把特定功能的代码抽取出来，使之成为程序中的一个独立实体。
2. ##### 函数的作用
正如函数的概念, 我们可以根据需要, 将特定的功能用函数来包裹(封装)
3. ##### 使用函数的好处
1, 函数可以在同一个程序或其他程序中多次重复使用（通过函数名调用）
2, 使程序变得更简短而清晰 ， 提高可读性
3, 有利于程序维护
函数的分类
函数可以分为: 系统函数 内置函数 和 自定义函数
系统函数，内置函数:
是官方提供好的函数，可以直接使用
如: alert(), isNaN(), console.log() ，document.write(), Boolean(), Math.pow()等
自定义函数:
是用户自己定义的函数, 用户可以根据实际需求, 对特定的功能使用函数来封装
函数的简单定义
定义函数的语法格式:
function 函数名() {
代码块;
}
注意: 1, 必须使用function关键字, 且为小写, 函数名可以自己给定
2, 函数名的命名规则和变量名一致
3, 函数名后必须写圆括号()
示例: 定义一个函数printOut
function printOut(){
document.write(“Hello World!”);
}
函数的调用
函数的调用方式: 函数名()
如 : 调用下面的函数: printOut()；
function printOut(){
document.write(“Hello World!”);
}
注意: 1, 调用函数后会执行函数内部的代码块;
2, 函数在不调用的情况下是不会执行的, 只有调用后函数中的代码才会执行
函数的标准定义
定义函数的语法格式:
function 函数名(参数1，参数2，……)
{
执行语句;
return 返回值;
}
注意: 1, 函数名后圆括号()中的参数数量不定, 也可以没有; (根据功能需要)
2, return关键字的作用是将某个值返回, 如果没有返回值则默认返回undefined;
示例: 定义一个函数sum
function sum(one, two){
var s = one + two;
return s;
}
调用上面的函数:
var result = sum(2, 8);
console.log(result);
上面代码的执行过程:
1, 先执行sum(2,8), 将2传给变量one, 将8传给变量two;
2, 函数sum内部执行one和two的相加, 然后将和返回, 返回值会赋值给result, 所以result为2和8相加后的和: 10;
3, 最后会打印出10
形参:
形参就是在函数定义时，函数名后面的参数;
函数的形参跟变量是一样使用,且不能用var修饰
实参:
实参就是调用时，函数名后面的参数
如: 之前定义的函数sum中: one和two是形参, 2和8是实参
function sum(one, two){
var s = one + two;
return s;
}
sum(2, 8);
函数中的arguments数组:
JS中函数不介意传递进来多少个参数，也不在乎传进来参数是什么数据类型，在调用函数时也未必一定要传递指定数量的参数，原因是 ECMAScript 中的参数在内部是用一个数组(arguments)来表示的。函数接收到的始终都是这个数组，而不关心数组中包含哪些参数（如果有参数的话）。
arguments可以判断参数的个数，arguments是个数组(后面会详细讲解数组)。
我们可以使用arguments.length来获取参数的个数
可以使用arguments[i] 的方式来访问数组中的第i个参数(i为自己给定的整数下标)
作用域:
就是起作用的范围。或者说有效范围; 这里涉及到另外两个概念
局部变量: 定义在函数内部的变量，这个变量只能在函数内部使用，即作用域范围只是函数内部，另外，形参也是局部变量.
全局变量: 全局变量就是定义在函数外部的变量，这个变量在任何函数中都有效，即作用域范围是当前文件的任何地方.
注意: 在定义变量时, 如果不写关键字var也是合法的, 且是全局变量, 但是这样写不安全,容易在其他地方被更改, 所以我们在函数中写变量要加上var
示例:
var a = 10;
function m1(){
var a = 5;
console.log(a); //5
}
m1();
console.log(a); //10
1, 在上面函数中第一个打印为函数m1内部定义的a的值, 变量会从下往上寻找最近的变量a;
2, 第二个打印为最上面定义的a的值;
DOM的简单操作:
1, 获取元素节点对象: document.getElementById(‘id’);
2, 获取输入框的内容: value属性
3, 点击事件: onclick
示例:
在输入框中输入数字, 点击按钮调用函数来判断奇偶性?
注意: document.write() 在文档页面加载完后使用会覆盖页面内容, 尽量少用
递归调用: 函数可以自己调用自己,必须要有结束条件,称为函数的递归调用;
重要性:
递归的分量，递归属于函数中比较难理解的知识，在应用开发中，虽然使用不是很频繁，但是很体现你的功底，而且，从事IT行业开发，最好要会递归，如果说现在可以不要求灵活运用的话，以后到公司中一定要会，如果面试中有人问你递归，说明，他对你要求挺高
递归调用的方式:
1. 首先去找临界值，即无需计算，获得的值(一般是返回该值)。
2. 找这一次和上一次的关系(一般从后往前找)
3. 假设当前函数已经可以使用，调用自身计算上一次的运行结果，再写出这次的运行结果。
函数讲解
函数是什么？ 函数其实就抽取写好的js代码 作为一个通用的代码块（封装）
作用: 减少代码冗余（过多） 方便调用 (提供效率 提高代码的可读性) 便于维护（二次修改）
js有哪些函数
1.系统函数 2.内置函数 （只需要调用） 3.自定义函数
函数带括号就是函数 //函数没有调用是不会执行的
系统函数 就是系统自带的函数 alert()
内置函数 Math.pow() 属于Math对象的内置函数
自定义函数 你自己写的函数 需要先书写 再进行调用
函数主要依赖于function关键词进行定义 一般的函数名以fn开头
/自定义函数的三种声明方式
1.第一种声明
<script>
function 函数名(参数1,参数2....){
函数体（需要进行的操作）
}
function showMessage(){ //showMessage 就是函数名
console.log("hello function");//函数体
}
/调用 使用 函数名()
showMessage()
</script>
2.第二种声明
<script>
var 变量名 = function(){
函数体
}
var fn = function(){ //fn就是一个变量名 表示当前fn是一个函数 fn就是表示这个函数
console.log("hello function！！！");
}
调用 使用变量名()
fn()
</script>
3.第三种声明 使用new的方式 不常用 凡是使用new的都是对象
<script>
var fnObj = new Function("console.log('hello function object')")
调用
fnObj()
arg 参数 arguments表示的是参数数组 他具备数组的特性 他可以接收用户传递所有参数
length属性 获取对应的长度 具备下标 获取指定的元素（从0开始到length-1结束）
console.log(arguments.length);
}
fn(1,2,3)
arguments他可以接收任意类型的值
fn('1',null,undefined)
求和 任何参数的和
function sum(){
接收的所有数据都存在于arguments数组里面 获取所有的数据进行求和
遍历对应的arguments数组
var result = 0 //接收所有的和
for(var i=0;i<arguments.length;i++){
//arguments[0] 取出第一个值
result+= arguments[i]
}
return result
}
调用 多个参数使用,隔开
console.log( sum(3,4,3,4,4,6));
练习:
1, 写一个函数判断一个年份是不是闰年
function fn1(year){
if(year%4==0 && year%100!=0 || (year%400==0)){
console.log("当前年份是闰年");
return true
}else{
console.log("当前年份是平年");
return false
}
}
fn1(2000)
</script>
var fnObj = new Function(“console.log(‘hello function object’)”)
调用
fnObj()
//arg 参数 arguments表示的是参数数组 他具备数组的特性 他可以接收用户传递所有参数
//length属性 获取对应的长度 具备下标 获取指定的元素（从0开始到length-1结束）
console.log(arguments.length);
}
fn(1,2,3)
//arguments他可以接收任意类型的值
fn(‘1’,null,undefined)
//求和 任何参数的和
function sum(){
//接收的所有数据都存在于arguments数组里面 获取所有的数据进行求和
//遍历对应的arguments数组
var result = 0 //接收所有的和
for(var i=0;i<arguments.length;i++){
//arguments[0] 取出第一个值
result+= arguments[i]
}
return result
}
//调用 多个参数使用,隔开
console.log( sum(3,4,3,4,4,6));
练习:
1, 写一个函数判断一个年份是不是闰年
function fn1(year){
if(year%40 && year%100!=0 || (year%4000)){
console.log(“当前年份是闰年”);
return true
}else{
console.log(“当前年份是平年”);
return false
}
}
fn1(2000)
return关键词是用于函数里面返回数据的 没有数据返回的话 默认返回undefined
<script>
function fn(){
console.log('hello');
}
fn调用了没有 函数名() 他就会调用
var a = fn(); //调用了一遍 a是相当于fn的返回值 而不是fn这个函数
console.log(a);//undefined
函数的参数可以写 可以不写 具体要看对应的参数有没有被使用到
在函数定义的时候里面的参数名可以随便写 因为他是一个形参
function add(number1){
console.log('hello world');
}
因为上述的形参没有被使用到 那么我们可以省略这个参数传递
add()
</script>
俩个数相加的方法
function addToTwoNumber(number1,number2){
return number1+number2
}
在调用的时候进行参数传递 传递的参数必须要为实参（实际值的参数 常量）
<script>
var number03 = addToTwoNumber(1,2)
console.log(number03);
var a = 10
var result = addToTwoNumber(a,10)
console.log(result);
</script>
变量作用域 变量分为全局变量 作用域为全局和局部变量为对应的代码块内（function）
<script>
代码块不包含 if switch 以及 for (声明的变量还是全局变量)
var a = 10 //全局变量
for(var i=0;i<10;i++){ //i++执行的次数比里面的多一次
var a = 5 //全局变量
console.log(a); //5
}
console.log(a); //全局变量 5
console.log(i); //全局变量 还是10
var b = 10 //全局变量
function fn(){ //代码块
var b = 20 //重新声明局部变量b
console.log(b); //局部变量 20
}
调用
fn()
console.log(b); //全局变量 10
在function里面的声明的变量 他的作用域只存在于function 对应的全局声明的变量是可以存在于全局的
var c = 30
function fn1(){
c = 20 //var 关键词用来声明变量 将全局变量 c 进行赋值 20 引用全局变量c
console.log(c); // 20
}
调用
fn1()
console.log(c);//20
变量作用域 变量分为全局变量 作用域为全局和局部变量为对应的代码块内（function）
全局作用域可以在局部调用 局部作用不能应用在全局
全局作用域的东西他对应的可以在局部中更改 局部作用域不能再全局更改
局部作用域的代码块不包含 if switch 以及 for (声明的变量还是全局变量)
function fn2(){
var d = 20
console.log(d); //20
}
var d = 30//
fn2()
console.log(d); //30
fn1() //顺序执行的
fn2() //fn2是 not function
在初始状态页面加载的时候 js会优先加载function以及对应的变量命名 但是他不会加载变量赋值的过程
console.log(typeof fn2); //undefined
使用function直接写一个函数
function fn1(){
console.log("我是函数1");
}
使用变量接收一个函数
var fn2 = function(){
console.log("我是函数2");
}
</script>
关于fn2调用在fn2变量赋值之前 fn2是undefined值
// var fn2
// fn2()
// fn2 = function(){
// }
作用域链
函数的嵌套
var first = 50 //全局变量
关于函数的嵌套 如果你调用了最外层的function 那么是不会自动调用内层的function
<script>
function fn1(){
var a = 10 //局部变量
function fn2(){
var b = 20 //局部变量
function fn3(){
var c = 30 //局部变量
var f
function fn4(){
var d = 40 //局部变量
f未定义的 找不到这个f 报错
如果找不到对应的变量就会出现 报错
找的到就是undefined
console.log(a+b+c+d+first+f);//a是fn1 b是fn2 c是fn3 d自身的 first全局变量
当你的里面不包含这个变量 他会向对应上层去寻找这个变量
这个逐层向上寻找变量的过程叫做作用域链
什么叫作用域 就是一个变量的作用的区域
function fn5(){
var f = 10
}
}
fn4()
}
fn3() //调用第三层的function
}
fn2()//调用第二层的function
}
//调用最外层的function
fn1() // 10+20+30+40+50 = 150
</script>
编写加的函数
<script>
function sum(number1,number2){
return number1+number2
}
减法
function difference(number1,number2){
return number1-number2
}
乘法
function product(number1,number2){
return number1*number2
}
除法
function merchant(number1,number2){
return number1/number2
}
将符号作为参数进行传递
function computerNumber(number1,number2,sym){
switch(sym){
case '+':
console.log('加执行了');
return number1+number2
case '-':
console.log('减执行了');
return number1-number2
case '*':
console.log('乘执行了');
return number1*number2
case '/':
console.log('除执行了');
return number1/number2
case '%':
console.log('取余执行了');
return number1%number2
default:
console.log("参数错误");
}
}
</script>
当方法执行到return的时候 return会结束整个方法
var number04 = computerNumber(12,6,’+’)
console.log(number04); //18
扫一扫
632
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
