继续汤姆大叔的js之旅。

揭秘命名函数表达式

函数表达式和函数声明

  汤姆大叔在博客中引用ECMA规范:函数声明必须带有标识符,函数表达式可以省略。对于我来说这些概念的东西真是不所适从。还是大叔的实例带劲。上实例如下:

function foo(){};//鬼都知道是声明

var bar = function foo(){};//鬼也知道是表达式

new function bar(){};

(function() {

  function bar(){};//这也是声明

})();这些大家看看应该都很好理解。在这里大叔还总结了一点可以在大部分情况下快速的判断是表达式还是函数声明"赋值一定是表达式,不带函数名一定是表达式"。

还有一种函数表达式是不太常见,就是用括号括住的(function foo(){})。这个是表达式的原因很简单括号()是一个分组操作符,而更重要的是分组操作符的内部只能包含表达式。

函数语句

  虽然提到这个,但是现在可能还是存在不支持(chrome浏览器我看是支持的)(这点儿我自己没有细想也没有完全的去理解)。

命名函数表达式

  直接上实例var bar = function foo(){};这是有效的命名函数表达式,大叔特意强调新定义函数作用域内有效。看大叔的这个例子吧,看懂就理解了:

function foo(){return bar();}

var bar = (function(){

  if(window.addEventListener){

    return function bar(){

      return baz();

    };

  }

  else if(window.attachEvent){

    return function bar(){

      return baz();

    };

  }

})();

function baz(){

  debugger;

}

foo();

我们来看看这些函数调用过程:foo->bar;而bar是一个命名函数表达式,由内部的两次返回之后是baz,也就是说baz被bar调用。bar->baz;baz内部调用debugger。

  js的bug

  • 函数表达式的标识符泄露到外部的作用域;实例1
  • 将命名函数表达式同时作为函数声明和函数表达式;实例2
  • 命名函数表达式创建两个截然不同的函数对象;实例3
  • 仅仅顺序解析函数声明而忽略条件语句块;实例4

  实例1:var f = function g(){};typeof g;//“function”;亲自在IE8上测试成功。这是不应该的,标识符g被解析成函数,可能前端程序员在写程序的好多时候的bug就是这样引起的。

  实例2:var typeof g;var f = function g();同样在ie8下是function,在chrome下是undefined

  实例3:var f = function g(){};f === g;f.expando = 'foo';g.expendo;测试chrome下不能运行(显示g没有定义)。

  实例4:var f = function g(){return 1;};if(false){f=function g(){return 2;};} g();测试chrome下是g没有定义。

这么多问题,其实都是把标识符作为一个函数声明了(个人理解)。

  js内存管理

  先看大叔给的实例,然后我们来理解大叔给我们带来的js内存管理这些内容。var f = (function(){if(true){return function g(){};}return function g(){};})();。在匿名函数调用返回的函数(就是带有标识符g的函数) ,然后赋值给外部的f;这个对象与返回的函数对象不是一个事情,多余的g函数就死在返回函数的闭包中。这就是内存问题的产生原因。

(个人对这里的一个备注,当匿名函数返回的函数是怎么赋值给f,这个赋值的底层是怎么一个实现)

  解决办法如下实例所示,就是人为手动断开引用。

var f = (function(){var f,g;if(true){f=function g(){};}else{f=function g(){};} g=null; return f;})();

