es 6 中在取值設(shè)值時(shí)會(huì)默認(rèn)調(diào)用 set get 方法:攔截即 我在調(diào)用設(shè)置值得時(shí)候自動(dòng)調(diào)用 set get 方法
與 ES5 一樣, 在 Class 內(nèi)部可以使用get和set關(guān)鍵字, 對(duì)某個(gè)屬性設(shè)置存值函數(shù)和取值函數(shù), 攔截該屬性的存取行為。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';//會(huì)調(diào)用set 方法 console.log(o.name);// testxxxget 會(huì)對(duì)get 方法進(jìn)行調(diào)用es5 中寫法:
//es5 中的寫法var obj = { name:'qi', get name(){ return this.value+'get' }, set name(value){ //注意這里不能操作name 否則會(huì)遞歸 造成內(nèi)存溢出(設(shè)置name 的值 會(huì)調(diào)用set 再設(shè)置再調(diào)用) :Uncaught RangeError: Maximum call stack size exceeded this.value = value+'xxx' }};console.log(obj.name); //undifinedget 因調(diào)用get 打印的是value obj.name = 'QQi'; // value 此時(shí) = qqiconsole.log(obj.name); //qqixxxgetes6 中的靜態(tài)方法:
class People { constructor(name) { //構(gòu)造函數(shù) 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 中沒有靜態(tài)私有變量, 但是我們可以用閉包造一個(gè),關(guān)于 WeakMap,會(huì)在下一篇博客仔細(xì)講解。 為什么要用WeakMap呢?因?yàn)閃eakMap 用object作為key,并且是一個(gè)弱引用,也就是說,WeakMap對(duì)這個(gè)對(duì)象的引用并不會(huì)導(dǎo)致GA無法回收這個(gè)對(duì)象(GA計(jì)算對(duì)象引用數(shù)量的時(shí)候并不會(huì)計(jì)算弱引用)。var People = (function() { var p = new WeakMap(); class People { constructor(name) { //構(gòu)造函數(shù) 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創(chuàng)建對(duì)象的8種方式: https://segmentfault.com/a/1190000003862596
新聞熱點(diǎn)
疑難解答
圖片精選