es 6 中在取值設值時會默認調用 set get 方法:攔截即 我在調用設置值得時候自動調用 set get 方法
與 ES5 一樣, 在 Class 內部可以使用get和set關鍵字, 對某個屬性設置存值函數和取值函數, 攔截該屬性的存取行為。es6 中寫法如下:
//get set 只是攔截了該屬性存取的行為 class objTest{ constructor(){ //this.name = 'demo' } set name(val){ this.da = val+'xxx'; } get name(){ return this.da+'get'; } } var o = new objTest(); o.name = 'test';//會調用set 方法 console.log(o.name);// testxxxget 會對get 方法進行調用es5 中寫法:
//es5 中的寫法var obj = { name:'qi', get name(){ return this.value+'get' }, set name(value){ //注意這里不能操作name 否則會遞歸 造成內存溢出(設置name 的值 會調用set 再設置再調用) :Uncaught RangeError: Maximum call stack size exceeded this.value = value+'xxx' }};console.log(obj.name); //undifinedget 因調用get 打印的是value obj.name = 'QQi'; // value 此時 = qqiconsole.log(obj.name); //qqixxxgetes6 中的靜態方法:
class People { constructor(name) { //構造函數 this.name = name; } sayName() { console.log(this.name); } static formatName(name) { return name[0].toUpperCase() + name.sustr(1).toLowerCase(); }}//static 定義直接使用即可console.log(People.formatName("tom"));es6 中沒有靜態私有變量, 但是我們可以用閉包造一個,關于 WeakMap,會在下一篇博客仔細講解。 為什么要用WeakMap呢?因為WeakMap 用object作為key,并且是一個弱引用,也就是說,WeakMap對這個對象的引用并不會導致GA無法回收這個對象(GA計算對象引用數量的時候并不會計算弱引用)。var People = (function() { var p = new WeakMap(); class People { constructor(name) { //構造函數 var PRivateProperties = { name: name }; p.set(this, privateProperties); } sayName() { console.log(this.name); } get name() { return p.get(this).name; }}return People;})();var p = new People("tom");console.log(p.name);p.sayName();var p2 = new People("bob");console.log(p2.name);p2.sayName();下面看下 defineProperties() , defineGetter,defineSetter,方法來自object 的原型鏈,屬性描述
https://segmentfault.com/a/1190000003882976
js創建對象的8種方式: https://segmentfault.com/a/1190000003862596
新聞熱點
疑難解答