我读汤姆大叔的深入理解js(二)的更多相关文章

  1. 我读汤姆大叔的深入理解js(一)

    前言 闲来看看javascript,在圆子里发现了汤姆大叔的文章,先是整体瞄了几眼,感觉不错,然后细细研读.记录下自己的学习历程和个人理解.更重要的是作为笔记 高质量JS代码 在看汤姆大叔的这一系列文 ...

  2. 读汤姆大叔《深入理解javascript系列》笔记一编写高质量代码

    感觉大叔的博文真的是很不错 我打算严格要求自己 按照大叔说的,这样我就会更有规范,更有思想的去工作 去写代码(一入代码深似海)   1,尽可能的少用全局变量(污染全局空间,也会和别人的代码 发生冲突造 ...

  3. 汤姆大叔的6道js题目

    汤姆大叔的6道javascript编程题题解 看汤姆大叔的博文,其中有篇(猛戳这里)的最后有6道编程题,于是我也试试,大家都可以先试试. 1.找出数字数组中最大的元素(使用Math.max函数) 1 ...

  4. 读汤姆大叔《JavaScript变量对象》笔记

    一段简单的JavaScript代码思考 先看一段简单的代码,打印结果是??为什么why?? 从上述打印结果不难看出,在打印基本变量num.函数表达式fn.函数声明fun时,就已经知道变量num.函数表 ...

  5. 根本没有“JSON“对象这回事(读汤姆大叔博文记录)

    1.字面量 (1)他们是固定的值,不是变量,让你从“字面上”理解脚本. (2)字符串字面量是由双引号("")或单引号('')包围起来的零个或多个字符串组成的. (3)对象字面量是由 ...

  6. 学习汤姆大叔《深入理解JavaScript系列》有感(1) —— 立即调用的函数表达式

    一. 下面代码用于理解函数的声明和调用. function makeCounter() { // 只能在makeCounter内部访问i var i = 0; return function () { ...

  7. [转载]深入理解JavaScript系列 --汤姆大叔

    深入理解JavaScript系列文章,包括了原创,翻译,转载,整理等各类型文章,如果对你有用,请推荐支持一把,给大叔写作的动力. 深入理解JavaScript系列(1):编写高质量JavaScript ...

  8. 汤姆大叔 javascript 系列 第20课 最后的5到javascript题目

    博客链接:http://www.cnblogs.com/TomXu/archive/2012/02/10/2342098.html 原题: 大叔注:这些题目也是来自出这5个题目的人,当然如果你能答对4 ...

  9. 你必须知道ASP.NET知识------关于动态注册httpmodule(对不起汤姆大叔)

    一.关于动态注册的问题 很多人看过汤姆大叔的MVC之前的那点事儿系列(6):动态注册HttpModule ,其实汤姆大叔没有发现httpmodule动态注册的根本机制在哪里. 亦即:怎么动态注册?为什 ...

随机推荐

  1. Best Practices for Performance_3.Improving Layout Performance 优化布局

    http://developer.android.com/training/improving-layouts/index.html 1. 优化布局层次 1)  每增加一个View或者布局,都会增加额 ...

  2. 用SysTick做的延时计时器

    CM3.CM4的内核中都有个24位的SysTick定时器.这两个MCU里边的SysTick大同小异.SysTick的介绍可以参考:(来自CSDN博客的参考)或者(来自百度文库的参考)或者参考<C ...

  3. javascript 数组去重 unique

    晚上无事,偶然看到这么个小测试,拿来写一写,希望大家提建议: 直接上代码: Array.prototype.unique = function (isStrict) { if (this.length ...

  4. 在UIView上添加tableView设置代理属性

  5. 04 Linux字符设备驱动

    一.结构体 1. cdev 结构体 struct cdev { struct kobject kobj; /* 内嵌的 kobject 对象 */ struct module *owner; /*所属 ...

  6. QQ右下角浮动窗口

    <html><head><meta http-equiv="Content-Type" content="text/html; charse ...

  7. C++ vector erase函数的使用注意事项

    最近使用了顺序容器的删除元素操作,特此记录下该函数的注意事项. 在C++primer中对c.erase(p) 这样解释的:  c.erase(p)    删除迭代器p所指向的元素,返回一个指向被删元素 ...

  8. IO操作

    /// <summary> /// 文件读写操作/// </summary> public partial class TestIO : DevComponents.DotNe ...

  9. .Net中的泛型(where T : class的含义)

    Eg: class A<T>where T:new() where表明了对类型变量T的约束关系.where T: A表示类型变量是继承于A的,或者是A本身.where T:new()指明了 ...

  10. ZOJ 3481. Expand Tab

    题目:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=4278 题意: 给出一些文本片段,把文本中的 Tab 字符根据配置,替换成 ...