好程序员web前端学习路线分享函数基础,在这之前先来讲一下函数是什么?
![865823439f4c57f3d86a9eed48a1f003.png](https://i-blog.csdnimg.cn/blog_migrate/737c3884aa9d281b95463d98c5c46a07.jpeg)
好程序员
函数就一个代码块,可以是一个完全独立与其它内容没有关系的代码块,也可以是一个与外界环境紧密相关的代码块。函数是一个拥有输入和输出的独立代码块。函数是程序中最重要的组成部分。
函数,是一种封装(将一些语句,封装到函数里面)。通过函数可以封装任意多条语句,而且可以在任何地方、任何时候调用执行。
在javascript里,函数即对象,程序可以随意操控它们。函数可以嵌套在其他函数中定义,这样它们就可以访问它们被定义时所处的作用域中的任何变量,它给javascript带来了非常强劲的编程能力。
函数的功能、好处:
1) 将会被大量重复的语句写在函数里面,这样以后需要这些语句的时候,直接调用函数,不用重写那些语句。
2) 简化编程,让编程变的模块化。
函数的声明
函数有三种声明的方法,而且有各自不同的特点。
1、普通函数声明
函数关键字 + 函数名 + (){
语句
函数体
}
例如:
function functionName(){
alert("程序员的摇篮");
// ...语句//
}
注:1.函数命名跟变量一样,只能是字母、数字、下划线、美元符号,不能以数字开头。
2.后边()里放参数用的
函数名的规范:
1、普通的函数使用,名称需要驼峰式命名法,即函数是多个词组构成时,第一个单词的首字母小写,其余的单词首字母大写。函数名不能与关键词和保留字重复,不能与变量名重复。
2、类的构造函数,是驼峰式命名,但是第一个单词首字母需要大写。
2、匿名函数声明
var 变量名称 = function (){
函数内容
}
var funName=function () {
//函数内容
};
定义一个匿名函数,所谓匿名函数就是没有函数名。但是匿名函数定义后如果不保存在一个变量中,就找不到了,因此,我们通常会用一个变量接收这个匿名函数。
匿名函数尾部结束时需要用;来结束,普通的函数结束后不用;结束的。
var funName=function abc() {
//函数内容
console.log(abc);
}
匿名函数也是可以定义函数名称的,只不过比的地方不能使用,只能在函数内部使用。
3、Function构造函数声明
使用Function构造函数
var box=new Function('num1','num2','retun num1+num2');//num1,num2参数
num1,num2参数, 最后的字符串是函数体
注意:第三种方式我们不推荐,因为这种语法会导致解析两次代码(第一次解析常规JS代码,第二次是解析传入构造函数中的字符串),从而影响性能,但我们可以通过这种语法来理解函数是对象,函数名是指针的概念。
函数的存储
JavaScript程序是一种解释性语言。那么什么时候解释性语言呢。
计算机其实并不认识程序,不管是什么代码计算机都不认识,因为计算机只是机器,如果我们需要让计算机认识程序,那么就需要一个翻译,就是把程序代码变成计算机可以理解的语言:0和1的信息序列。目前存在两种翻译类型:一个是编译,一个是解释。两种方式都需要对代码进行翻译,只是翻译的时间不同而已。
编译型语言在计算机运行代码前,先把代码翻译成计算机可以理解的文件,这种文件计算机就能看懂了,但是不管是程序员还是其他人员都看不懂的。并且这种代码,计算机可以执行了,但是每次我们需要修改代码时都需要修改源代码,然后再进行编译新的文件才可以使用,也就是不能再编译好的文件上修改。这种代码的优势是运行速度快,在执行前就知道代码是否错误,因为编译时就做了判断。
解释型语言则不同,解释型语言的程序不需要在运行前编译,在运行程序的时候才翻译,专门的解释器负责在每个语句执行的时候解释程序代码。这样解释型语言每执行一次就要翻译一次,效率比较低。而且执行时才知道代码是否错误。
而JavaScript就是解释性语言。但是注意程序在运行的时候,解释器首先会收集所有的普通定义的函数,并且把他们存储在堆里,这时候才从头开始执行代码。
abc();
function abc() {
}
例如我们看到这里abc的执行在函数的上面,如果按照代码的执行顺序,应该先执行abc,再创造函数,那么显然就会报错。但是这样不会有问题。就是说明,函数首先会被收集在堆里,不管在哪里调用,都是调用堆里的函数,因此普通定义的函数执行时可以写在前面或者写在后面。
但是注意如果我们使用匿名函数这种情况就不同了。虽然我们会收集匿名函数在堆里,但是如果找到它时,我们就需要在把它赋给一个变量以后才可以执行,否则就会报错。
abc();
var abc=function () {
}
这是错误的。
例如上面这种就是错误的。
函数的参数
参数是指由外部传入到函数中的变量,仅作为变量使用,但是该变量可以是任何内容,包括函数。
被传入的参数作为局部变量使用,可以被覆盖掉。
参数就是一个局部变量,通过外界传入值,这个参数就是对应的值。参数是按照顺序填入的。参数在JavaScript中不要求写入参数的类型和默认值,如果需要默认值,就需要在函数中,根据条件判断增加默认的值。有时候我们可以不用定义参数,直接在函数调用时,带入参数,也可以获取到。(不建议大家使用)
为什么要从外部带入参数。一般来说函数是独立处理某段代码的集合,如果,这段代码需要重复执行,就会设计出函数,在不同的地方调用,达到代码共用的目的,减少代码量。但是在某些时候,虽然是同样的代码,但是我们需要它发挥出的作用更大,可以解决不同的问题,这时候,传入的参数就可以起到代码干预作用,在同一个函数中解决了很多不同的问题。这时候设计函数的独立性就显得非常重要了。当然,任何事情解决都不是绝对的,过度设计复杂的函数有时候反到会让代码效率降低。
同时,外部传入的参数可以节省全局变量的定义,甚至保证函数中的部分变量的独立性。
参数分为实参和形参。
实参:真实的数值、字符串
形参:一个接收实参的变量
例如这里是通过一个函数中的参数来控制在页面上添加多少个li
var m=5;
createUl(m);
function createUl(n) {
if(n<1 || isNaN(n)) n=1;
var ul="
- ";
for(var i=0;i
ul+="
列表"+(i+1)+"";}
ul+="
";document.write(ul);
}
函数的返回值
return 语句会终止函数的执行并返回函数的值。return 是javascript里函数返回值的关键字,一个函数内处理的结果可以使用return 返回,这样在调用函数的地方就可以用变量接收返回结果。return 关键字内任何类型的变量数据或表达式都可以进行返回,甚至什么都不返回也可以
abc(3,5);
function abc(a,b){
return a+b;
}
注意return只能返回一个值,如果需要返回多个数据时可以考虑数组或者对象,例如
function abc() {
return {a:1,b:2};
}
return 也可以作为阻止后续代码执行的语句被使用,例如
var bool=false;
var i=0;
function abc(){
if(bool) return;
i++;
}
这样可以有效的控制语句在一定的条件下执行,不过一定要与break区分,break是用在条件当中,跳出的也仅仅是条件和循环,但是return 却可以跳出函数,仅仅是针对函数使用,如果没有函数是不能使用return的。
abc();
function abc() {
for(var i=0;i<10;i++){
if(i===3){
// break;
return;
}
}
i+=5;
console.log(i);//i=8
}例如上面的例子,如果使用break,就会打印i的值是8,如果使用return,就不会打印了,因为return直接跳出了函数。
函数的执行
函数的执行分为两种
1、普通函数执行
函数执行 :函数名()
执行后,可以完成函数的代码内容,如果函数内有return 值,这时候执行后会返回该值。
function abc() {
return 3+4;
}
var s=abc();
如何没有return,则执行完所有代码
2、函数独立执行
函数自身是可以独立执行的,并且也可以把独立执行的结果赋值给一个变量。
var s=0;
(function(){
s=4+5
})();
左边是匿名函数自己执行,右边是匿名函数赋值
注意匿名函数用小括号括住,最后再执行小括号。
注意,除了匿名函数可以独立执行,实名函数也是可以独立执行的,不过这种独立执行就不能在该函数中添加参数了,并且匿名函数,也只能在此执行一次,不能多次调用,显而易见的好处是,该函数内的变量统统是私有变量,有关该部分内容我们在后面详细说明
函数的删除
当函数不在使用时,就需要删除,函数也是对象,如果不删除,它将常驻内存中,如果该函数不再使用就可以使用删除彻底清除掉该函数。但是只有函数是匿名定义的或者通过构造函数创建的才可以被删除。
函数删除分两种
1、匿名函数删除
函数=null
2、对象下函数删除
delete obj.fun