Douglas Crockford - JavaScript function 3 of 4

 function能像其他类型的值一样被传递、返回、存储。
直接使用function定义一个函数，等同于使用var定义一个变量，并将它赋值为一个function。

function foo() {}

等同于

var foo = function foo() {};

(function后的foo可省略)
内部函数(嵌套函数)

 一个function能被定义在其他function的内部，并且能访问外部function中定义的变量和参数。

闭包

 当外部的function返回后，内部function仍然能够执行并继续访问外部function的变量。

function fade(id) {
   var dom = document.getElementById(id);
   var level = 1;
   function step() {
      var h = level.toString(16);
      dom.style.backgroundColor = '#FFFF' + h + h;
      if (level < 15) {
          level += 1;
          setTimeout(step, 100);
      }
  }
  setTimeout(step, 100);
}

 函数对象

Function属于对象类型中的一种，所以它也能有自己“name/value对”，当function定义并作为一个对象的属性值存储时，将该function称为method。能用这些特性来模拟其他面向对象语言中构造函数的行为。

当用多于function定义时声明的参数个数调用function时，将忽略传递进来的多余参数；当少于定义时声明的参数个数，这些缺少的参数将被赋值为undefined。

 

function调用方式

function form: functionObject(arguments);

通常意义上的函数调用。this引用的是全局对象(对于浏览器就是window对象)

method form: thisObject.methodName(arguments);

此时将有一个隐含的this在起作用，该this引用thisObject。

constructor form: new functionObject(arguments);

一个新的对象将被创建，this引用这个新创建的对象。如果没有明确地写return，this（新创建的对象）将被返回。

apply(call) form: functionObject(thisObject,[arguments]);

 

调用方式	this引用指向
function	the global object
method	the object
constructor	the new object

 

• this相当于一个额外的参数，它的值取决于调用方式
• this让method调用时可以访问到其他的对象
• this是在运行时被绑定的

函数参数对象

是一个array-like的对象，(并非真正的array，只是访问方式类似)。前面所说的调用函数时多余的参数将被忽略，但argument里却包含了调用函数时传递给它的所有参数。

function sum() {
   var i;
   var n = arguments.length;
   var total = 0;
   for (i=0; i < n; i++)
      total += arguments[i];
   return total;
}

 隐含的全局变量

 对于任何声明在function之外的变量或者在function之内声明，但前面没有var的变量都是全局的。JSLint能帮助你找到那些隐含的全局变量。http://www.JSLint.com。

 整个页面充斥着全局变量就会有冲突的危险。可以使用对象来组织自己的变量、函数等。

<script>
   Ext = {};
   Ext.data = {};
   Ext.data.JsonReader = function() {};
</script>

 此时，页面上只有一个全局变量Ext。

 

再谈封装

可以使用匿名的函数来包装自己的程序。

Yahoo.Trivia = function() {
   //define your common vars
   return {
      getNextPoser: function(cat, diff) {
 
      },
      showPoser: function() {
         
     }
  };
} ();

 可以从使用方式上来分析上面的代码。使用的方式大概如下：

Yahoo.Trivia.getNextPoser();
Yahoo.Trivia.showPoser();

 样子很像面向对象语言中的静态类了，不需要通过new便可调用类中的方法。实际上，当程序员书写到Yahoo.Trivia，便已经调用执行了函数并返回一个对象(也就是说Trivia被赋值为函数执行返回的结果)：该对象包含两个属性，getNextPoser,showPoser。属性的值是Function类型。

 

挑了自己理解听懂的做了翻译，感兴趣的可以看他老人家的原版presentation

http://video.yahoo.com/watch/111595/1710607