本篇主要体验JavaScript函数的声明、函数参数以及函数闭包。

□ 函数的声明

※ 声明全局函数

通常这样声明函数:

        function doSth() {
            alert("可以在任何时候调用我");
        }

通过这种方式声明的函数属于Window对象,可以在任何地方调用,即在doSth方法的之前和之后都可以调用。

可以在doSth方法之前调用:

        doSth();
        function doSth() {
            alert("可以在任何时候调用我");
        }

可以在doSth方法之后调用:

        function doSth() {
            alert("可以在任何时候调用我");
        }
        doSth();

※ 把函数赋值给变量

        var doSomething = function() {
            alert("只能在声明我之后再调用");
        };

不可以在doSomething方法之前调用:

        doSomething();
        var doSomething = function() {
            alert("只能在声明我之后再调用");
        };

以上,报"undefined funciton ..."错。

可以在doSomething方法之后调用:

        var doSomething = function() {
            alert("只能在声明我之后再调用");
        };
        doSomething();   

□ 函数参数

※ 即使声明的函数没有参数,也可以在调用时传入参数

        doSth("你好");

        function doSth() {
            alert(arguments[0]);
        }

输出结果:你好

※ arguments.callee属性表示函数引用

        doSth("你好");

        function doSth() {
            alert(arguments.callee);
        }


以上,在函数内部使用arguments.callee属性表示的是函数本身。

※ arguments.callee()方法递归调用函数

        doSth();

        function doSth() {
            alert("你好");
            arguments.callee();
        }

输出结果:不断显示"你好"

□ 函数闭包

※ 闭包的形成

先看下面代码:

        function doSth(val) {
            return function() {
                alert(val);
            };
        }

        var fn = doSth("hello");
        fn();

输出结果:hello

在doSth方法内部返回一个匿名函数,通过fn()执行匿名函数,把doSth方法的参数变量val打印了出来。在这里,doSth方法内部的匿名函数被称作"闭包"。换句话说,我们在内存上创建了一个匿名对象。

※ 闭包的释放

如果在调用fn方法之后,通过fn=null,把fn设置为null,首先匿名函数所占内存被释放,接着,由于变量val不再被引用,val所占内存被释放,最后释放doSth所占内存。

※ 过多的"闭包"会增加内存开销

        function doSth(val) {
            return function() {
                alert(val);
            };
        }

        var fn = doSth("hello");
        var fn2 = doSth("hello2");

        fn();
        fn2();
        fn();

输出结果:依次显示hello, hello2, hello

无论是调用fn方法,还是fn2方法,都会在内存上创建匿名对象,消耗更多的内存。

※ 使用"闭包"创建module

举例:声明一个函数用来创建唯一的ID

        var i = 0;

        function CreateUniqueName() {
            var name = "name" + i;
            i = i + 1;
            return name;
        }

        var name1 = CreateUniqueName();
        var name2 = CreateUniqueName();

        alert(name1 + " " + name2);

输出结果:name0 name1

以上存在几个问题:
1、创建的函数不是全局的,只能在当前页使用
2、变量i和方法CreateUnqiueName都是全局的,这可能会造成与第三方代码的名称冲突

所以,我们应该把以上的逻辑写成全局,并做成一个module,并自定义名称。

       var myUtilty = (function() {
           var i = 0;
           return {
               CreateUniqueName: function() {
                   var name = "name" + i;
                   i = i + 1;
                   return name;
               }
           };
        }());

        var name1 = myUtilty.CreateUniqueName();
        var name2 = myUtilty.CreateUniqueName();

        alert(name1 + " " + name2);

○ (function(){}());被称作是匿名、自触发函数,返回一个json对象,并且只执行一次
○ 正因为匿名、自触发函数只被执行一次,所有全局只有一个myUtitly对象,不会过多消耗内存
○ json对象的键CreateUniqueName对应一个匿名方法  
○ 匿名、自触发函数可以被看作是全局的、唯一的"闭包"

“JavaScript进阶系列”包括:

JavaScript进阶系列01,函数的声明,函数参数,函数闭包

JavaScript进阶系列02,函数作为参数以及在数组中的应用

JavaScript进阶系列03,通过硬编码、工厂模式、构造函数创建JavaScript对象

JavaScript进阶系列04,函数参数个数不确定情况下的解决方案

JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数

JavaScript进阶系列06,事件委托

JavaScript进阶系列07,鼠标事件

