iT邦幫忙

2022 iThome 鐵人賽

DAY 29
0
Modern Web

想轉職的鯊魚從零基礎開始學習JavaScript系列 第 29

想轉職的鯊魚從零基礎開始學習JavaScript Day-29 Function- Method definitions & getter & setter 物件內的函式 與 get & set

  • 分享至 

  • xImage
  •  

前言

在JavaScript中Function,是First Class Function(一級函式),也就是說你可以用變數去承載一個函式,進一步來說可以放變數的地方都可以放函式,像是物件中或是陣列裡,而Method definitions就是說明在物件中放函式的概念,今天來跟鯊魚一起套討物件內的函式吧。

Method definitions

在一個物件裡面放一個函式,被稱作該物件的Method(方法),先前介紹各種Object的時候,都會介紹到他們的各種Properties of the Prototype Object/Constructor有一部分就是Method。
而Method最重要的事是可以去訪問Private class features。

  • Syntax 語法

大家還記得物件是一個key對應一個value,而Method就是將value用一個function表示,呼叫的時候可以透過key去呼叫到那個函式。

Method語法

Static Method

如果稍微有留意到,有些Method是必須綁定物件,有些則不用綁定用原型就可以使用那些方法,
會有這個差異,主要是因為需要綁定物件Method通常與物件本身有關,
而不用綁定物件用原型就可以使用,他的函式運作跟物件本上無關,只是參數與物件本身有關,所以才被設計放在物件的原型裡面。
而在製作上,會在這類的Method的class裡面 放上Static,讓這個Method可以透過原型去使用。

getter & setter

物件有一個很特別syntax(語法) get 跟 set,專門用來讀取/設置物件的內容,

  • Syntax 語法-get
objectName {
  get getName() { 
		/* 運行內容(通常呼叫物件的其他內容,並是取出其值) */
	};
}

呼叫的時候
用objectName.getName即可取出值目標的值

  • Syntax 語法-set
objectName {
  set setName(Parameters) { 
		/* 運行內容(通常呼叫物件的其他內容,並是設定其值) */
	};
}

呼叫的時候
用objectName.setName(Parameters)即可設定目標的值
就像是Method一樣

特別注意:呼叫get後面不能有(),但是set後面一定要有,並且還要附上一個Parameters。

結語

物件內的函式,雖然感覺很多餘,但是這個函式最重要的是呼叫物件內的內容尤其是Private class features,這個沒辦法透過外部去呼叫的內容,僅能透過內部的函式 或是 getter & setter去呼叫他,一來可以保護內部數據部會被輕易地取出,在設置的時候還必須透過 set 才能修改裡面的值,讓外部不好破壞其內容,而且多一道程序還可以驗證輸入的參數是不是符合要set的內容。

鯊語錄

參考資料

MDN-Function


上一篇
想轉職的鯊魚從零基礎開始學習JavaScript Day-28 Function-parameters & Arrow function expressions 函式 - 參數 與 箭頭函式
下一篇
想轉職的鯊魚從零基礎開始學習JavaScript Day-30 資料驗證
系列文
想轉職的鯊魚從零基礎開始學習JavaScript31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言