JavaScript get set方法 ES5/ES6寫法

網上鮮有get和set的方法的實例，在這邊再mark一下。

get和set我我的理解自己只是一個語法糖，它定義的屬性至關於「存儲器屬性」

爲內部屬性提供了一個方便習慣的讀/寫方式

ES5寫法

 1 function Number(num) {
 2   this._num = num           //這裏的_num和get/set方法num()不能重名
 3 }
 4 
 5 //get/set方法使用同一個命名，增長可讀性
 6 Number.prototype = {
 7   get num() {
 8     return this._num;
 9   },
10   
11   set num(num) {
12         this._num = num;
13   }
14 }
15 
16 var test = new Number(8);
17 console.log(test.num);
18 test.num = 88;
19 console.log(test.num);

輸出：

>8

>88

 

在這裏，定義了Number類的一個值_num，再原型中注入set和get方法，此時就可使用test.num取值和賦值，更加直觀。

ES6寫法

再看看用ES6中class的實現：

 1 class Num {
 2   constructor(num) {
 3         this._num = num;
 4   }
 5   
 6   get num() {
 7     return this._num;
 8   }
 9   
10   set num(num) {
11     this._num = num;
12   }
13   
14 }
15 
16 var test = new Num(9);
17 console.log(test.num);
18 test.num = 99;
19 console.log(test.num);

 

輸出：

>9

>99