JavaScriptはprototypeをベースにした言語である
こちらがあるので、ES6ではクラスが使われてますが、きちんと基礎のprototypeを理解していきます。
###基本
- prototypeプロパティを使って、どんなオブジェクトも継承可能
- コンストラクタをもとに、いくらでもインスタンスを作れる
- インスタンスとは、実態/実際に作ったもの
###基本的な記述方法
オブジェクト名.prototype.メソッド名= function() {メソッドの処理内容}
コードで書いていきます。
ここでは一つの会社を想定し、どこの部署に、何年くらい働いているのかを出してみます。
script.js
//コンストラクタ(設計図)を作成
var Person = function(name, yearOfJoin, department) {
this.name = name; //引数nameを渡してる
this.yearOfJoin = yearOfJoin; //引数yearOfJoinを渡してる
this.department = department; //引数departmentを渡してる
} //この時点ではオブジェクトは空
Person.prototype.calculateYears = function() {
console.log(2020 - this.yearOfJoin);
};//prototypeでPersonのコンストラクタを継承
//設計図にプロパティを入れる
var mike = new Person('John', 2005, 'sales');
var jessie = new Person('Jessie', 2010, 'Accounting');
var mary = new Person('Mary', 2019, 'Planning');
mike.calculateYears(); //結果:15
jessie.calculateYears();//結果:10
mary.calculateYears();//結果:1
functionだけでなく、プロパティも追加できる(でも上記の方が一般的)
script.js
Person.prototype.lastName = 'Williams';
console.log(mike.lastName); //結果:Williams
console.log(jessie.lastName); //結果:Williams
console.log(mary.lastName); //結果:Williams
//全員同じラストネーム
###補足
コンストラクタfunctionの外側でprototypeを定義することで、
毎回同じ内容が、インスタンスが作成される度にコピーされずに済みます。
=参照として利用することで、メモリーを最低限に抑えられる。