ある程度、JavaScriptの理解が進むと、prototypeに出会うと思います。

prototypeとは

JavaScriptで関数を作成すると生まれるオブジェクトです。
newで関数を実行して、クラスのように扱うときに便利なものです。

prototypeのパフォーマンス

prototypeを使わなくても、挙動的にはあまり問題はないです。
それを使わずに進めることもできます。

function Human(name, age) {
    this.sayName = function() {
        console.log('私は' + name + 'です');
    };
    this.sayAge = function() {
        console.log('年齢は' + age + '歳です');
    };
}

var morisan = new Human('もりさん', 16);

morisan.sayName();
morisan.sayAge();

このような感じにするとクラスっぽくなります。
この書き方だと、Humanが増えるたびにsayNameなども新しく生成することになるので、メモリを消費し、パフォーマンスが良くないです。

prototypeを使うと、関数を共通にできるので、上記よりもパフォーマンスが優れています。

function Human(name, age) {
    this.name = name;
    this.age = age;
}

Human.prototype.sayName = function() {
    console.log('私は' + this.name + 'です');
};

Human.prototype.sayAge = function() {
    console.log('年齢は' + this.age + '歳です');
};

var morisan = new Human('もりさん', 16);

morisan.sayName();
morisan.sayAge();

メモリと速度を見てみましょう。

prototypeの速度

こちらのサイトをマネして計測してみます。

prototype を使う場合と使わない場合の速度比較 – basyura's blog

Chromeで1,000,000回for文で実行しました。
prototypeを使わないほうが1000くらいで、使ったほうが400くらいになりました。
2倍以上違います。

速度のテスト

prototypeのメモリ

次のメモリを見てみます。
Chromeデベロッパー・ツールから確認できるようです。

JavaScriptのprototypeとメモリ　本当にメモリ節約してるのか見てみた

こちらは、prototypeを使わないほうが124,000,312、使ったほうが20,000,000になりました。
こんな感じで、6倍くらい違います。

メモリのテスト

環境やブラウザによって異なるとは思いますが、それでも思ったよりも差が出ました。

prototypeの問題点

パフォーマンスを見ると、prototypeを使わないという選択がない気がしますが、どうでしょうか。
確かに便利なのですが、気になる点があります。

プライベート変数が使用できない

prototypeからアクセスするためには、thisのついた（公開された）変数である必要があります。
それによって、外部から変更されたくないものでも、書き換えることができます。

prototypeではない関数を作成して、プライベート変数にアクセスすることはできますが、せっかくのprototypeの恩恵が少なくなります。

また、_を付けたものを、プライベート変数として扱う、などとして欠点を補うルールで扱うことがあります。

関数の内側にprototypeを記述することができない。

一度、関数を設定してからでないと、prototypeに追加することができません。
関数の定義が分かれるので、視覚的に分かりにくくなります。

無名関数でまとめて、少し分かりやすくすることはできます。

継承の問題

（prototypeの問題ではありませんが）prototypeを調べると、クラス的なものを継承して生成することがあります。

継承用の関数を用意して行う、ことがベストな手法のようですが、JavaScript自体いろいろ問題があるので継承をしない、という選択をする方も多いようです。

そして、継承している場合に、以下のようにprototypeをまとめて記述すると、継承が消えてしまいます。
まとめて書く方法は、タイピングが減って便利ですが、そこを理解して使いたいです。

Human.prototype = {
    sayName: function() {
        console.log('私は' + this.name + 'です');
    },
    sayAge: function() {
        console.log('年齢は' + this.age + '歳です');
    }
};

まとめ

prototypeは便利なのですが、JavaScriptが自由すぎるので、気をつけないと破綻します。
こういう現状があるので、AltJSを使いたくなるのかもしれません。

私は、コーディングの慣れと、周りとの親和を考えて、積極的に使ってきませんでした。
しかし、JavaScriptによるシングルページアプリケーションなどの案件が増えてきたので、prototypeを使っていこうと思います。

お洒落なコーディングがしたいです！
それでは、また！