SSブログ

[Review]独習JavaScript 新版 [Book's Review (Develop)]

(1)レビュー
 JavaScriptは古くからあり、時代と共に進化してきています。
 JavaScriptの独習シリーズは過去にもありましたが、
 最近(2021年)、独習シリーズでJavaScriptの新版が登場しました。

 クラス反復処理非同期処理など、
 サンプルプログラムを例示しながらわかりやすく解説されています。
 
 例えば、反復処理を実装するために、
 他の言語(C#、Python等)ではyieldキーワードを採用していますが、
 新版のJavaScriptでもyieldが採用されています。

 今どきの新しいJavaScriptを習得するには、
 重宝の1冊だと思います。

 試しに、当書籍を参考にしながら、
 オブジェクト指向を意識したコードを書いてみました。
 今となっては珍しいコードではないかと思いますが、
 従来のJavaScriptよりもやれることが拡がったように思えます。

 以下は、Perosnクラスに、
 NameBirthdayのプロパティを定義し、
 sayHello()saysayBirthday()sayAge()の各々のメソッドで、
 あいさつ、誕生日出力、年齢出力をするサンプルです。

<html>
<head>

<script language="javascript">
   //【テスト関数】
   function sayHello()
   {
      const person = new Person(
         {first:"太郎", last:"山田"},
         new Date(1953,8-1,15));
      person.sayHello();
   }

   function sayBirthDay()
   {
      const person = new Person(
         {first:"太郎", last:"山田"},
         new Date(1953,8-1,15));
      person.sayBirthDay();
   }

   function sayAge()
   {
      const person = new Person(
         {first:"太郎", last:"山田"},
         new Date(1953,8-1,15));
      person.sayAge();
   }

   //【クラス定義】
   class Person{
      constructor(name, birthday){
         this.name = name;
         this.birthday = birthday;
      }

      //【メソッド定義】
      //あいさつをする。
      sayHello(){
         window.alert(
            "こんにちは。" + 
            this.name.first + " " + 
            this.name.last + "です。");
      }

      //生年月日を出力する。
      sayBirthDay(){
         window.alert(this.birthday);
      }

      //年齢を出力する。
      sayAge(){
         let age = 0;
         let today = new Date();

         if(today.getMonth() * 100 + today.getDate() < 
            this.birthday.getMonth() * 100 + this.birthday.getDate())
         {
            //今日が誕生日前の場合
            age=today.getFullYear() - this.birthday.getFullYear() -1;
         }
         else
         {
            //今日が誕生日以降の場合
            age=today.getFullYear() - this.birthday.getFullYear();
         }

         window.alert("私は" + age + "歳です。");
      }

   }

</script>
</head>
<body bgcolor="azure">

<input type="button" value="あいさつをする。" onclick="sayHello();"><br/>
<input type="button" value="生年月日を言う。" onclick="sayBirthDay();"><br/>
<input type="button" value="年齢を言う。" onclick="sayAge();"><br/>

</body>
</html>
[JavaScript]オブジェクト指向を意識したコード

[実行結果]
JavaScript実行結果.PNG

(2)リンク
独習JavaScript 新版

独習JavaScript 新版

  • 作者: CodeMafia 外村将大
  • 出版社/メーカー: 翔泳社
  • 発売日: 2021/11/15
  • メディア: Kindle版

nice!(0)  コメント(0) 
共通テーマ:パソコン・インターネット

nice! 0

コメント 0

コメントを書く

お名前:[必須]
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。