javascript的函數(7)

將函數作為屬性

任何類型的對象都可以作為一個屬性，回憶一下前面的Example 4(不是Example DT4)，函數也是一個對象。所以你可以讓一個函數作為一個對象的一個屬性。下面，我將添加兩個函數getSalary和addSalary。

Example DT7

CODE:

function Employee(name, salary)
{
  this.name=name;               
  this.salary=salary;

  this.addSalary=addSalaryFunction;

  this.getSalary=function()
                 {
                   return this.salary;
                 };
}
function addSalaryFunction(addition)
{
  this.salary=this.salary+addition;
}

var boss=new Employee("John", 200000);
boss.addSalary(10000);                    // boss 長了 10K 工資……為什麼老闆工資可以長這麼多:'(
alert(boss.getSalary());                  // 輸出 210K……為什麼預設工資也那麼高……:'(

addSalary和getSalary示範了幾種將函數賦給屬性的不同方法。如果你記得我們最開始的討論；我討論了三種聲明函數的不同方式。所有那些在這裡都是適用的，但是上面展示的兩個最常用。

讓我們看看有什麼不同。下面，注意一下9-12行的代碼。當這部分代碼執行的時候，函數getSalary被聲明。如前面數次提到的，一個函式宣告的結果是一個對象被建立。所以這時候boss被建立（接下來的第19行），而boss裡有一個getSalary屬性。

CODE:

function Employee(name, salary)
{
  this.name=name;               
  this.salary=salary;

  this.addSalary=addSalaryFunction;

  this.getSalary=function()
                 {
                   return this.salary;
                 };
}
function addSalaryFunction(addition)
{
  this.salary=this.salary+addition;
}

var boss=new Employee("John", 200000);
var boss2=new Employee("Joan", 200000);
var boss3=new Employee("Kim", 200000);

當你建立這個對象的更多執行個體時(boss2和boss3),每一個執行個體都有一份getSalary代碼的單獨拷貝；而與此相反，addSalary則指向了同一個地方(即addSalaryFunction)。 

看看下面的代碼來理解一下上面所描述的內容。

Example DT8

CODE:

function Employee(name, salary)
{
  this.name=name;               
  this.salary=salary;

  this.addSalary=addSalaryFunction;
  this.getSalary=function()
                 {
                   return this.salary;
                 };
}
function addSalaryFunction(addition)
{
  this.salary=this.salary+addition;
}

var boss1=new Employee("John", 200000);
var boss2=new Employee("Joan", 200000);

// 給getSalary函數對象添加屬性
boss1.getSalary.owner="boss1";
boss2.getSalary.owner="boss2";
alert(boss1.getSalary.owner);   // 輸出 "boss1"
alert(boss2.getSalary.owner);   // 輸出 "boss2"
// 如果兩個對象指向同一個函數對象，那麼
// 上面兩個輸出都應該是“boss2”。

// 給addSalary函數對象添加屬性
boss1.addSalary.owner="boss1";
boss1.addSalary.owner="boss2";
alert(boss1.addSalary.owner);   // 輸出 "boss2"
alert(boss2.addSalary.owner);   // 輸出 "boss2"
// 因為兩個對象都指向同一個函數，（子烏註：原文寫are not pointing to the same function，疑為筆誤）
// 當修改其中一個的時候，會影響所有的執行個體（所以兩個都輸出“boss2”）.

也許不是重要的事情，但這裡有一些關於運行類似上面的getSalary的內嵌函數的結論： 1) 需要更多的儲存空間來儲存物件（因為每一個對象執行個體都會有它自己的getSalary代碼拷貝）；2) javascript需要更多時間來構造這個對象。

讓我們重新寫這個樣本來讓它更有效率些。

Example DT9

CODE:

function Employee(name, salary)
{
  this.name=name;               
  this.salary=salary;

  this.addSalary=addSalaryFunction;
  this.getSalary=getSalaryFunction;
}
function getSalaryFunction()
{
  return this.salary;
}

function addSalaryFunction(addition)
{
  this.salary=this.salary+addition;
}

看這兒，兩個函數都指向同一個地方，這將會節約空間和縮短構造時間（特別是當你有一大堆內嵌函數在一個建構函式的時候）。這裡有另外一個函數的功能能夠來提升這個設計，它叫做prototype，而我們將在下一節討論它。