ECMAScript5 新特性(一)

 

Function 1: Object.create

这是一个很重要的改动,现在我们终于可以得到一个原型链干净的对象了。以前要创建一个类

 

function Cat(name) {
	this.name   = name;                                                                                 
	this.paws   = 4;
	this.hungry = false;
	this.eaten  = [];
}
Cat.prototype = {
	constructor : Cat,
	play        : function () { this.hungry = true; return 'playing!'; },
      feed        : function (food) { this.eaten.push(food); this.hungry = false; },
	speak       : function () { return 'Meow'; }
};

 必须要分两步走,但是现在可以不必了

 

var Dog = {
    name   : 'dog',
    paws   : 4,
    hungry : false,
    eaten  : null,
    play   : function () { this.hungry = true; return 'playing!'; },
    speak  : function () { return 'Woof!'; }
};
var dog = Object.create(Dog);

 Object.create他还有第2个参数,是一个properties descriptor object 关于这方面的详细解释,请看第2点。


另外:如果浏览器不支持Object.create,可以用这种方法代替

 

if (typeof Object.create !== 'function') {
    Object.create = function (o) {
        function F() {}
        F.prototype = o;
        return new F();
    };
}

 Browser Support

   ○ Firefox 4

   ○ Internet Explorer 9

   ○ Safari 5

   ○ Chrome 5+

 

 

Function 2: Object.defineProperty

 

如果你想为一个对象定义属性,那么就必须my_dog.age = 2; 用这种方法。但是在ECMAScript5中,提供了更好的包装方法Object.defineProperty

Parameters:

1.对象引用

2.属性名

3.修饰对象

修饰对象中的定义如下:

 value: use this to set the value of a property. Defaults to undefined.

 writable: use this boolean to define whether this is a read-only variable. If it’s writable, it’s true. Defaults to false.

 configurable: use this boolean to define whether the type (value vs. method) of this property can be changed, or whether the property can be deleted. If it’s configurable, it’s true. Defaults to false.

 enumerable: use this boolean to define whether this property is included when the properties of the object are enumerated (a for-in loop or the keys method). Defaults to false.

 get: use this to define a custom getter method. Defaults to undefined.

 set: use this to define a custom setter method. Defaults to undefined.

 

Sample:

 

var Dog = {
    name   : 'dog',
    paws   : 4
};
var dog = Object.create(Dog);

Object.defineProperty(dog, 'age', {
    set : function (age) { this.humanYears = age * 7; },
    get : function () { return this.humanYears / 7; },
    enumerable : true
});

dog.age = 2;
dog.humanYears; // 14

 以上代码让agehumanYears保存了同步,如果你不想对外界暴露humanYears,可以这样使用闭包:

 

Object.defineProperty(dog, 'age', (function () {
    var humanYears;

    return {
        set : function (age) { humanYears = age * 7; },
        get : function () { return humanYears / 7; },
        enumerable : true
    };

}()));

 当然,也可以用在Object.create方法上面

 

var yourDog = Object.create(Dog, {
    age : {
        get : function () { /* . . . */ },
        set : function () { /* . . . */ },
        enumerable: true
    },
    gender : {
        value : 'female'
    }
});

 Browser Support

   ○ Firefox 4

   ○ Internet Explorer 9

   ○ Safari 5

   ○ Chrome 5+

 

 

Function 3: Object.defineProperties

当然,如果你想像Object.create方法那样一口气给对象加入很多属性的话,你可以用Object.defineProperties方法

 

Object.defineProperties(dog, {
    age : {
        get : function () { /* . . . */ },
        set : function () { /* . . . */ },
        enumerable: true
    },
    gender : {
        value : 'female'
    }
});

 注意区别 Object.createObject.defineProperties第一个参数的不同,Object.createprototype,而Object.defineProperties是对象


Browser Support

   ○ Firefox 4

   ○ Internet Explorer 9

   ○ Safari 5

   ○ Chrome 5+

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值