(转)经过使用Chrome的开发者工具来学习JavaScript-JavaSript-爱易网页

日期：2014-05-16　浏览次数：20301 次

(转)通过使用Chrome的开发者工具来学习JavaScript

(转)http://www.qianduan.net/use-the-chrome-developer-tools-to-learn-javascript.html

本文作者是Peter Rybin,Chrome开发者工具团队成员.

本文中,我们将通过使用Chrome的开发者工具,来学习JavaScript中的两个重要概念”闭包”和”内部属性”.

闭包

首先要讲的是闭包(closure) – JavaScript中最有名的东西之一.一个闭包就是一个使用了外部变量的函数.查看下面的例子:

function A(a, b, c) {
  var ar = [a, b, c];
  return function B(i) {
    return ar[i];
  };
}
?
var b = A('Here', 'I', 'am');
console.log( b(1) );

函数声明之后的第一条语句调用了函数A,函数A创建了一个值为数组[a,b,c]的局部变量ar,返回了一个函数B(存储在了变量b中),然后运行结束.

第二条语句调用了函数B?(b),返回并打印出了数组ar.这就意味着A中的数组ar在A结束执行后仍然存在.但是它存储在什么地方呢?当然,在b上!但是究竟是存在b的哪里呢?某个属性中?不是的.

这是JavaScript语言的一个核心特性:一个函数可以持有外层作用域的变量,并且除了调用该函数以外没有任何其他方法可以访问到这些变量.

从现在开始,chrome的开发者工具可以让闭包中的外部变量现形.在监控表达式(Watch Expressions)面板中查看函数实例b,展开它的属性后,应该会有一个称为<function scope>的子节点.所有被绑定的闭包变量都能在这里看到,这些变量就是在函数调用时可能会被用到的变量.

开发者工具还能显示出另外一个东西,叫做内部属性(internal property).

假设你的代码中有个变量s,而且还执行了下面这样的操作:

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。