タグ

javascriptに関するsigegeのブックマーク (27)

  • JavaScript 製ファミコンエミュレータを公開しました - まるまるこふこふ

    公開しました(過去系) github.com Demo FaithJS Screenshot 作ろうと思ったきっかけ コンピュータの仕組みについて知りたいなら NES エミュ作るのが手っ取り早いと、 優秀な人が強い事を言ってて、僕もコンピュータの仕組みについて知りたかったので、 実装しようと思いました。 まず読んだ コンピュータシステムの理論と実装 ―モダンなコンピュータの作り方 CPUやメモリの仕組みを大まかに知ることができる 30日でできる! OS自作入門 OSの仕組みやアセンブラの基がわかる 自作エミュレータで学ぶx86アーキテクチャ コンピュータが動く仕組みを徹底理解! こちらもアセンブラに慣れるために読んだ たのしいバイナリの歩き方 バイナリに慣れるために読んだ コンピュータの仕組みについて何も知識がなかったので、上記のを読んで勉強しました 参考にしたサイト NES on

    JavaScript 製ファミコンエミュレータを公開しました - まるまるこふこふ
  • 知ってる?Web開発者がJavaScriptでゲームを作るときのはじめの一歩

    Web開発者が初めてゲームを作るときに戸惑うのが、「ゲームループ」という考え方。普通のWebアプリを作るのとどう違うのか、シンプルなゲームのプログラム構造に触れてみましょう。 「ゲームループ」は、時間をかけて状態を変化させることでアニメーションやゲームをレンダリングするために使う技術につけられた名前です。来は、ユーザー入力を受け取り、経過時間の状態を更新してからフレームをできるだけ多くの回数描く関数です。 この短い記事では、基的な技術がどう機能するかを説明します。基的な技術が分かれば、ブラウザベースのゲームやアニメーションの制作を始められます。 ゲームループは、JavaScriptでは次のようになります。 function update(progress) { // Update the state of the world for the elapsed time since la

    知ってる?Web開発者がJavaScriptでゲームを作るときのはじめの一歩
  • そのJavaScriptの関数は本当に純粋関数? | POSTD

    (2016/12/11、いただいたフィードバックをもとに翻訳を修正いたしました。) JavaScriptにおいて”純粋関数”とはどういう意味でしょうか? 一般的なプログラムの用語では、純粋性というのは”参照透過性”として知られています。カッコよく言うと、「 式や関数の呼び出しをその結果と置き換えたとしても、プログラムの振る舞いが決して変わらない 」こと、また別の言い方をするなら、「 同じ入力値を渡すたび、決まって同じ出力値が得られる 」ということです。 これなら直感的に理解できそうに聞こえますし、 x => x * 10 などの関数は純粋に見えます。これに数字の 3 を引数として渡したら必ず、出力値として 30 が得られますからね。では、ある関数が純粋で別の関数が純粋でないと、どうしたら分かるのでしょう? コードを読むだけで十分でしょうか? 一般的にどう思われているかを見てみましょう。昨日

    そのJavaScriptの関数は本当に純粋関数? | POSTD
  • 黒魔術(JavaScript)まとめ - Qiita

    まえがき JavaScript、書いてますか? JavaScriptは今や世界中の人々に愛されています。 stackoverflowの2016年の調査によるとJavaScriptは地球上で最も一般的に使用されているプログラミング言語だそうです。 JavaScript is the most commonly used programming language on earth. Even Back-End developers are more likely to use it than any other language. link しかしJavaScriptは愛されすぎているが故、しばしば黒魔術のようだと比喩されることも少なくありません。 愛と憎しみが紙一重とはこのことですね。 ということでそんなこんなはどうでもいいのですが、自分もJavaScriptは大好きです。 今回は黒魔術まと

    黒魔術(JavaScript)まとめ - Qiita
  • 20160930 フロントエンド高速化 業務編 (社内勉強会)

    バックアップと障害復旧から考えるOracle Database, MySQL, PostgreSQLの違いRyota Watabe

    20160930 フロントエンド高速化 業務編 (社内勉強会)
  • 図で理解するJavaScriptのプロトタイプチェーン - Qiita

    JavaScriptのリファレンスといえばMDNですよね。 JavaScriptで調べものをする際に、真っ先に見る方も多いでしょう。 そんなMDNですが読めていますか? 例えばArrayのページを見てみましょう。 さらっと書かれているprototype JavaScriptを理解するにはプロトタイプチェーンを知る必要がある 記事の目的 プロトタイプチェーンを理解する MDNをより読めるようにする JavaScriptのObjectやArrayなどの基型の構造を理解する 確認環境や記述について Chrome 52のコンソールで動作確認 ES5で記述 説明のしやすさを重視、プロトタイプをあらわすのに__proto__を使って記述 まずはオブジェクトについてみていく シンプルなオブジェクトを作る

    図で理解するJavaScriptのプロトタイプチェーン - Qiita
  • や...やっと理解できた!JavaScriptのプロトタイプチェーン - maeharinの日記

    JavaScriptのプロトタイプチェーンについて理解しようとしたのだけど、prototypeとか__proto__とかごちゃごちゃになって、色んなブログを読んでもなかなか理解しきれなくて悶々としていたのだが、図を書いたらパッと理解できた!以下、情報ソースはなるべくECMAScript仕様書(3rd)を元にするようにして書きました なぜ分かりづらいのか? そもそも、なぜJavaScriptのプロトタイプチェーンは自分にとってこうも分かりづらかったのだろうか?自分なりに分析してみると、まず、「似ているが違う用語が沢山ある」という点がある。ざっとあげただけでも、「prototypeと__proto__」「__proto__と[[Prototype]]」「FunctionとFunctionオブジェクト」などがある。そして次に、「入り組んだ構造が動的に変化する」という点がある。上記のように似たよう

    や...やっと理解できた!JavaScriptのプロトタイプチェーン - maeharinの日記
  • 様々なJavaScriptライブラリをコレクションしているWebサイト・JSDB.IO

    様々なJSライブラリのまとめサイトのご紹介。主にクライアントサイドのJSライブラリを中心にコレクションしているみたいです。シンプルで探しやすかったのでメモ。 JSのコレクションサイト。サクサク動作して広告などの余計なコンテンツも無いので非常に探しやすい印象です。

    様々なJavaScriptライブラリをコレクションしているWebサイト・JSDB.IO
  • JavaScript / jQueryでtableの行を「追加」「削除」「移動」「変更」させる方法

    まず「リスト選択」の列の選択肢から「B」を選択します。 ⇒「リスト名」が「B」に変更されます。(変更)「追加/削除」の列の「+」ボタンを押します。 ⇒行が追加されます。(追加)追加された行の「リスト順」の列の「↑」をクリックします。 ⇒行が上へ移動します。(移動)移動した行の「リスト順」の列の「↓」をクリックします。 ⇒行が下へ移動します。(移動)最後に、好きな行の「追加/削除」の列の「-」ボタンを押します。 ⇒行が削除されます。(削除) いかがでしょうか。まあ、よくある機能ですね。では、この機能の実装方法について以下にまとめておきたいと思います。 HTMLHTMLでは、以下の点がポイントとなります。 それぞれの機能を発生させるためのイベントハンドラをセットしておきます。操作の対象となる「行」の部分は<tbody>タグ内に記述するようにします(これが後々大事になります)。JavaScrip

    JavaScript / jQueryでtableの行を「追加」「削除」「移動」「変更」させる方法
  • JavaScriptでテーブルを操作する

    春なので、いきなり「JavaScript書け」と職場で言われて困惑しているIT奴隷仲間も多いことでしょう。 なので、特につまずきそうなテーブル操作についてざっくりまとめてみました。 ちゃんとした情報はJavaScriptクイックリファレンス 第5版でも参照してください。 //まず、IDでテーブルへの参照を取得。 var table = document.getElementById("tableId"); //取得したテーブルへ行を追加する。 //引数は、行を挿入したい位置。1行目として作成したいなら0。 //-1を指定すると末尾になる。 //戻り値は作成された行(tr)への参照。 var row = table.insertRow(-1); //作成した行にセルを追加する。引数はinsertRowと一緒。戻り値も一緒。 var cell1 = row.insertCell(-1); va

    JavaScriptでテーブルを操作する
  • Ajaxを勉強しよう

    このページはAjaxを勉強してみたい人向けの学習用ページです。サーバーを入れ替えたため一部CGIを使用したものが動作していません。時間のある時に修正します。また、書いてから、かなり時間が経過しているため内容的に古いものもあります。ご了承ください。 Ajaxで利用されるエフェクトに関しては別ページ(Ajax Effect)に移動しました。 Ajax関連書籍に関してはAjax関連書籍一覧ページを用意しました。 Prototype系ライブラリ サンプルプログラム【New !!】のページを用意しましたので、Prototype系のライブラリを利用している方は参考にしてみてください。 ミスや間違いなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。 第一章 Ajaxって? AjaxとRIA AjaxとDHTML AjaxとFlash Ajaxに必要な知識と技術 Aja

  • テーブル クリックしたセルの行位置,列位置,内容の取得

    サンプルソース <html> <head> <title>テーブル クリックしたセルの行位置,列位置,内容の取得</title> <style type="text/css"> <!-- #TBL{ border-collapse: collapse; } #TBL th,td{ width : 170px; cursor: hand; padding:5px; } #Div{ border: 1px ridge fuchsia; width : 380px; padding : 10px; } --> </style> <script language="javascript"> function getCELL() { var myTbl = document.getElementById('TBL'); // trをループ。rowsコレクションで,行位置取得。 for (var i=

    テーブル クリックしたセルの行位置,列位置,内容の取得
  • jQueryのAjaxを使用して外部htmlを読み込む

    Posted: 2011.04.04 / Category: javascript / Tag: Ajax, jQuery Ajaxとは画面遷移なしで、データを取得したり表示したりできるあれです。最近のWebアプリケーションでは必須な技術らしいです。 知識としては知っていたものの実際使ったことがなかったので、かなり今更感が高いですが挑戦してみます。 Ajaxはサーバー側のプログラムの方が重要な気がしますが、ここでは静的なhtmlファイルを使用します。 まずは読み込まれる側のhtmlファイルを作成します。 load.html <li>読み込めたかな?</li> 読み込まれる側は「li」だけです。「load.html」という名前で保存します。 次は読み込む側です。 index.html <ul id="sample01"></ul> <p><a href="#" id="button01">ボ

    jQueryのAjaxを使用して外部htmlを読み込む
  • enchant.jsでつくる“シロートが3時間でゲームをつくる”作り方 - 週刊アスキー

    JavaScriptで書かれたソースコードはたったの75行 window.onload = function() {     game = new Game(320, 320);     game.fps = 24;     game.life = 3;     game.time  = 60;     game.score = 000;     var label;     game.preload(['http://jsrun.it/assets/k/r/t/X/krtXz.gif','http://jsrun.it/assets/v/1/a/l/v1alF.gif','http://jsrun.it/assets/e/B/C/G/eBCGr.gif']);     game.onload = function() {         bear = new Sprite(32, 32)

    enchant.jsでつくる“シロートが3時間でゲームをつくる”作り方 - 週刊アスキー
  • http://wise9.github.io/enchant.js/doc/ja/

  • コンピュータオンラインテキスト

    教育サーバ Mizutani Laboratory mizutani@rsch.tuis.ac.jp コンピュータオンラインテキスト パソコンをインターネットに接続する PPPダイアルアップ接続によって学ネットワークに接続する Netscape navigatorの使い方 世界中で使われているWebブラウザの基的使い方の紹介 ネットワーク利用ポリシー インターネット時代のマナーと実際を東京情報大学での利用に即して解説 ファイルの組織的管理 マルチプラットホーム環境におけるファイル管理法 文書要素とマークアップ文書 文書とは何か.そのあるべき姿を探る 電子文書書法 情報処理に適した文書を書くための基 パターンマッチとgrep 文書情報処理ツールとしてのgrepの利用法 Muleの使い方 世界でもっとも優れているUNIXエディタMuleの簡単な使い方 UNIXでのメイル MNewsを使っ

  • 第4回 JavaScriptでオブジェクト指向プログラミング ― @IT

    JavaScriptが、いま注目を浴びている。 JavaScriptがこれだけの注目を浴びた理由の1つとして、Ajax技術の登場とも相まって、JavaScriptに対する確かな理解の必要性が高まったという事情は否定できない。しかし、それだけでは説明できない急速な注目の理由として、もう1つ、JavaScriptという言語そのものが持つユニークさが開発者の目を引いたという点は看過できないだろう。 もっとも、このユニークさは同時に、多くの開発者が感じているJavaScriptに対する苦手意識と同義でもある。これまでVisual BasicやC#、Javaといった言語でオブジェクト指向構文になじんできた開発者にとって、JavaScriptのオブジェクト指向構文はいかにも奇異なものに映るのだ。ようやくクラスという概念を理解した開発者が、JavaScriptという言語の背後にたびたび見え隠れする「プロ

    第4回 JavaScriptでオブジェクト指向プログラミング ― @IT
  • iPhone(iOS4.2)の加速度センサーとジャイロセンサーの値をJavascriptで取得する | alt

    去年の暮れにリリースされた「iOS4.2」から WEBブラウザ(Safari)で加速度センサー、ジャイロセンサーのAPIにアクセスできるようになりました。 せっかくiPhone持っているんだし、試しにそれぞれの値をブラウザに出力してみます。 センサー値の取得はJavascriptのイベントにて行います。 まずiPhoneの傾きが変化するとdevicemotionというイベントが発生するので window.addEventListenerで感知し、 関数に渡されるイベントオブジェクトのプロパティよりそれぞれの値を取得します。 別でdeviceorientationというイベントがありますが、 こちらでも回転の加速度のみ取得が可能です。 ・傾きの加速度は、accelerationオブジェクト。 (xが左~右、yが手前~奥、zが上~下) ・傾きの重力加速度は、acceler

  • CoroCoro : Step2 – プレイヤーを傾きで動かせるようにしてみよう! | TM Life

  • JavaScript基礎文法最速マスター - gifnksmの雑多なメモ

    続々と増え続ける基礎文法最速マスターシリーズ(あまりにも増えてきたので他の言語記事へのリンクは別の記事に移しました)。 JavaScript 版は誰も書いていなかったようなので書いてみます。こういう解説記事的なものを書くのは初めてなので変なところがあったら指摘して頂けるとありがたいです。 JavaScriptの基礎概念についての解説はこちら:JavaScript概念最速マスター - TechTalkManiacs 1/31 23:58追記 コメント欄のos0xさんのご指摘を基に一部追記・修正を行いました。 2/2 2:52追記 switch文・正規表現・例外処理について追加しました。 2/2 6:44追記 コメントでfavrilさんにご指摘頂いた点(typo & コメント・サンプル追加)を修正・加筆しました。 2/2 7:15追記 トラックバックでLiosKさんにご指摘頂いた点(cal

    JavaScript基礎文法最速マスター - gifnksmの雑多なメモ