前端学习(五十七) JavaScript-函数应用(javaScript)

必须掌握的几种函数基本功

立即执行函数表达式

在开发页面的时候,可能每个人负责不同的模块,因此不希望自己写的模块和别人的产生冲突,所以就会使用立即执行函数表达式,然后在函数中实现自己的业务逻辑

格式为:

            // 语法,另外这是一个匿名函数
            (function () {
                //自己要实现业务的逻辑代码,使用严格模式
                ‘use strict’
            })()

如果要在匿名函数中使用全局变量,可以通过参数传入

            (function (win) {
                //变量win就是window对象

            })(window)

但是,如果实在ES6中,就不需要了,可以使用大括号包裹

{
    let page={

        init(){}
    }
    page.init();

}

甚至可以这么写,连大括号也可以省了,在script上设置一个type=‘’module‘,表明这个就是模块代码

        <script type="module">
             let b={
                x:1
            }
        </script>

闭包

闭包是指访问了另外一个作用域中的变量函数

function foo() {
                var c=1;
                function bar(){
                    return ++c;
                }
                console.log(bar());
                
            }
            foo()

这里的bar()就是一个闭包,因为访问了它的上一级变量

闭包:可以阻止变量被垃圾回收 

function foo() {
                var c=1;
                return function (){
                    return ++c;
                }
                
            }
            var bar=foo(); //对匿名函数有引用,组成了一个闭包,c不会被垃圾回收
            console.log(bar());

闭包应用示例:

function foo() {
                for(var i=0;i<10;i++){
                    setTimeout(function () {
                       console.log(i) //这边输出10个10,因为执行setTime
                    },0)
                }
                
            }
            function foo1() {
                for(var i=0;i<10;i++){
                    function bar(params) {
                        setTimeout(function () {
                       console.log(i) //这边输出0-9
                    },0)
                    }
                    bar(i)
                }
            
            }

这边除了闭包,立即执行函数也可以解决这个问题,另外,不使用var,使用let定义也可以解决

闭包+立即执行函数的应用:封装(信息隐藏)

let obj={
                name:"John",
                getName(){
                    return this.name
                }
            }
            console.log(obj.getName()); //输出john
            //但是我们无法阻止用户直接访问obj.name
            console.log(obj.name);  //输出john

因此为了信息隐藏,我们就使用了闭包+立即执行函数组成了封装

            let obj1=(function () {
                let name="john";
                return {
                    getName(){
                        return name;
                    }
                }
            })()
            console.log(obj1.getName()); //输出john

            console.log(obj1.name);  //输出undefined

这样就只能通过obj1.getName()获取

递归

在函数中调用函数本身,因此使用递归函数就要考虑清除了,尤其是结束条件,否则会出现死循环

回调函数:同步回调,异步回调

前面已经说过,函数是特殊的对象,也是一种值,可以当作参数传递给其他位置

function foo3(n,func) {
                ++n;
                func(n)
            }
            foo3(1,function (n) {
                console.log(n); //2
                
            })

这边的func函数就是回调函数,顾名思义,是要等到回头才来调用的函数,上例中要等到执行到了func(n)时才会调用函数,这边是同步回调,而异步回调,最常见的是ajax的异步请求,等学到dom课程再进一步了解

柯里化

在计算机科学中,柯里化是把接收多个参数的函数变成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接收余下参数的且返回结果的新函数技术

示例:生成唯一的Id函数

            function initId(startId) {
                let id= startId||0; //判断有没有startId这个值,有就返回startId,没有就返回0,等同于startId?startId:0;
                return function (params) {
                    id += params || 1;
                    return id;
                }
            }
            let getId2=initId('10000');
            console.log(getId2(12));    //1000012
            console.log(getId2());    //1000013

很明显,柯里化使用了闭包技术

猜你喜欢

转载自blog.csdn.net/zy21131437/article/details/81386023
今日推荐