温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

好程序员web前端学习路线分享函数基础

发布时间:2020-07-20 08:28:52 来源:网络 阅读:180 作者:wx5d42865f47214 栏目:开发技术

好程序员web前端学习路线分享函数基础,在这之前先来讲一下函数是什么?

函数就一个代码块,可以是一个完全独立与其它内容没有关系的代码块,也可以是一个与外界环境紧密相关的代码块。函数是一个拥有输入和输出的独立代码块。函数是程序中最重要的组成部分。

函数,是一种封装(将一些语句,封装到函数里面)。通过函数可以封装任意多条语句,而且可以在任何地方、任何时候调用执行。

在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="<ul>";

    for(var i=0;i<n;i++){

        ul+="<li>列表"+(i+1)+"</li>";

    }

    ul+="</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

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI