タグ

JavaScriptとjavascriptに関するdencygonのブックマーク (68)

  • Node.js+Socket.IOで作る、通信対戦ができるHTML5ゲームシステムの作り方

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめまして、Yahoo!きっず開発担当です。 昨年Yahoo!きっずにてブラウザオンラインゲーム「おしゃべりリバーシ」をリリースしました。 ※おしゃべりリバーシは2015年10月をもってサービス終了しました。ご利用いただきまして、ありがとうございました。 このゲームは、通信対戦部分の通信プロトコルWebSocketを採用し、サーバミドルウェアにNode.js+Socket.IOを採用しました。この結果、ブラウザゲームでありながらマルチデバイスでの対戦を実現しました。 今回は、Node.js+Socket.IOによるWebSocketサーバのシステム構築方法について考慮すべきポイントを、「おしゃべりリバーシ」の実例を紹介しながら説

    Node.js+Socket.IOで作る、通信対戦ができるHTML5ゲームシステムの作り方
  • 優秀なJavaScriptの開発者になるための5か条 | POSTD

    (注記:7/15、いただいた翻訳フィードバックを元に記事を修正いたしました。) 子供の頃、私の興味は互いに関係性のない様々な分野に及んでいました。数学歴史も大好きでした。 ルネッサンスマン 、つまり 博学者 と言う、複数の分野に秀でた人になりたいと思っていました。これはとても難しい課題で、私は突如として、器用貧乏な人になってしまう危機に直面したのです。 私は特定の分野に特化しなくては、と考え始めました。そうすればたとえルネッサンスマンにはなれなくても、少なくとも、器用貧乏にならなくても済むと思ったのです。どうしたらソフトウェア開発をするのに必要な広い知識を保ちながら、1つの分野で専門性を高めることができるのでしょうか。 この記事では、過去5年間、私が良いJavaScript開発者になるために使ったテクニックとリソースの概要をお伝えしようと思います。 最近の多くのWeb開発者は、ある共通の

    優秀なJavaScriptの開発者になるための5か条 | POSTD
  • Promises/A+ (日本語訳)

    Promises/A+ 日語訳 このページ は、 Promises/A+ organization による Promises/A+ Promise Specification (バージョン 1.1.1, 2014-05-05)を日語に翻訳したものです。 この翻訳の正確性は保証されません。 この仕様の公式な文書は英語版であり、この日語版は公式のものではありません。 【 と 】で囲まれた部分は【訳者による注釈】です。 (他のウェブ関連仕様の一覧と共通機能の詳細) 更新:2015-01-14 (公開:2015-01-13 ) このページの大部分はスクリプトにより生成されています( 古いブラウザなど,一部のブラウザには対応していません: )。 文ダブルクリックで当該箇所の原文が表示されます(左下隅に各種 表示切替ボタン — CSS や DOM の対応が古いブラウザでは、一部機能しないことが

  • 爆速でわかるjQuery.Deferred超入門

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)です。これまで、JavaScriptで非同期処理を書く上での問題として、コールバック地獄やエラー処理に例外が使えないことなどを解説してきました。 これらの問題に対処するライブラリの1つであるjQuery.Deferredに関して、もう少し丁寧に解説いたします。なお、jQueryのバージョンは記事執筆時点の最新である、1.9.1を想定しています。 jQuery.Deferredとは jQuery.DeferredとはjQueryのバージョン1.5から導入された、非同期処理をうまく扱うための標準モジュールです。使いこなすことで、以下のような効果が見込めます。 非同期処理を連結

    爆速でわかるjQuery.Deferred超入門
  • シンプルでかつ最高のJavaScriptプロファイラ sjsp を作りました! ― Webアプリケーションが複雑化する中でプロファイラに求められるものとは何か - プログラムモグモグ

    あらすじ Web技術が複雑になる中で、JavaScriptのプロファイリングをとる方法とは。 プロファイリングを取るためのコードを手で書いてみましょう。 とてもシンプルで、かつ最高のJavaScriptプロファイラ sjsp を作りました。 当にあった怖い話 上司 「とにかくJavaScriptのコードを速くしてくれ」 私 「分かりました、速くします」 (次の日) 私 「いいプロファイラがないなら作ればいいじゃない」 同じチームの人 「えっ?」 私 「最高のJavaScriptプロファイラ作ったよ」 同じチームの人 「「えっえっ???」」 私 「早速使ってみたらこことここが遅いって分かったよ」 同じチームの人 「「「この子は一体…」」」 JavaScriptのプロファイリングの難しさ 近年、Webブラウザーの処理速度は著しく向上し、その可用性の高さから、アプリケーションのプラットフォーム

    シンプルでかつ最高のJavaScriptプロファイラ sjsp を作りました! ― Webアプリケーションが複雑化する中でプロファイラに求められるものとは何か - プログラムモグモグ
  • A Node in Nodes

  • 中上級者になるためのJavaScript【知識編】 - Qiita

    【News】電子書籍化しました! Gitbook Read Online Download PDF Download EPUB Download MOBI この記事は、敷居が低いもののなかなか中上級に進めず困っているJavaScript学習者の方を対象としています。よりJavaScriptに対する理解を深める際に気を付けるべき事柄、知っておくべきキーワードの提供をゴールとします。 「クロージャーについてもっと知りたい!」「カリー化なるものがあるのか、知らなかった!」といったきっかけになれば幸いです。 JavaScriptは書ける人が多く、ベストプラクティスが整ってあるものの、逆に間口が広すぎてコピペで済ませてしまったり(場合によってはしょうがないことですが)基礎を学ぶ機会がなくなんとなく現場に出てしまったりすることがありますので、ぜひこの機会にJavaScriptを復習してみてください。

    中上級者になるためのJavaScript【知識編】 - Qiita
  • JavaScript初心者脱却への道のりを考える - Qiita

    最も誤解されているプログラム言語として名高いJavaScriptの誤解を解きつつ、中級者(プログラム開発においてある程度戦力として計算できる)になるためには何から抑えればいんだろう、というのを考えた記録とリンク集です。 考えたというか、自分が勉強中です。 ※追記 KENJUさんが完全に上位互換な内容の投稿を公開されていましたので紹介。 中上級者になるためのJavaScript【知識編】 対象 何かしらのプログラム言語は書ける 多少JavaScriptを書いたことはあれど、言語の仕様はよく知らない レベルの基準 中級ってどんな人なのさ? JavaScriptの業務スキルレベル 判別表 (5段階) あなたはJavaScriptを知らない JavaScriptでよく使われるクロージャやプロトタイプの考え方を理解すること 代表的なライブラリ(jQueryとか)が使えること、最近ならNode.jsな

    JavaScript初心者脱却への道のりを考える - Qiita
  • JavaScript MVC入門

    社内勉強会3回目。 Observerパターンの説明から、イベント駆動、MVC、MVVMなどについてやりました。

    JavaScript MVC入門
  • モダンJavaScript環境構築一歩目

    JavaScriptの現状を支えるエコシステム群を軽く紹介して、モジュールについて少し掘り下げた勉強会

    モダンJavaScript環境構築一歩目
  • JavaScript基礎勉強会

    JavaScriptの現状を支えるエコシステム群を軽く紹介して、モジュールについて少し掘り下げた勉強会

    JavaScript基礎勉強会
  • Promiseアンチパターン - くじら公園

    Promise Anti-patternsを翻訳させて頂きました。著者のtaoofcodeから許可を頂いて翻訳、投稿しています。 Promiseは一度理解してしまえば簡単だが、いくつか頭を抱えさせるパターンがある。ここにあるのは私が経験したいくつかのアンチパターンだ。 ネストされたPromise 君は複数のPromiseをネストする: loadSomething().then(function(something) { loadAnotherthing().then(function(another) { DoSomethingOnThem(something, another); }); }); 君がこれをする理由は、両方のPromiseの結果で何かをする必要があるからだ。then()は一つ前のPromiseの結果しかコールバックに渡せないのでここでチェインを用いることはできない。 だが

    Promiseアンチパターン - くじら公園
  • JavaScript イディオム集

    JavaScriptでは、初見の人にはさっぱりわからないけれども、ある程度慣れた人は当たり前に使うイディオムが結構たくさんあります。知ってしまえば何てことはないので、私の知っている限りのイディオムとその意味を解説します。 (7/3追記: twitter等で教えていただいた内容を追加しました) +v (数値化) var v = "123"; console.log(+v + 100) // 223 console.log(v + 100) // 123100 vを数値化する方法では最もメジャーです。parseFloat(v) に比べて高速なのに加えて、parseFloatとは細かい挙動が異なります(例えば空文字列の場合、parseFloatならば NaN になりますが、 +v の場合はゼロになります)。必ず数値になることが保証されており、文字列などで数値化出来ない場合はNaNが返ります。 v

  • Node.js チュートリアル | Node ビギナーズブック

    書について 書は、Node.jsでのアプリケーション開発を始めようとする皆さんに、 ”高度な”JavaScriptについて知るべきあらゆることを解説します。 よくある”Hello World”チュートリアルの、はるか上をいくものです。 ステータス 貴方が読んでいるのは、書のいわゆる最終版となります。 つまり書は、間違いが見つかった場合や、 Node.jsの新バージョンにおえる変更点を反映する時のみ、改訂されます。 最終更新日は2012年2月12日です。 書内のコードのサンプルは、Node.jsのバージョン0.6.10でテストしています。 ターゲット読者 書は、RubyPythonPHPJavaのような、少なくともひとつのオブジェクト指向言語を理解しており、 JavaScriptについてはあまり経験がなく、Node.jsについては全く経験がないという、 著者と同じようなバッ

  • Node.js を JavaScript から勉強するときに使ったものまとめ

    最近仕事ではNode.jsでサーバサイドなプログラミングばかりしているのですが、人に教える機会が凄く多くなってきました。 他の言語やっている人が、1から(人によってはJavaScriptから) Node.jsをやってみたい!という人がちょくちょく僕を訪ねてくれます。

    Node.js を JavaScript から勉強するときに使ったものまとめ
  • Heroes of JavaScript and Testing · Wallaby.js Blog

    Heroes of JavaScript and Testing 29 May 2015 In 1995, Earth has become a JavaScript faring Federation. While colonizing new web technologies, humans have encountered an insectoid species known as “Bugs”. The bugs appear to be little more than killing machines, though there are suggestions that they were provoked by the intrusion of humans into their habitats. I have taken a few lines from the “Sta

    Heroes of JavaScript and Testing · Wallaby.js Blog
  • 【翻訳】Web世代のデベロッパーのためのmake - MOL

    Original:Make for the Web Generation (2015-02-28)by Casper Beyer イントロ JavaScriptの普及に伴いビルドツールが盛んだ。人気なものをいくつか挙げれば、grunt、gulp、slush、broccoliやbrunchなどがあるが、結局、名前をつけただけにすぎない。 多かれ少なかれ、これらのツールはファイルコピーからzipファイル作成のようなシンプルなタスク処理でさえ、すべてプラグインに依存しているので、それらのタスクを実行するためにプラグインを必要とするだろう。 これらのツールは理想論的には大きな柔軟性をもたらすものとされているが、実際はUNIXのエコシステムをただ複製しているだけにすぎない。このために君のプロジェクトは早々に、大きな開発依存性のバンドルを持つことであろう、そして、やっているタスクは単なる普通のコピー、

    【翻訳】Web世代のデベロッパーのためのmake - MOL
  • Canvas tutorial - MDC

    このチュートリアルは、 <canvas> 要素を使用して二次元のグラフィックを描画する方法を、基から説明します。ここでの例は、キャンバスで何ができるかを明確に示すものであり、独自のコンテンツを作成するためのコードスニペットも提供しています。 <canvas> は HTML の要素であり、スクリプト(ふつうは JavaScript)を使ってグラフィックを描くことができます。これは例えば、グラフを描いたり、写真を合成したり、簡単なアニメーションを作成したりすることができます。 <canvas> は ApplemacOS Dashboard のために WebKit に初めて導入した後、ブラウザーに実装されました。現在は、あらゆる主要ブラウザーが対応しています。 <canvas> を使うのはそれほど難しくはありませんが、 HTMLJavaScript の基的な理解が必要です。一部の

    Canvas tutorial - MDC
  • 継承とプロトタイプチェーン - JavaScript | MDN

    JavaScript のオブジェクトはプロパティ(自身のプロパティを指す)の動的な「袋」です。 JavaScript のオブジェクトは、プロトタイプオブジェクトへのリンクを持っています。あるオブジェクトのプロパティにアクセスしようとすると、オブジェクトだけでなく、オブジェクトのプロトタイプ、プロトタイプのプロトタイプへと、一致する名前のプロパティが得られるか、プロトタイプチェーンの終端に到達するまで、プロパティの探索が行われます。 メモ: ECMAScript 標準に従い、 someObject.[[Prototype]] という表記を someObject のプロトタイプを示すのに使用しています。内部スロット [[Prototype]] には Object.getPrototypeOf() と Object.setPrototypeOf() 関数でアクセスすることができます。これは、標準

    継承とプロトタイプチェーン - JavaScript | MDN
  • JavaScript 言語概要 - JavaScript | MDN

    JavaScriptチュートリアルBeginner's tutorialsYour first website: Adding interactivityDynamic scripting with JavaScriptJavaScript frameworks and librariesJavaScript ガイド入門編文法とデータ型制御フローとエラー処理ループとイテレーター関数式と演算子数値と文字列日付と時刻の表現正規表現インデックス付きコレクションキー付きコレクションオブジェクトの利用クラスの使用プロミスの使用JavaScript 型付き配列イテレーターとジェネレーターリソース管理国際化JavaScript モジュール中級編Advanced JavaScript objectsAsynchronous JavaScriptClient-side web APIs言語概要JavaScr

    JavaScript 言語概要 - JavaScript | MDN