《Javascript》prototypeとはどのような技術・仕組みなのかを解説

JavaScript

prototyeの基本

メモリ節約機能を提供

コンストラクターを使ってインスタンスを生成するたびにクライアントの端末でメモリ領域を確保しなければいけません。インスタンスの量が少なければ使用するメモリ量も対して量ではないので気にする必要はありませんが、インスタンスを大量生成する複雑なアプリケーションの場合、無駄なメモリを大量に確保してしまい、スタックオバーフローを引き起こす原因にもなりかねません。prototypeプロパティは無駄なメモリを使わないような機能を提供してくれます。

メモリを節約できる仕組み

その仕組みは非常にシンプルです。本来ならばインスタンスを生成する時にコンストラクーに定義されているメソッドをそのままメモリに書き込むのですが、インスタンスを3 つ生成するとしたらそれぞれ同じメソッドを3つもメモリに書き込まなくてはいけません。明らかに無駄が多いのがわかりますよね。メソッドをprototypeプロパティをつかってコンストラクター内に定義するとインスタンスかした時にメモリにメソッドがコピーされなくなります。インスタンスのメソッドが呼び出されたときはこのprototypeのメソッドにアクセスします。こうすることで無駄なデータをメモリにコピーするという悩みを解消することができます。

暗黙的参照

インスタンスのメソッドが呼ばれた時、まずそのインスタンス内にそのメソッドが定義されているかを確認します。定義されていた場合はそのメソッドを実行し、定義されていなかった場合はprototypeの中を検索します。このようにインスタンスはprototypeに対して暗黙的な参照を持ちます。次のプログラムはprototypeを実装したものです。

var Human = function(age,sex){
  this.age = age
  this.sex = sex
}

Human.prototype.getData = function(){
  console.log(this.age,this.sex) // 3 hoge
}

var human = new Human('3','hoge')
human.getData()

HumanインスタンスにはgetDataメソッドはありませんから暗黙的参照によってprototypeで定義されたgetDataが呼び出されていることが確認できます。

prototypeの特徴[1]

メンバーの変更を追跡できる

prototypeを使うとコンストラクターからインスタンスを生成した後でもインスタンスに対してメソッドやメンバーを追加することができます。次のプログラムをみてください。

var Human = function(age,sex){
  this.age = age
  this.sex = sex
}

var human = new Human('3','hoge')

Human.prototype.getData = function(){
  console.log(this.age,this.sex) // 3 hoge
}


human.getData()

humanインスタンスが生成された後にprototypeを使ってメソッドを追加して、呼び出せていることが確認できると思います。

番外:おすすめアイテム

記事の内容とは別に自宅・オフィスでの開発がもっと快適に、楽しくなる商品を紹介します。アイテム1つで開発効率が一気に向上したり、開発のモチベーションが上がったりするので良いアイテムにはお金を投資すると良いかと。

KATUO
KATUO
今回紹介する商品は普段自分が使っているものなので自信を持ってお勧めできますー。では1つずつ紹介していきます。

おすすめアイテム①

自分はオフィス次の2点の座布団と背もたれクッションを利用してます。姿勢が安定し、お尻への負担が激減します。オフィスにいるのに自宅で作業しているような感覚になるので気に入ってます。また疲労感もかなり減るので費用対効果が非常に高いアイテムです。

おすすめアイテム②

ブックスタンドみなさん使ってますか?PCを打ちながら参考書見る時に手で抑える必要がなくなるので非常に便利です。自分も購入した時なんでいままで使ってなかたんだろうと後悔したのでまだ持ってない方は買っておくと作業効率があがります。

おすすめアイテム③

PCスタンド、magic keyboard、magic mouseを購入してから、開発効率があがり、身体的負担が減って快適に開発ができるようになりました。

エンジニアの基礎知識・教養

別の記事でエンジニアとして知っておくべき技術本についてまとめました。初心者には最低限読んでおいて欲しい技術本をまとめました。例えば「リーダブルコード」などは技術力の高いエンジニアなら必ず過去に読んでいる本だと思います。

筆者
筆者

今回の記事の内容は以上で終了です!最後まで読んでくれてありがとうございました!Twitterもやってるのでよかったらフォローしてください!

タイトルとURLをコピーしました