0

したがって、私は JavaScript の専門家ではなく、次の 2 つのコード スニペットの違いを理解しようとしているだけです。TypeScript に変換したいプロジェクトがあり、生成される 2 つのコード スニペットの違いを理解する必要があります。

var Pony = (function () {
    function Pony() { }
    Pony.prototype.bite = function () {
        alert("Chomp!");
    };
    return Pony;
})();

var Pony2 = (function () {
    function Pony2() {
        var self = this;
        self.bite = function () {
            alert("Chomp!");
        };
    }
    return Pony2;
})();
4

3 に答える 3

0

どのように使用するかについては、違いはありません。ただし、パフォーマンスの観点からは、前者の方法が望ましいでしょう。あなたの例を少し拡張しましょう：

var prototypePony1 = new Pony();
var prototypePony2 = new Pony();
var thisPony1 = new Pony2();
var thisPony2 = new Pony2();

prototypePony1.hasOwnProperty('bite'); //returns false
prototypePony2.hasOwnProperty('bite'); //returns false
thisPony1.hasOwnProperty('bite'); //returns true
thisPony2.hasOwnProperty('bite'); //returns true

Pony.prototype.bite = function() { alert('Nomnomnom!'); };
Pony2.prototype.bite = function() { alert('Nomnomnom!'); };

prototypePony1.bite(); //alerts 'Nomnomnom!'   
prototypePony2.bite(); //alerts 'Nomnomnom!'

thisPony1.bite(); //alerts 'Chomp!', instance property is accessed first   
delete thisPony2.bite;
thisPony2.hasOwnProperty('bite'); //returns false
thisPony2.bite(); //alerts 'Nomnomnom!'

上記の例ではthisPony1、thisPony2両方とも関数の独自のコピーを取得します。これは、bite関数が使用して定義されているためです。thisしかし、prototypePony1両方ともfromのコンストラクターのprototypePony2同じコピーを共有します。Pony2 でプロトタイプ を定義すると、引き続きインスタンス プロパティが最初にアクセスされます。新しく定義されたプロトタイプ プロパティが に表示されるのは、インスタンス プロパティを削除するまではありません。 オブジェクト メソッドの定義の詳細については、こちらをご覧ください。bitePony

bitethisPony1thisPony2

于 2013-03-29T14:31:43.663 に答える
0

この 2 つの違いは、var Pony に格納されたオブジェクトの属性を介して最初の Pony のプロトタイプにアクセスでき、そのプロトタイプの関連ビットを他の場所で拡張または使用できることです。ただし、Pony2 は単なる関数と見なされます。したがって、後でプロトタイプの継承を使用する予定がない場合、それらは同等です。

于 2013-03-29T14:26:09.547 に答える
0

上記の回答は、プロトタイプの配置とインスタンスの配置の違いに関する概要を示しています。TypeScript への変換に関する質問については、以下のように記述します。

class Pony {
    bite(){
        alert('chomp');
    }
}

class Pony2 {
    bite:  () => void;
    constructor(){
        this.bite = () => alert('chomp');
    }
}
于 2013-03-29T15:40:47.383 に答える