【JS】JavaScriptのクラス

JavaScriptのクラス定義の方法

以下の2通り
【1】 class でクラス定義を実現する
【2】 function でクラス定義を実現する

【1】 class でクラス定義を実現する

 * ES2015(ES6) から導入

注意

 * IE11 や 古いブラウザでは、対応外

サンプル

 * 以下の関連記事で使用しているので、こちらを参照
https://blogs.yahoo.co.jp/dk521123/37663489.html

参考文献

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Classes

【2】 function でクラス定義を実現する

サンプル

<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>Sample</title>
</head>
<body>
<div id="result1">result1</div>
<div id="result2">result2</div>
<div id="result3">result3</div>
<div id="result4">result4</div>
<div id="result5">result5</div>
</body>
<script type="text/javascript" charset="UTF-8">
var Gender = {
    None: 0,
    Man: 1,
    Woman: 2,
};
function Person(nameValue, genderValue) {
    this.nameValue = nameValue;
    this.genderValue = genderValue;
}

var people = [];
people["result1"] = new Person("Mike", Gender.Man);
people["result3"] = new Person("Chole", Gender.Woman);
people["result4"] = new Person("Max", Gender.Woman);

for (var keyValue in people) {
    var targePerson = people[keyValue];
    document.getElementById(keyValue).innerText =
      targePerson.nameValue + " " + targePerson.genderValue;
}

</script>
</html>

参考文献

http://www.yunabe.jp/docs/javascript_class_in_google.html
http://www.atmarkit.co.jp/ait/articles/1011/29/news109_2.html