kansiho's memo

ruby, python, javascript. Rails, wordpress, OpenCV, heroku...

javascriptのスコープとprototypeについて

スコープ

JavaScript には、グローバルとローカルの 2 つのスコープがあります。 関数定義の外部で宣言された変数はグローバル変数になり、プログラム内のどこからでも値の参照や変更を行うことができます。 関数定義内で宣言された変数はローカル変数になります。 ローカル変数は、関数が実行されるたびに作成され破棄されます。関数の外部のコードからローカル変数にアクセスすることはできません。

JavaScript では、ブロック スコープ変数の特殊な場合を除いて、(中かっこで囲んで ({…}) 新しいスコープを定義する) ブロック スコープはサポートしていません。 ( ただし、Internet Explorer 11 では、ブロック スコープ変数である let および const のサポートが導入されています。)

var hoge = "global";

function showHoge(){
  print(hoge); //undefined
  var hoge = "local";
  print(hoge); //local
  return hoge;
}

print(showHoge()); //local
print(hoge); //global

prototype

prototype は関数のプロパティ、およびコンストラクター関数によって作成されるオブジェクトのプロパティです。

JavaScriptオブジェクト指向言語。クラスという概念はないため、擬似的なクラスの表現を使ったパターンがあります。

私はクラスとインスタンスの関係はたいやきとたいやきの型で考えるのが好きなので、この場合も、Taiyaki(); というクラス(的なもの)を作ってみたいと思います。

function Taiyaki() {} // たい焼きクラスを宣言
Taiyaki.prototype.nakami= function() { // prototypeの機能としてnakamiを作る
  console.log('あんこ');
};

var taiyaki = new Taiyaki();
taiyaki.nakami(); //'あんこ';

prototype プロパティを使用すると、既に作成されているオブジェクト にもプロパティおよびメソッドを追加できます。

function Taiyaki(nakami) {
    this.nakami = nakami;
}
var taiyaki = new Taiyaki('あんこ');
Taiyaki.prototype.price = 300;
var taiyaki_price = taiyaki.price;

参考

変数のスコープ (JavaScript) qiita.com