首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

ECMAScript5 新特性(1)

2012-11-07 
ECMAScript5 新特性(一)?function Cat(name) {this.name namethis.paws 4this.hungry falsethis.ea

ECMAScript5 新特性(一)

?

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个参数,是一个propertiesdescriptor object,关于这方面的详细解释,请看第2点。


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

?

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

?BrowserSupport

?? ○ Firefox4

?? ○ InternetExplorer 9

?? ○ Safari5

?? ○ Chrome5+

?

?

Function2:?Object.defineProperty

?

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

Parameters:

1.对象引用

2.属性名

3.修饰对象

修饰对象中的定义如下:

 value:use this to set the value of a property. Defaultsto?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

?以上代码让age和humanYears保存了同步,如果你不想对外界暴露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'    }});

?BrowserSupport

?? ○ Firefox4

?? ○ InternetExplorer 9

?? ○ Safari5

?? ○ Chrome5+

?

?

Function3:?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是对象


BrowserSupport

?? ○ Firefox4

?? ○ InternetExplorer 9

?? ○ Safari5

?? ○ Chrome5+

?

?

var objDefinition = { "test" : function(){} };var instance = new objDefinition();P.apply(this, arguments);
};
if (len > 1) {
var newArgs = [ C, P ].concat(Array.prototype.slice.call(arguments)
.slice(1, len - 1), F);
inherit.apply(null, newArgs);
} else {
C.prototype = F;
C.prototype.superclass = [];
}
if(C.prototype.tsuperclass){
C.prototype.superclass = C.prototype.tsuperclass;
delete C.prototype.tsuperclass;
}
return C;
}</pre>

<p>?</p>
<p>?</p>
<p>
</p>
<pre name="code" when calling hawOwnProperty if the source object
         * is an instance of window.Event.
         */

        var sourceIsEvt = typeof window.Event == "function"
                          &amp;&amp; source instanceof window.Event;

        if(!sourceIsEvt
           &amp;&amp; source.hasOwnProperty &amp;&amp; source.hasOwnProperty('toString')) {
            destination.toString = source.toString;
        }
    }
    return destination;
};</pre>

<p>?</p>
<p>?</p>
<p>
</p>
<pre name="code" ? F.initialize : function() {
P.apply(this, arguments);
};
if (len &gt; 1) {
var newArgs = [ C, P ].concat(Array.prototype.slice.call(arguments)
.slice(1, len - 1), F);
inherit.apply(null, newArgs);
} else {
C.prototype = F;
C.prototype.superclass = [];
}
if(C.prototype.tsuperclass){
C.prototype.superclass = C.prototype.tsuperclass;
delete C.prototype.tsuperclass;
}
return C;
}</pre>
<p>?</p>
<p>?</p>
<p>?</p>
<pre name="code" when calling hawOwnProperty if the source object
         * is an instance of window.Event.
         */

        var sourceIsEvt = typeof window.Event == "function"
                          &amp;&amp; source instanceof window.Event;

        if(!sourceIsEvt
           &amp;&amp; source.hasOwnProperty &amp;&amp; source.hasOwnProperty('toString')) {
            destination.toString = source.toString;
        }
    }
    return destination;
};</pre>
<p>?</p>
<p>?</p>
<p>?</p>
<pre name="code" style="font-weight: bold; margin-top: 5px; margin-right: 0px; margin-bottom: 0px; margin-left: 15px; padding: 5px;"><a href="http://rainsilence.iteye.com/admin/blogs/604418">http://rainsilence.iteye.com/admin/blogs/604418</a></div>
</div>

<p>?</p>
<p>?</p>
<p>?</p> 20 楼 guyue 2012-03-18   经验证,各浏览器(IE10,Firefox12,opera11.60,chrome19,safari5)中configurable均未实现“
use this boolean to define whether the type (value vs. method) of this property can be changed” 21 楼 jkxydp 2012-08-22   guyue 写道经验证,各浏览器(IE10,Firefox12,opera11.60,chrome19,safari5)中configurable均未实现“
use this boolean to define whether the type (value vs. method) of this property can be changed”
据我验证,你的验证是错误的,最少chrome14就已经实现了。