鸿蒙应用开发-第二章-函数(上)

Tips:这个只是作者的学习笔记,仅作参考  

一.概念

 函数可以理解为是一个具备某功能的工具,是实现某功能的一段代码.具体用法就是将要运行的代码使用function包裹,而后需要时再进行调用

        例如下:

    function fn(n) {
        // 九九乘法表
        for (var a = 1; a <= n; a++) {
            for (var b = 1; b <= a; b++) {
                document.write(b + '*' + a + '=' + a * b)
                document.write('&nbsp;')
            }
            document.write('</br>')
        }
    }
    fn(5)

        但也不是非得自己去定义函数的内容,因为js中本身就存在可供我们使用的函数,其名为内置函数,由我们自己进行定义的函数名为自定义函数 

(一)内置函数、 

        js中本身就存在的,供我们随时使用

            Number()
            String()
            Boolean()
            isNaN()
            typeof()
            console.log()
            document.write()
            prompt()
            confirm()
            数字.toString()
            数字.toFixed()
            .......

 (二)自定义函数、

         语法:

            function 函数名(){
                代码段
            }

        例如下:

    function fn(n) {
        for (a = 1; a <= n; a++) {
            console.log('靓仔正');
        }

    }
    fn(2)

二.函数的调用

        (一)定义语法

         当我们定义好函数,并在页面中刷新的时候,会发现这段代码并没有被执行。因为函数定义好后,是不会自动执行的,需要我们进行调用。

function 函数名(){
	代码段
}
# function是一个关键字,函数名自定义,定义规则和变量的定义规则相同

        (二).函数的调用

         语法:其实就是将函数内部的代码执行

        函数名()

        调用的语法很简单,这样我们以后还需要执行函数中的代码的时候,就不用再重写那么多的代码了,只需要简单的将原来定义好的函数进行调用即可。

        例如下:

// 定义函数:求两个数的和
function fn(){
    var a = 1;
    var b = 2;
    var c = a + b;
    console.log(c);
}
// 函数定义好以后,不会自动执行,需要手动调用
fn();
fn()//可以重复调用
//代码功能不够强大,引出下面的内容

        (三).带参数的函数

如果有形参没有被赋值,默认就是undefined
形参实际上就是函数内部定义好的一个变量,没有赋值就相当于一个变量没给值

    // 带参数的函数
    // fn(a,b)-形参-形式上的参数,在函数内部用来占位置的
    function fn(a, b) {
        var c = a + b
        console.log(c);
    }
    // 实参-实际参数,实际上用的参数,用来给形参赋值
    fn(1, 2)

三.函数的本质

         当我们去调用函数的时候,通过函数的名称就可以调用到,那说明我们在定义函数的时候,函数就已经保存起来了,所以下面才能调用起来

        以下是函数定义在内存中的体现

    function fn() {
        console.log(123);
    }
    fn()
    console.log(fn);//把函数这段代码原样输出
    console.log(typeof (fn));//function(函数) - 这是我们学习的第六种数据类型

    // 函数是一个数据,也是一个具体的数据值,那么是否可以把函数赋值给变量?
    // var a = function fn() {
    //     console.log(1234);
    // }
    fn()//当函数赋值给一个变量的时候,调用函数名无效
    a()//当函数赋值给一个变量时,调用函数是-变量名()

        变量跟函数的区别:
        定义变量后,只知道创作了空间,可以没有数据,函数定义之后,会创建空间并放入数据
        变量只能进行运算,函数只能进行调用 

四.匿名参数

         既然函数的定义与变量的定义过程差不多,那函数的定义就可以像变量一样进行

    var a = function fn() {
        console.log(1234);
    }

         这是定义一个变量,将函数代码放到变量空间中,这样的函数也是可以正常进行调用的,就使用变量的名称就行:

        Tips:当函数赋值给一个变量的时候,调用函数名无效

        当函数赋值给一个变量时,调用函数是-变量名()

    fn()//fn is not defined
    a()//1234

        说明当一个函数赋值给一个变量的时候,函数的名字就没有意义了,所以我们可以将函数名省略

    var a = function() {
        console.log(1234);
    }

         这种没有名字的就是匿名函数

        但是匿名函数不能单独存在,会报错,会被认定为几行代码进行解析,而不是一个整体

    function () {
        console.log(1234);
    }

        解决办法:用个括号包起来

    (function (a, b) {
        var c = a + b
        console.log(c);
    })(a,b)

        下面那个括号干什么用?

        其实可以理解为用于传参的的括号

    var d = function (a, b) {
        var c = a + b
        console.log(c);
    })
    d(a,b)

         匿名函数的作用
        作用1:将没有名字的函数赋值给一个变量
        作用2:将匿名函数用一个小括号括起来,后面再加小括号,这个匿名函数就已经调用了
        这种匿名函数一边定义顺便调用的情况 - 自调用函数

自调用函数不是非得()包住,在函数前加!或者~都行

!function(){
    console.log(14);
}()

~function(){
    console.log(14);
}()

