博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
体验javascript之美-第五课 匿名函数自执行和闭包是一回事儿吗?
阅读量:7067 次
发布时间:2019-06-28

本文共 2829 字,大约阅读时间需要 9 分钟。

通过本节课你将学到:

1.什么是函数表达式和函数声明

2.first-class function

3.引用和复制的区别

4.函数传参是怎么回事儿

5.关于函数的this和arguments

6.什么是匿名函数自执行并如何在实际库中应用

7.闭包是怎么回事儿?

8.闭包的原理和在jquery中的应用

9.从一到面试题彻底理解闭包和垃圾回收机制

10.回调函数是什么?

概述

在javascript中,有些看起来很复杂却又很好理解的东西,但是理解他们需要一定的技巧同时理解他们又非常的重要,了解了他们就给你打开了一扇门,让你知其然还能够知其所以然。因为他们紧密结合,自成一体。今天我们来说说这些既简单有重要的东西。

1.什么是函数表达式和函数声明

​ 大家已经知道函数就是特殊的对象,然后大家也了解函数声明和函数表达式了。

//函数声明        function show(){            console.log(12);        }             //函数表达式        var show = function(){            console.log(5);        };

2.看到函数表达式也没啥奇怪的,因为函数是对象,那把一个对象赋值给一个变量或者当成参数传递都是可以的。

//函数表达式        var show = function(){            console.log(5);        };                  function Simple(show){              show();        }        //或者更直接        function Simple(){                      }        simple(function(){});

函数能像数字一样赋值给变量传递给参数的现象就叫做 first-class function,没啥难的吧。

3.说到了对象我们就说下引用和复制的区别。

var a = 12;var b = a;b+=5;alert(a);//12

这个没啥好解释的,b复制一份儿啊,b怎么改跟a无关。

var arr1 = [12,5,8];var arr2 = arr1;arr2.pop();alert(arr1);//12,5

我擦嘞,发生了什么?

记住一句话,基本类型的复制是直接拷贝一份儿跟原来的无关,而对象复制仅仅是把地址指向复制了一份儿。

我有一个馒头,基本类型复制就相当于照着我的馒头又给你做一个,吃了你的馒头我手里的没影响。

我有一把钥匙,能开一个合租房的门,对象复制是引用,就是复制了一把钥匙,你把厕所给拆了,我也嘚憋着。理解了不?

4.函数传参这个我只是说一句,这个是很多开发者犯错的地方,这里不解释我一解释你上下都不明白了只是告诉你就行。

访问变量有按值和按引用两种方式,但是参数只能是按值传递。参数类型是基本类型时,被传递的值被复制给一个局部变量,而复合类型复制的是地址。

好吧,直接上一个例子吧。可以慢慢领悟吧。

function setName(obj){  obj.name = "尼古拉斯·屌·大彬哥"  //重点  obj = new Object();  obj.name = "帅彬"}var Person = new Object();setName(Person);alert(Person.name);

5.关于函数的this和arguments

js里面最恶心的东西,没有之一。下面我说说this.这里我只说函数里面的this.

function show(){console.log(this);}//windowvar show = function{console.log(this);}//window

注意了,

var person = {        name:"leo",        show:function(){             this.name = 'leolau';              console.log(this);//person对象 object        }};

但是这里有个奇怪的事情,很多人认为是bug,面试也经常考。

var person = {        name:"leo",        show:function(){             this.name = 'leolau';              console.log(this);//person对象 object              var bug = function(){              console.log(this);//window            }            bug();        }   };

如何解决?

var person = {        name:"leo",        show:function(){            var that = this;             this.name = 'leolau';              console.log(this);//person对象 object              var bug = function(){              console.log(that);//person            }            bug();        }   };

至于arguments给大家一个实际应用。未知参数个数不定求和。大家想想怎么做?

6.什么是匿名函数自执行并如何在实际库中应用

匿名函数自执行,注意,注意,只有这个名字和iife没有其它名字,比如封闭空间,这个是为了让大家好理解自己造的词语。他的一个重要用途就是防止命名冲突,另外是组织和架构库,比如jquery.

命名冲突

a.js

var a = 12;

b.js

var a = 5;

同时引用a,b后面覆盖前面了就。怎么防止命名冲突前后覆盖。

var a = 12;(function(){      var a = 5;})();

这里iifes里面的a并不会干扰外面的a,那么问题来了,万一我就想改外面的a,呢?

这也是很多jquery库的做法,这么搞:

(function(global,$){    $.a = 12;    global.a = 5;  })(window,jquery);

既满足了外面的修改,又做到了防止变量污染。闭包下节课再说困了。

下节课单独说闭包,垃圾回收,回调函数和定时器。

转载地址:http://vzall.baihongyu.com/

你可能感兴趣的文章
Trivial File Transfer Protocol (TFTP)
查看>>
C++版 - LeetCode 144. Binary Tree Preorder Traversal (二叉树先根序遍历,非递归)
查看>>
前端开发之旅-zopim在线即时聊天客服
查看>>
c++模板实现抽象工厂
查看>>
节日营销!这样搞-App运营日常
查看>>
谁是“少数幸福的人”?
查看>>
坦克大战--Java类型 ---- (2)按键设置和用户名的输入
查看>>
手机操作系统:自主力量能否崛起
查看>>
Shell在大数据时代的魅力:从一道百度大数据面试题想到的点滴
查看>>
说说參数传递(泛型托付)
查看>>
CentOS6.10下安装mysql-5.7.24
查看>>
【C#公共帮助类】 ToolsHelper帮助类
查看>>
八皇后问题
查看>>
切蛋糕
查看>>
关于对于CSS的字体单位
查看>>
TCP协议学习总结(上)
查看>>
敏捷 扑克上的时间估算(转)
查看>>
从JDBC程序看为什么需要Mybatis
查看>>
jQuery Ajax
查看>>
压缩感知中的数学知识:稀疏、范数、符号arg min
查看>>