第四章函数(JavaScript:语言精粹)

发布时间：2025-03-09 19:19:18

13 阅读

0 评论

文章标签： html函数

函数包含一组语句，用来指定对象的行为，其代码可以用来重复使用。

一般来说，编程就是将一组需求分解成一组函数和数据结构的技能。

4.1. 函数对象

JavaScript 中的函数就是对象。

对象字面量产生的对象连接到 Object.prototype，函数对象连接到 Function.prototype(该原型对象本身连接到 Object.prototype)。

函数的与众不同之处在于它们能被调用。

4.2. 函数字面量

函数对象通过函数字面量来创建。

// 4.2 code 1
var add = function (a, b) {
    return a + b;
};

函数字面量分为 4 个部分：第 1 部分，是保留字 function；第 2 部分，是函数名，它可以省略，省略函数名的函数称为匿名函数；第 3 部分是包含在圆括号中的一组参数；第 4 部分是包围在花括号中的一组语句，是函数的主体，在函数被调用时执行。

函数也可以被定义在其他函数中。一个内部函数除了可以访问自己的参数和变量，同时也能自由访问把它嵌套在其中的父函数的参数和变量。这被称为闭包。

4.3. 调用

除了函数声明时定义的形式参数，每个函数还接收两个附加的参数：this 和 arguments。this 的值取决于调用的模式。

在 JavaScript 中一共有四种调用模式：方法调用模式、函数调用模式、构造器调用模式、apply 调用模式。

4.4. 方法调用模式

当一个函数被保存为对象的一个属性时，我们称它为一个方法。当一个方法被调用时，this 被绑定到该对象。

// 4.4 code 2
var myObj = {
    value: 0,
    increment: function (inc) {
        this.value += typeof inc === 'number' ? inc : 1;  
    }
};

myObj.increment;
myObj.value        // 1
myObj.increment(2);
myObj.value        // 3

通过 this 可取得它们所属对象的上下文的方法称为公共方法，代码里 increment 方法就是公共方法。

4.5. 函数调用模式

当一个函数并非一个对象的属性时，那么它就被当作一个函数来调用的。

// 4.5 code 3
var sum = add(3, 4); // 7

以此模式调用函数时，this 被绑定到全局变量，也就是 window 对象。

// 4.5 code 4
myObj.double = function  {
    
    var helper = function  {
        this  // Oops, window Object!
    }
}

↑这是一个语言设计上的错误，内部函数 helper 的 this 指 window，根本不是外部函数 double 指的 myObj 对象。可以这样解决：

// 4.5 code 5
myObj.double = function  {
    var that = this;
    
    var helper = function  {
        that.value = add(that.value, that.value);
    }
    
    helper;   // Function Invocation
}

myObj.double; // Method Invocation
myObj.value     // 6

将外部函数的 this(也就是 myObj 对象)，赋值给变量 that，那么在内部函数里就可以使用 myObj 对象了。

4.6. 构造器调用模式

JavaScript 是一门基于原型继承的语言，这意味着对象可以直接从其他对象继承属性，通过 prototype 属性。这偏离了当前编程的主流风格（基于类的编程），并没有被广泛理解。

一个函数，如果创建的目的就是希望给 new 前缀来调用，那么它就被称为构造器函数。

// 4.6 code 6
var Quo = function (str) {
    this.status = str;
}

Quo.prototype.get_status = function  {
    return this.status;
}

var quo1 = new Quo('online');
quo1.get_status // "online"

你可能会看到，当一个函数当成构造器函数使用时，函数名遵循大写约定（比如是 Quo，而不是 quo）。

我不推荐使用这种形式的构造器函数。下一章会有更好的替代方式。

4.7. Apply 调用模式

JavaScript 的函数可以拥有方法。

Apply 调用模式要用到 Function.prototype.apply(thisArg, argArray)方法，第一个参数是绑定给 this 的值，第二个参数是一个参数数组。

// 4.7 code 7
var arr = [3, 4];
var sum = add.apply(null, arr);
sum    // 7

var statusObj = {
    status: 'offline'
};
var status = Quo.prototype.get_status.apply(statusObj);
status // "offline"

结合上面的代码，我们对 apply 方法的两个参数，再做些说明，以便加深我们的印象：

1. add.apply(null, array)：null 表示函数 add 里的 this 值为 null，array 数组里提供了调用 add 函数时可以传递给它的两个参数，这里分别是 3 和 4，所以 sum 的值是 7。

2.
Quo.prototype.get_status.apply(statusObj)：因为我们将 statusObj 绑定到了 get_status 方法的 this 上，相当于可以在 statusObj 上调用 get_status 方法。虽然 statusObj 没有 get_status 方法，也并没有继承 Quo.prototype。第二个参数没赋值，因为调用 get_status 方法不需要参数的。

4.8. 参数

（待续...）