JavaScript进阶系列01,函数的声明,函数参数,函数闭包的更多相关文章

  1. JavaScript进阶系列04,函数参数个数不确定情况下的解决方案

    本篇主要体验函数参数个数不确定情况下的一个解决方案.先来看一段使用函数作为参数进行计算的实例. var calculate = function(x, y, fn) { return fn(x, y) ...

  2. JavaScript进阶系列02,函数作为参数以及在数组中的应用

    有时候,把函数作为参数可以让代码更简洁. var calculator = { calculate: function(x, y, fn) { return fn(x, y); } }; var su ...

  3. JavaScript进阶系列07,鼠标事件

    鼠标事件有Keydown, Keyup, Keypress,但Keypress与Keydown和Keyup不同,如果按ctrl, shift, caps lock......等修饰键,不会触发Keyp ...

  4. JavaScript进阶系列06,事件委托

    在"JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数"中已经有了一个跨浏览器的事件处理机制.现在需要使用这个 ...

  5. JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数

    本篇体验JavaScript事件的基本面,包括: ■ 事件必须在页面元素加载之后起效■ 点击事件的一个简单例子■ 为元素注册多个点击事件■ 获取事件参数 ■ 跨浏览器事件处理 □ 事件必须在页面元素加 ...

  6. JavaScript进阶系列03,通过硬编码、工厂模式、构造函数创建JavaScript对象

    本篇体验通过硬编码.工厂模式.构造函数来创建JavaScript对象. □ 通过硬编码创建JavaScript对象 当需要创建一个JavaScript对象时,我们可能这样写: var person = ...

  7. 深入理解javascript作用域系列第三篇——声明提升(hoisting)

    × 目录 [1]变量 [2]函数 [3]优先 前面的话 一般认为,javascript代码在执行时是由上到下一行一行执行的.但实际上这并不完全正确,主要是因为声明提升的存在.本文是深入理解javasc ...

  8. JavaScript学习系列博客_18_JavaScript中的匿名函数

    匿名函数 - 用函数声明的方式创建一个函数时,不加函数名称. function sum(){ console.log("我是函数sum")} - 不加名称,这样写浏览器是会报错的. ...

  9. javascript进阶系列专题:作用域与作用域链

    字面意思,作用域是指变量和函数的作用范围,换言之,作用域决定了变量和函数的可见性和有效时间.javascript作用域是用函数来区分,与其他语言的大括号不同. for (var i=0; i<5 ...

随机推荐

  1. MySQL Dual-Master 双向同步

    本文介绍的Mysql Dual-Master 复制实施方法可能不是最完美.最强大的.但是在我的应用环境下能很好的满足各项需求. 本文基于我们仅仅使用两台MySQL服务器的情况下,但是你会发现文章中介绍 ...

  2. linux usb枚举过程分析之守护进程及其唤醒【转】

    转自:http://blog.csdn.net/xuelin273/article/details/38646765 usb热插拔,即usb设备可以实现即插即用,像U盘一样,插到电脑里就可以用,不用时 ...

  3. springcloud Eureka自我保护机制

    自我保护背景 首先对Eureka注册中心需要了解的是Eureka各个节点都是平等的,没有ZK中角色的概念, 即使N-1个节点挂掉也不会影响其他节点的正常运行. 默认情况下,如果Eureka Serve ...

  4. nginx开启gzip压缩前端css,js

    利用nginx实现前后端分离, nginx配置文件,nginx.conf配置采用gzip压缩: 在server中添加: gzip on; #开启gzip gzip_min_length 1k; #低于 ...

  5. K-means聚类算法的三种改进(K-means++,ISODATA,Kernel K-means)介绍与对比

      一.概述 在本篇文章中将对四种聚类算法(K-means,K-means++,ISODATA和Kernel K-means)进行详细介绍,并利用数据集来真实地反映这四种算法之间的区别. 首先需要明确 ...

  6. flask你一定要知道的上下文管理机制

    前引 在了解flask上下文管理机制之前,先来一波必知必会的知识点. 面向对象双下方法 首先,先来聊一聊面向对象中的一些特殊的双下划线方法,比如__call__.__getattr__系列.__get ...

  7. SqlServer自定义函数Function中调用with as

    SET QUOTED_IDENTIFIER ON 标识符可以由双引号分隔,而文字必须由单引号分隔 SET QUOTED_IDENTIFIER OFF 标识符不可加引号,且必须遵守所有 Transact ...

  8. 高能天气——团队Scrum冲刺阶段-Day 6

    高能天气--团队Scrum冲刺阶段-Day 6 今日完成任务 于欣月:完善计步器功能:实现了历史步数统计和设置锻炼计划功能,并实现可视化图形界面 余坤澎:将闹钟部分和小游戏部分进行了合并 康皓越:配合 ...

  9. 关于Sql Server的一些知识点的定义总结

    数据库完整性:是指数据库中数据在逻辑上的一致性.正确性.有效性和相容性 实体完整性(Entity Integrity  行完整性):实体完整性指表中行的完整性.主要用于保证操作的数据(记录)非空.唯一 ...

  10. Ubuntu美化及配置,常见问题解决方案

    安装符合审美观,并且具有可用性的Ubuntu桌面,需要耗费一些时间与精力不过,相信我,这值得去做,你会享受这中间的过程,以及最后的成果 首先,我推荐安装的软件列表如下,在安装前,需要先执行以下的步骤: ...