ecmascript 6 get set WeakMap Class static val

2024-04-27 15:16:02

字体：大中小

来源：转载

供稿：网友

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); //qqixxxget

es6 中的静态方法：

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

上一篇：Bootstrap学习笔记（七）其它内置组件

下一篇：javascript中的事件