タグ

JavaScriptとJavascriptに関するs_moriのブックマーク (206)

  • console.logをラップしたい - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

    console.logをラップしたい - Qiita
  • JavaScript/HTML5でプレゼン用スライドをつくる方法まとめ - Qiita

    勉強会で発表資料を作る際などに プレゼン用スライドを作る方法は たくさんあります。 この前、ふとしたきっかけで Reveal.jsを使ってみたところ とても好評だったので、類似のライブラリを 探してみました。 デフォルトのテンプレートから綺麗なものが 多く、すぐに勉強会の発表資料などに 作れるものがたくさんありました。 個人的には ・Impress.js ・Reveal.js ・Jmpress.js 合わせて読みたい 【Tig全まとめ】Gitを自由自在に操るための必殺ツール 【おすすめ】MacのFinderをカスタマイズする魔法のコマンドたち たった一行でブラウザをメモ帳に変える不思議なコード ライブラリ一覧 1. Deck.js Demo http://imakewebthings.com/deck.js/#intro GitHub https://github.com/imakeweb

    JavaScript/HTML5でプレゼン用スライドをつくる方法まとめ - Qiita
  • JavaScriptフレームワークの寿命 | POSTD

    (注記:9/13、いただいた翻訳フィードバックを元に記事を修正いたしました。) 半年ごとに”今一番ホットな”フレームワークが新たに登場しては、私たちは興奮に沸き返ります。 誇大広告を信じてはいけません。 フレームワークの寿命 はプロジェクトの成功を左右するほど重要な要素です。フレームワークを選ぶ際、テクノロジにおける多くの意思決定者は納得のいく選択をするために、コミュニティの大きさ、人気、大企業によるサポートの有無などを基準にしています。しかし実際は、こうした要素によって寿命が決まるわけではありません。 最初は勢いがあったのに、徐々に弱まり、最終的には線香花火のごとく儚く消えてしまうようなフレームワークを選んでしまうと、書き直しに無駄な時間を費やしたり、チームの士気を下げたりする原因となります。記事は、そうした残念な結果を回避するヒントをまとめたものです。 記事では以下のことを示したい

    JavaScriptフレームワークの寿命 | POSTD
  • Google流 JavaScript におけるクラス定義の実現方法

    目次 2019年追記 はじめに クラス実現のために必要な JavaScript の言語仕様 function this call new 演算子 prototype チェーン プロパティ: prototype Google Closure 流のクラスの実現方法の概要 クラスの宣言とコンストラクタの定義 メンバ変数 (インスタンス変数) メソッド定義と呼び出し private, protected 継承 プロトタイプチェーンを利用してメソッドを親クラスから引き継ぐ 親クラスのコンストラクタの呼び出し メソッドオーバーライドと親クラスのメソッドの呼び出し 多重継承 abstract, interface inherits の実際のコード 良くないクラス実現方法 ES6 のクラス 2019年追記 この記事ではclassが導入されたES6以前のJavaScriptでどのようにクラスに相当するものを

  • LINE DEVELOPER DAY 2016 開催のお知らせ « LINE Engineers' Blog

    LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog saegusa2017-04-16Yoshihiro was a network engineer at LINE, responsible for all levels of LINE's infrastructure. Since being named Infra Platform Department manager, he is finding ways to apply LINE's technology and business goals to the platform. こんにちは。LINEでネットワークやデータセンターを担当している三枝です。2017年1月にJANOG39で登壇する機会を頂きましたので、今回

    LINE DEVELOPER DAY 2016 開催のお知らせ « LINE Engineers' Blog
  • 「フレームワークで実践! JavaScriptテスト入門」関連の最新 ニュース・レビュー・解説 記事 まとめ - ITmedia Keywords

    「フレームワークで実践! JavaScriptテスト入門」関連の最新 ニュース・レビュー・解説 記事 まとめ しっかりとJavaScriptをテストするために、今注目のJavaScript用のテストフレームワークをいくつか紹介し、その概要から実践的な使い方まで解説する連載 フレームワークで実践! JavaScriptテスト入門(5): Capybara-Webkit+Cucumber+Sinon.JSでJavaScriptのテストはここまで変わる しっかりとJavaScriptをテストするために、今注目のJavaScript用のテストフレームワークをいくつか紹介し、その概要から実践的な使い方まで解説する連載。今回は、RubyでWebKitをヘッドレス化するフレームワーク、受け入れテストの記述が日語でできるツール、スタブやモック、スパイが使えるライブラリを組み合わせたテスト方法などを紹介。

  • kuromoji.js使って構文解析した - Qiita

    こんにちは、らこです。先日から話題になってるJavaScript形態素解析器kuromoji.jsを使って、確率自由文脈文法で構文解析してみました。(注意:アルゴリズムの解説記事 ではない です) 結論 kuromoji.js遊びまくれるのでみんな使おう kuromoji.d.ts書いた 私は型大好き人間なのでTypeScript使ってkuromoji.js使いました。型定義ファイルは自分が使う部分だけエイヤっと自作しました(laco0416/kuromoji.d.ts)。 あと、プロジェクトに↑の自作型定義ファイルを読み込むのにdtsm使いました。tsd使ってたのが馬鹿らしくなるくらい便利です。作者のvvakameさんによるわかりやすい紹介はこちら 確率自由文脈文法とは ちゃんと説明すると長くなりますしうまく説明できる自信もないので、ばっさりカットします。 雰囲気つかむにはここらへんを

    kuromoji.js使って構文解析した - Qiita
  • 最近の行儀のよい JavaScript の書き方 - Qiita

    JavaScriptは移り変わりの早い言語です。 もう1年以上経っていますし、記事のメンテもちゃんとできていないので、消し線を入れることにしました。 参考程度のために記事は一応残しますが、より新しい情報を読まれることをお勧めいたします。 はじめに --- 最近では JavaScript の実行環境はブラウザに限りません。(node.js, Web Workers) また、旧来のような <script> 経由でのロードもとうに古くなっています。今は CommonJS スタイルで、require を用いたモジュールのロードを行なうことがより良いとされています。 ですから、次のようなことは改める必要があります。 ~~- var YourModule = {}; などとして、外部から YourModule.hoge(); などと呼び出す書き方 this === window だと思うこと~~ 今回

    最近の行儀のよい JavaScript の書き方 - Qiita
  • JavaScript フレームワーク - ペパボテックブログ

    フロントエンド周りの技術は驚異的なスピードで進化し、また多様化しています。それらを全てマスターするのは途方もなく大変なので、ペパボでは、社内のエンジニア・デザイナが「最低限これだけはおさえておこう」というスタンダードを文書化することにいたしました。社内向けを想定した文書ではありますが、社内のみに留めず多くの方に役立てたいと考えたため公開します。 この項目の担当 @hadashiA どうしてフレームワークを使う? (1) ドメインロジックとプレゼンテーションの分離 (2) SPA(シングルページアプリケーション) 流行り廃り (1) MVC (2) MVVM (3) Virtual DOM どれを使う? どうしてフレームワークを使う? (1) ドメインロジックとプレゼンテーションの分離 まずこちらの画面を見てください。 ©任天堂 スーパーマリオワールド スーパーマリオが右にダッシュすると、マ

    JavaScript フレームワーク - ペパボテックブログ
  • Adobe製のJavaScriptデバッガTheseusがすごい - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

    Adobe製のJavaScriptデバッガTheseusがすごい - Qiita
  • JavaScriptで位置情報を取得する方法(Geolocation API)

    ユーザーの現在位置を取得現在位置を取得するサンプルデモを見るには、下記ページにアクセスして下さい。このブログがあなたの位置情報を取得してもいいか、という確認が表示されるので、許可すると、あなたの現在位置(緯度、経度の座標)の取得を開始、表示します。 サンプルデモを見る 現在位置を取得するには、ユーザーのブラウザが、Geolocation APIという機能に対応している必要があります。Geolocation APIとは、簡単に言うと、端末の位置情報をやり取りするシステムです。GPSに対応しているスマホだけでなく、現在位置を設定できるデスクトップPCでも利用可能です。 判別方法は簡単です。Geolocation APIに対応している端末の場合、navigator.geolocationというオブジェクトが最初から存在するので、これの有無で判別すればいいだけです。 JavaScript // G

    JavaScriptで位置情報を取得する方法(Geolocation API)
  • Webフロントエンドに従事するお前らはいい加減高頻度イベントとレイアウトとスタイリングの付き合い方を考えろ - Qiita

    もうなんかこの際マジで言わせていただくんですけど、知ってるか知らないか分かりませんが世の中にはすごい頻度で呼ばれうるDOMイベントって言うのがいくつかあるわけですよ 例えば scroll mousemove, touchmove devicemotion 辺りですよ。 で、高頻度で呼ばれるって言うことは必然的に処理量が増えるって分かりますよね?????while(1) {}じゃないとはいえUIスレッドに十分影響を与えうる頻度で呼ばれる訳です。分かりますよね???????? そうなると当然そのイベント内で重い処理を行えば人間が認識できるレベルでのレスポンス遅延が起きるっていうのはご理解できますよね? 重い処理っていうのはまぁ想像出来るとは思うんですが例えばよくあるのが DOMのレイアウトプロパティへのアクセス offsetTop、offsetLeft、offsetWidth、offsetHe

    Webフロントエンドに従事するお前らはいい加減高頻度イベントとレイアウトとスタイリングの付き合い方を考えろ - Qiita
  • 動的に追加されるDOM要素に対応する方法あれこれ - Qiita

    Chrome拡張を作っていると,最近のモダンなWebサイトが後から動的にDOM要素を追加してきて困ることがある.毎度対処方法をぐぐっているので,ここにまとめておく. 追加される要素にイベントハンドラを付加したい jQueryのonメソッドにselectorを渡すことで,あとから動的に追加された子要素に対してもイベントを発火することができる. liveメソッドでも同様のことが出来たが,1.7で廃止された. 要素が追加されたことそのものを検出する DOMNodeInserted: 非推奨 要素が追加されたときに発火するDOMNodeInsertedというイベントが存在する.少し前に試した時はモダンなブラウザでは動いた. DOMに要素が挿入される度にイベントを起こすDOMNodeInsertedの扱い方 - 三等兵 にあるように,処理をブロックしないように非同期処理を行うべきだろう. 現在,DO

    動的に追加されるDOM要素に対応する方法あれこれ - Qiita
  • あなたがReactを使うべき理由 - mizchi's blog

    最近フロントエンドでfacebook/reactをずっと使っている。世界的には一部のエンジニアの間で流行っているのだが、国内だとqiitaのタグ等を見てもどうも少ない。みんなもっと使うべきだと思うので、宣伝かねて意見をまとめてみる。 複雑化するデータバインドに対する懸念 MVWのVに対して思いを馳せると、だいたい次のことに行き着く。すなわち、「ある構造体の入力に対して、必ず一意なビューを生成したい」 {items: [1, 2, 3]} を入力とすると、 1, 2, 3のli要素になってほしい。これは単純な例だから問題に成り得ないように見えるが、アプリケーション全体の状態を一つのjsonとして定義し、 そこから常に0から組み立てればアプリケーションの健全性が確保できると考えたことはないだろうか? 現実の問題 UIのだいたいの状態は遷移で表現される。遷移の差分をプログラマが記述する。jQue

    あなたがReactを使うべき理由 - mizchi's blog
  • Tumblrの省メモリーな無限スクロール - 記録

    無限スクロールまたはauto pagingと呼ばれるUIには、読み終えたコンテンツがどんどん画面の上のほうに溜まっていってメモリーをい潰すという問題がある。 なかでもTumblrは画像などのコンテンツが多いため、ダッシュボードダイバーたちは無限Tumblrユーザースクリプトなどのユーザースクリプトをインストールして、読み終えたコンテンツを定期的にページ上から自動削除するといった対策を講じていた。 ところが最近のTumblrのダッシュボードでは、ポストが画面外に出るとその中の要素が一時的にページから削除され、画面内に表示されると要素が再度復元されるようになっている。どうやらこれによって無限スクロールによるメモリーの圧迫が抑えられているらしい。 関連するコードはhttps://secure.assets.tumblr.com/assets/scripts/dashboard.jsの/*! s

  • #ガチJS でJavaScriptとフロントエンドの未来について熱い話をした - mizchi's blog

    (追記): このブログで一部のJSをgithubに置いてたら 「The website abuses rawgit.com」という警告が出てました。現在修正しました。ご迷惑おかけしました。 @kyo_agoさんの主催で、 @mizchi(シングルページ系フロントエンドJSer) と @damele0nさん(ゲームHTML5のJSer)でJavaScriptについて話をした。すごく有意義な話だったので、会話を思い出せる限り書いてみる。 このエントリを読む前にこの記事を読むと幸せになれる。 幸せになりたいソーシャルゲーム系Webフロントエンドエンジニア気で考える HTML GUI ツール第一回 - damelog このまとめは僕の主観であり、僕が理解できた部分と自分の発言を一番覚えてるのでどうしてもそれが多めになりますが、ご容赦ください。ついでに酒入ってる。 iOS SafariのIE化

    #ガチJS でJavaScriptとフロントエンドの未来について熱い話をした - mizchi's blog
  • JavaScriptユーティリティライブラリの紹介

    Empagliflozin, cardiovascular outcomes, and mortality in type 2 DM

    JavaScriptユーティリティライブラリの紹介
  • Object.observe()とNode.jsのイベントループの関係 - ぼちぼち日記

    1. はじめに 最近 Chrome で Object.observe() がデフォルトで有効になりました。 Reland "Enable Object.observe by default" again コミットログを見ればわかりますが、2回 revert された後の3度目の正直のコミットです。 確かに Object.observe() は非常に強力なAPIですけど、ES6の仕様候補の機能に入っていません。(ES.harmony or ES7?) ちょっと前に大幅な仕様見直しがあったので、こんな苦労してまでよくデフォルトで有効にするなぁと不思議でした。 しかし今日 AngularJS 2.0 のリリースを見て合点いきました。PolymerのMLにも流れてました。 AngularJS 2.0 polymer-dev PSA: ES Object.observe now on by defau

    Object.observe()とNode.jsのイベントループの関係 - ぼちぼち日記
  • Objective-Cのクラスの依存関係を「D3.js」でビジュアライズするライブラリ - Over&Out その後

    Objc-dependency-visualizerというOSSツールを使うと、アプリ内で使用している Objective-C クラスの依存関係をビジュアライズしてくれます。 試しに "iOS7 Sampler" でやってみると、こんな感じのを生成してくれました。 実行するのはrubyスクリプトで、依存関係だけが記述されているだけのシンプルなjsファイルが生成されます。 で、閲覧時にはリポジトリに同梱されている index.html 内のJavaScriptから、生成したjsファイルとビジュアライゼーション用 JavaScript ライブラリ「D3.js」を使用してビジュアライズされます。 そんなわけで、引っ張ったり特定の箇所にフォーカスしたり表示をいろいろカスタマイズしたりできます。 (SVProgressHUDにフォーカスした図) 使い方 GitHubからcloneしてきます。 git

    Objective-Cのクラスの依存関係を「D3.js」でビジュアライズするライブラリ - Over&Out その後
  • AngularJSのMVWパターンを理解する - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 12/4の記事(AngularJSを使ったWebアプリのアーキテクチャ設計)で書くと言ったまま放置していたので、AngularJSのMVCパターンについて書いてみたいと思います。 AngularJSのMVCについては、12/19のお前のAngular.jsはもうMVCではない。と言われないためのTutorialというすばらしい記事がありますが、記事ではもう少し抽象的な内容を扱ってみようかと思います。 MVW(Model-View-Whatever)パターンとは MVCパターンには、MVC2、MVP、MVVMなど数多くの派生パターンがあ

    AngularJSのMVWパターンを理解する - Qiita