スキップしてメイン コンテンツに移動

[JavaScript]プロトタイプ定義したメソッド内でsetTimeoutを使って自身を呼び 出す方法

コメント欄で思いがけず見つけたので、メモ。

prototype定義したメソッド内でsetTimeoutで自身を呼び出す方法

・JavaScript’s setTimeout and how to use it with your methods » Klevo blog
http://klevo.sk/javascript/javascripts-settimeout-and-how-to-use-it-with-your-methods/

If you are using the prototype javascript, you can take advantage of its general purpose early-binding function, bind (see http://alternateidea.com/blog/articles/2007/7/18/javascript-scope-and-binding).
The solution using prototype’s bind function is:

setTimeout(this.methodToCall.bind(this), time);

上記赤文字の通りに使えば良いのですが、メソッド自身を繰り返し呼んでブラウザに時計のように表示するサンプルを以下に。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
  <meta http-equiv="Content-Type"
    content="text/html; charset=utf-8" />
  <title>BrowserTimer</title>
  <meta name="author" content="takaiwa29" />

  <script type="text/javascript">
  var BrowserTimer = function() {}
  BrowserTimer.prototype = {
    timerMethod: function () {
      // 現在時刻を取得
      var nowtime = new Date();

      var display = document.getElementById("display");
      // 現在時刻を表示
      display.innerHTML = nowtime.toString();

      // １秒後に同メソッドを呼ぶ
      setTimeout(this.timerMethod.bind(this),1000);
    }
  }

  function init() {
    var hoge = new BrowserTimer();
    hoge.timerMethod();
  }
  </script>
</head>
<body onLoad="init()">
<!-- タイマー表示場所 -->
<div id="display"></div>
</body>
</html>


実行結果はこんな感じ



 



WS000408

ラベル:

コメント

コメントを投稿

このブログの人気の投稿

Javaでprivateなfieldやmethodにアクセスする

JUnitでテストしてると、privateなフィールドにアクセスして、値を参照したりセットしたりしたくなるわけですが、よく使うのでメモしておきます。 例えば、次のような対象のクラスがあるとします。 public class ParentClass { private String hoge = "ParentClass!!"; public void dispMsg() { System.out.println("dispMsg:" + hoge); } private void privateDispMsg(String msg) { System.out.println("dispMsg:" + msg); } }
コメントを投稿
続きを読む

GolangでWindows GUIアプリケーション

GUIアプリ作成の前提 社内ツールとしてexeで配布 開発環境はGoLandを使う 社内ツールとしてexeを配布ということであれば、Visual StudioでC#による開発だと思います。しかしながら、Go言語を習得したいのと、GoLandの補完機能が便利で、Android Studio使っていたこともあり、とっつきやすいという点からGo縛りでGUIアプリケーションを考えたいと思います。 lxn/walk Windows application library kit for Go. Windows向けしか考えていないので、まずこのライブラリなのですが、ボタンやコンボボックスが思ったように並ばなかったり、手軽にイメージボタンを配置したりなど、簡単にレイアウトを変更できない課題に直面しました。レイアウト作成だけで時間を取られてしまいます。そう言えば、Androidアプリ開発のときは、XMLでデザイン部分を切り離してたのを思い出して、今回の調査の運びとなりました。 fyne-io/fyne Cross platform native GUIs designed for Go based on Material Design. Supports: Linux, macOS, Windows, BSD, iOS and Android. walkと比べると、クロスプラットフォームで作成できるのですが、こちらもコードの中にデザインを書いていく形でした。 therecipe/qt therecipe/qt allows you to write Qt applications entirely in Go or JavaScript. Qt Creatorなるものがあるようで、デザイン部分を切り離せる印象はあるものの、最新のPCでもビルドに時間がかかるようで、学習コストもかかるという記事を見かけて断念しました。 どうしたものかとツイートしましたら、下記のようにご助言をいただいた。 同じ課題に対し色々試した結果、PWAのフルキャッシュドに落ち着いた。中身はGo+WASMで。 https://t.co/e60whDTV16 — のぼのぼ📡 (@nobonobo) July 21, 2020 PWA 早速調べてみました。Googleが進めているプロジェクトで、ネイティブアプリのよ
コメントを投稿
続きを読む

Eclipseの高速化メモ

Eclipseが重いと一言に言っても、いろいろな工程での話があると思いますが、過去記事のなども含めてこの記事にピックアップしておきたいと思います。以下はWindows環境での話です。
コメントを投稿
続きを読む