將函數(shù)作為屬性

任何類(lèi)型的對(duì)象都可以作為一個(gè)屬性，回憶一下前面的Example 4(不是Example DT4)，函數(shù)也是一個(gè)對(duì)象。所以你可以讓一個(gè)函數(shù)作為一個(gè)對(duì)象的一個(gè)屬性。下面，我將添加兩個(gè)函數(shù)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 長(zhǎng)了 10K 工資……為什么老板工資可以長(zhǎng)這么多:'(
alert(boss.getSalary());                  // 輸出 210K……為什么默認(rèn)工資也那么高……:'(

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

讓我們看看有什么不同。下面，注意一下9-12行的代碼。當(dāng)這部分代碼執(zhí)行的時(shí)候，函數(shù)getSalary被聲明。如前面數(shù)次提到的，一個(gè)函數(shù)聲明的結(jié)果是一個(gè)對(duì)象被創(chuàng)建。所以這時(shí)候boss被創(chuàng)建（接下來(lái)的第19行），而boss里有一個(gè)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);

當(dāng)你創(chuàng)建這個(gè)對(duì)象的更多實(shí)例時(shí)(boss2和boss3),每一個(gè)實(shí)例都有一份getSalary代碼的單獨(dú)拷貝；而與此相反，addSalary則指向了同一個(gè)地方(即addSalaryFunction)。 

看看下面的代碼來(lái)理解一下上面所描述的內(nèi)容。

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函數(shù)對(duì)象添加屬性
boss1.getSalary.owner="boss1";
boss2.getSalary.owner="boss2";
alert(boss1.getSalary.owner);   // 輸出 "boss1"
alert(boss2.getSalary.owner);   // 輸出 "boss2"
// 如果兩個(gè)對(duì)象指向同一個(gè)函數(shù)對(duì)象，那么
// 上面兩個(gè)輸出都應(yīng)該是“boss2”。

// 給addSalary函數(shù)對(duì)象添加屬性
boss1.addSalary.owner="boss1";
boss1.addSalary.owner="boss2";
alert(boss1.addSalary.owner);   // 輸出 "boss2"
alert(boss2.addSalary.owner);   // 輸出 "boss2"
// 因?yàn)閮蓚€(gè)對(duì)象都指向同一個(gè)函數(shù)，（子烏注：原文寫(xiě)are not pointing to the same function，疑為筆誤）
// 當(dāng)修改其中一個(gè)的時(shí)候，會(huì)影響所有的實(shí)例（所以?xún)蓚€(gè)都輸出“boss2”）.

也許不是重要的事情，但這里有一些關(guān)于運(yùn)行類(lèi)似上面的getSalary的內(nèi)嵌函數(shù)的結(jié)論： 1) 需要更多的存儲(chǔ)空間來(lái)存儲(chǔ)對(duì)象（因?yàn)槊恳粋€(gè)對(duì)象實(shí)例都會(huì)有它自己的getSalary代碼拷貝）；2) javascript需要更多時(shí)間來(lái)構(gòu)造這個(gè)對(duì)象。

讓我們重新寫(xiě)這個(gè)示例來(lái)讓它更有效率些。

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;
}

看這兒，兩個(gè)函數(shù)都指向同一個(gè)地方，這將會(huì)節(jié)約空間和縮短構(gòu)造時(shí)間（特別是當(dāng)你有一大堆內(nèi)嵌函數(shù)在一個(gè)構(gòu)造函數(shù)的時(shí)候）。這里有另外一個(gè)函數(shù)的功能能夠來(lái)提升這個(gè)設(shè)計(jì)，它叫做prototype，而我們將在下一節(jié)討論它。

最新評(píng)論