「这是我参与11月更文挑战的第30天,活动详情查看:2021最后一次更文挑战」
1,函数的预解析
所谓的预解析是将JavaScript程序 预读
找到关键词 var 和 function
在程序中给 var 定义变量,提前调用时,赋值undefined
在程序中给 function 定义的函数,提交调用时,赋值函数地址,可以正常调用
对于函数内部 程序的预解析 --- 只有在调用函数时才会预解析
函数内部的程序,以类似于字符串的形式存储在程序中的
在封装程序的过程中,没有执行程序,所有的程序内容都是字符串形式
JavaScript程序,不会解析函数中存储的内容
只有在调用执行函数时,JavaScript会将存储的函数的内容,解析为程序
此时会对函数中的程序代码,执行预解析
预解析的无下线
即是不会执行的程序,也会执行预解析
预解析,一般多用于函数的提前调用
偶尔会用于给变量赋值默认值
在之后的3阶段项目中,有从接口中调用数据,会用到预解析,是给变量赋默认值
2,作用域
全局作用域:在函数之外定义的变量
局部作用域:在函数之内定义的变量,参数
局部作用域变量,默认在函数外部是无法调用的,否则 会报错
之后会讲 闭包 可以调用函数内部的变量
调用:
优先调用当前作用域的变量
如果当前作用域没有,找父级作用域调用
都没有,报错
赋值:
优先赋值当前作用域变量
如果当前作用域没有,找父级作用域赋值
都没有,赋值语句,升级为定义变量语句,并且定义全局作用域变量
一.函数的基本概念介绍
1.什么是函数(函数定义):
实现固定功能的代码块
(也就是)函数是一个工具,是实现功能的工具
函数是通过其中的代码,来实现所谓的功能
2.函数的特点/优点:
封装: 将需要的代码,写入到函数中
重复使用: 一个函数可以反复调用
任意位置调用: 可以在任意需要位置上调用执行代码
3.函数的定义/函数的封装
函数的定义/封装 有固定的语法形式
1,关键词 : function
2,函数名称 : 符合变量的命名规范
3,函数的参数 : 函数的执行数据
4,函数的程序 : 封装在函数{}中的程序内容
5,函数的返回值 : return 定义函数的返回值,并且会终止之后函数程序的执行
function 函数名称(函数的参数){
函数的代码;
return 内容;
}
function 定义函数/封装 的关键词,作用类似于 关键词var
告诉计算机程序,我正在封装的是一个函数
函数名称 也就是这个函数的名称,之后调用函数时,是通过函数名称来调用函数,并且执行函数
函数的参数 执行函数时,输入给函数的数据信息
函数的代码 定义在{}中的程序,是函数执行时,调用的程序内容
return 函数的返回值;
4.函数的封装/函数的定义
函数封装时,程序并没有被执行,只有在函数调用时,程序才会被执行
function fun(){
console.log(123);
}
函数的调用和执行
fun();
5,定义函数阶段,只是将程序定义在函数内,程序并没有执行
只有在调用函数时,封装在函数内部的程序,才会被执行
6,函数命名的规范 --- 与变量的命名规范相同
规则 : 只能使用 数字,字母,下划线_,美元$
不能以数字开头
区分大小写
规范 : 见名知意
驼峰命名法
7,所谓的封装,就是将程序,放在 函数的 { } 中,就是函数程序的封装
8,函数的调用
调用执行执行,必须使用函数的固定语法, 函数名称() 的方式来调用函数
二.函数的定义方式
JavaScript中,函数的定义方式/语法
1,声明方式
通过关键词,function 来定义和声明函数
封装函数,但是函数不会执行
也就是我现在组装好了一个微波炉,但是就放在那儿没有用
function fun1(){
console.log('我是声明方式定义的函数1');
}
调用函数,执行执行
相当于我在这里使用微波炉
fun1();
2,匿名函数 / 赋值方式
定义函数时,不定义函数,名称,将函数赋值给一个变量
然后通过调用变量名称()的形式来调用函数
var fun2 = function(){
console.log('我是匿名函数,也叫赋值方式,定义的函数');
};
调用时,是通过变量名称()来调用函数
fun2();
在定义函数之前,先调用函数
1.声明方式定义的函数,可以正常执行
fun1();
2.赋值方式 / 匿名函数,不能正常执行,会报错
fun2();
定义函数的语法的区别
声明方式: 可以在程序的任意位置上,调用函数,甚至可以在定义函数之前,就调用函数,执行函数
赋值方式/匿名函数: 只能在定义函数之后,再调用函数
三.函数的封装和调用
函数在封装时和调用时,计算机的基本执行步骤和执行原理
1,基本数据类型和复杂数据类型,在定义和存储数据时的区别
基本数据类型 : 布尔 数值 字符串 undefined null
复杂数据类型 : 对象 数组 函数
在计算机存储数据的过程中,将变量,存储在内存当中
在内存中计算机程序执行是,将内存中的存储空间虚拟的分成了两个部分
栈 和 堆 两个部分 来存储数据
基本数据类型,都存储在 栈 当中
复杂数据类型,都存储在 堆 当中
1,栈 存储基本数据类型
变量名称存储的是数值数据
2,堆 存储复杂数据类型
变量名称存储在栈中,其中存储的是函数的内存地址
函数存储在堆中,有一个内存地址
调用变量,通过内存地址,找到函数,执行函数中的程序
var a = 100;
这是在定义一个基本数据类型
a = 100 存储在 栈 中
变量名称 a 中 存储的就是 数值100
调用变量a,就是调用其中存储的数据100
var b = function (){}
这是在定义一个复杂数据类型
function(){} 函数存储在 堆 当中,并且计算机操作系统,给这个函数定义了一个 内存地址 例如 0f0
b 这个变量 存储在 栈 当中
b 这个变量 存储的是 函数的内存地址 0f0
调用变量b , 实际上是调用 0f0 这个地址 , 找到地址对应的函数 , 调用函数中的程序
四.函数的参数
参数:是函数执行时,定义的数据,或者是执行的对象,内容等
定义一个累加求和的函数
在函数的()中,来定义函数的参数
参数定义,也就是定义函数使用的两个变量
function add(min,max){
var res = 0;
for(var i = min ; i <= max ; i++){
res += i;
}
console.log(res);
}
add(1,100); → 5050
add(1,10); → 55
add(90,100); → 1045
五.函数的返回值
定义累加求和函数
定义在函数内部的变量,参数等,在函数外部不能直接使用
相当于冰箱里的熊猫,不能直接拿出来用,必须要打开冰箱门,才能获取到熊猫
return关键词的作用
1,定义函数的返回值
如果没有 return , 函数的返回值是 undefined
2,return会终止之后,函数程序的执行
function add(min , max){
var res = 0;
for(var i = min ; i <= max ; i++){
res += i;
}
return res;
}
var a = add(1,100);
console.log(a);
六.封装函数的基本步骤
1,定义程序来实现功能的需求
2,定义函数,将程序放在{}中,封装程序
3,定义参数
4,定义返回值
5,考虑容错机制
函数的执行,对于参数是要有要求的,如果参数出现问题
要么终止程序的执行,要么对参数进行处理
方式1: 使用return来终止函数的执行
在switch判断和循环语句中,可以使用break来终止程序
在函数中药终止函数的执行,不能使用break
需要使用return关键词;
方式2: 对数据进行调整
以上两种方法,在下面有举例
6,考虑函数参数的默认值
7,给函数定义函数说明
代码规范中规定,所有的自定义函数,都要写函数说明
每个公司对于函数说明的语法规范都不相同,我们现在先了解一个基本格式
函数说明 param 参数的意思 是对参数的说明
一般写 参数的名称 数据类型 作用
return 返回值的意思 是对返回值的说明
return 返回值的名称 数据类型 作用
@param min int 累加求和的起始数值,默认值是1,整数类型
@param max int 累加求和的终止数值,整数类型
@return res int 累加求和的结果,整数类型
函数功能作用的描述:
累加求和函数,默认累加求和的起始值是1,终止值需要输入,累加求和的结果是res
对于输入数据的大小顺序有容错处理
对于输入数据的类型判断,有待后期增加
封装累加求和函数
默认是从1开始执行累加
给形参定义默认值是1,并且写在形参的最后
function add(max,min=1){
// 理论上,第一个参数,应该是较小值,第二个参数应该是较大值
// 方式1 使用return来终止函数程序的执行,并且返回自己定义的报错信息
if(min > max ){
return '您的参数输入有误,请检查参数';
}
// 方式2 对数据进行调整
// 数据交换存储,也就是 min 和 max 存储数据,相互交换
if(min > max){
var middle = 0;
middle = min;
min = max;
max = middle;
}
// 实现函数功能的程序
var res = 0;
for(var i = min ; i <= max ; i++){
res += i;
}
// 定义函数的返回值
return res
}
console.log( add(20,100) );
七.函数参数的默认值
因为实参赋值是有顺序的 带有默认值的形参,一般都写在形参的最后
正常定义函数和参数
function fun(name,age){
console.log(`姓名是${name},年龄是${age}`);
}
函数执行是输入实参
fun('李四' , 180);
给形参定义默认值 给函数的参数定义默认值 语法与给变量赋值是相同的语法 形参 = 数值
function fun2(name,age=18){
console.log(`姓名是${name},年龄是${age}`);
}
调用执行函数时,如果没有对应形参赋值 王五 只是给 name 形参赋值 age 形参在调用函数时 没有赋值实参 就执行 定义的默认值
如果有赋值,执行的是重复赋值,定义的实参会覆盖定义的默认值
如果形参,没有默认值,也没有赋值实参,也就是形参没有赋值 执行结果是undefined
fun2('王五'); → 姓名是王五,年龄是18