3

このコードを見つけたとき、JavaScriptのゲッターとセッターに関するJohnResigの記事を読んでいました。

function Field(val){
    this._value = val;
}
Field.prototype = {
    get value(){
        return this._value;
    },
    set value(val){
        this._value = val;
    }
};

私はテストしましたが、SCRIPT1003: ':' expectedエラーが発生する気の利いたIEを除いて、すべての主要なブラウザーで完全に動作します。しばらく疑問に思ったのですが、IEがJavaScriptのゲッターとセッターを認識しないためにこのエラーが発生することに気づきました。これは構文エラーだget valueと思います。set value

このコードをクロスブラウザにする方法はありますか？

前もって感謝します

編集：

また、ブラウザがゲッターとセッターをサポートしているかどうかを確認しようとしました。

if(window.__lookupSetter){
    Field.prototype = {
        get value(){
            return this._value;
        },
        set value(val){
            this._value = val;
        }
    };
}else{
    Field.prototype = {
        value: function(val){
            if(val)
                return this._value = val;
            return this._value;
        }
    };
}

getただし、コードを実行する前に、IEは構文エラーをチェックし、および行でこれらのエラーを誤って検出しsetます。

4

1 に答える 1

6

Object.defineProperty：を使用して、新しい構文を使用せずにプロパティを定義できます。

function Field(val){
    this.value = val;
}
Object.defineProperty(Field.prototype, 'value', {
    get: function(){
        return this._value;
    },
    set: function(val){
        this._value = val;
    }
});

そうすれば、古いブラウザでコードに構文エラーが発生することはありません。

編集へのWRT、フォールバックコード：

Field.prototype = {
    value: this._value
};

動作しないでしょう。thisグローバルオブジェクトを指します- window。

ゲッターとセッターのクロスブラウザーを実際に使用する唯一の方法は、それらをまったく使用しないことです。

Field.prototype = {
    getValue: function() {
        return this._value;
    },
    setValue: function(val) {
        this._value = val;
    }
};
于 2012-06-30T19:04:42.453 に答える