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 此时 = qqi
console.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