五.带返回值的函数

         之前的函数,在调用后,就是将函数中的代码执行了,没有得到一个结果,如果我们希望函数调用后得到一个结果,在后续的代码中,需要用到这个结果,例:

    // 要求:求三门成绩的和
    function add(ch, math, eng) {
        var result = ch + math + eng
        return result
    }
    add(20, 40, 50)
    console.log(add(20,30,40));// undefined

         再例:

    // 要求:求出三门成绩的平均值
     var avg = result / 3
     console.log(avg);
    // 函数内部的代码是一个独立的区域,跟外面不相通
     var avg = add(20, 30, 40) / 3
     console.log(avg);//NaN

    总结:return的数据给到函数外面使用的时候,谁调用函数就给谁使用return出去的值

        但是什么时候需要return返回值呢?

        如果在调用函数后需要一个结果继续运算,这个时候就要加上返回值

        如果只打算计算出结果,不需要下一步操作,那就不用加返回值

        但是return的用处不只是返回结果,还可以用于结束函数运行

function add(ch,math,en){
    var sum = ch + math + en;
    return sum
    console.log(sum)//我想在这个地方输出sum看行不行
}
add(20,30,40)

         return返回结果只能返回一个结果,并不能返回多个

    function add(ch, math, eng) {
        var sum1 = ch + math + eng
        var sum2 = ch + math
        // console.log(sum1);
        // console.log(sum2);

        // 写一起后面会覆盖前面的
        // return sum1,sum2

        // 哪怕是分行也会只输出上面的
        return sum1
        // return sum2
    }
    add(20, 30, 40)
    console.log(add(20, 30, 40) + 20);

        return总结:

  1. 终止代码继续运行

  2. 函数运行后返回一个结果,只能返回一个

六.预解析

         预解析JS代码

        预解析的过程,就是查找代码中的var和function这两个关键字,找到以后将变量和函数提前存到内存中,并且赋给他们一个初始值,变量的初始值为undefined,函数的初始值为代码段

    console.log(a);//undefined
    var a = 5

        以上代码拆解分析后应该是:log()会先定义一个a,只不过里面没有东西,然后直接输出,不会去读取

    var a
    console.log(a);
    fn()
    function fn() {
        console.log(123);
    } 

        预解析总结:

  1. 匿名函数赋值给变量的定义方式,预解析时遵循变量的预解析规则,不会将函数代码预解析

  2. 预解析的时候,会将定义提前放在内存中,不会提前将赋值放在内存中

  3. 如果变量名和函数名同名了,保留函数预解析,忽略变量预解析

    因为函数预解析其实包含了赋值的过程,函数定义放在内存中的时候将函数的代码也放在内存中

    变量的预解析只有空间,没有值,所以如果是先预解析变量,那后面的函数预解析赋值就将空间中放入了值,如果是先预解析的函数,再次预解析变量的时候,空间已经存在了,再次定义空间也是没有意义的。

  4. 省略var定义的变量是不会有预解析的

  5. js代码如果报错了,那后面的代码就不会执行了

  6. 不会执行的代码中有变量或函数定义也会预解析,因为预解析在执行之前

七.函数的嵌套       

        函数结构中的大括号,里面放的是代码段,既然是代码段,就可以写判断、循环甚至函数代码,这样就形成了函数的嵌套。

        函数外面定义的东西可以在函数里面用,
        函数里面定义的东西不能在外面用

        函数的大括号中可以写函数的定义,可以写函数的调用:

function fn(){
    console.log(1)
    function fun(){
        console.log(2)
    }
    fun()
}
fn()

function fn(){
    console.log(1)
}
function fun(){
    fn()
    console.log(2)
  var a = 1
}
fun()
// console.log(a);

相关推荐

  1. 鸿蒙应用开发-第二-函数()

    2024-03-21 18:02:06       20 阅读
  2. 「前端+鸿蒙鸿蒙应用开发-TS函数

    2024-03-21 18:02:06       9 阅读
  3. Vue-前端应用开发平时作业第二

    2024-03-21 18:02:06       15 阅读
  4. Vue-前端应用开发平时作业第二作业2

    2024-03-21 18:02:06       14 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-03-21 18:02:06       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-03-21 18:02:06       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-03-21 18:02:06       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-03-21 18:02:06       20 阅读

热门阅读

  1. 在https网站中加载http资源

    2024-03-21 18:02:06       17 阅读
  2. 洛克王国卡小游戏1

    2024-03-21 18:02:06       18 阅读
  3. 工作需求iview 组件的使用

    2024-03-21 18:02:06       19 阅读
  4. Milvus笔记

    2024-03-21 18:02:06       19 阅读
  5. Web入门

    Web入门

    2024-03-21 18:02:06      16 阅读
  6. docker+k8s相关面试题

    2024-03-21 18:02:06       15 阅读
  7. 循环语句中var与let声明循环变量的区别

    2024-03-21 18:02:06       18 阅读
  8. 防抖节流插件throttle-debounce

    2024-03-21 18:02:06       21 阅读
  9. C++面试100问(十一)

    2024-03-21 18:02:06       17 阅读
  10. 【蓝桥杯】链式前向星

    2024-03-21 18:02:06       20 阅读
  11. python列表的创建、访问、切片和方法

    2024-03-21 18:02:06       20 阅读
  12. MySQL 管理用户授权 DCL

    2024-03-21 18:02:06       18 阅读