タグ

ブックマーク / efcl.info (8)

  • ECMAScript 2015以降のJavaScriptの`this`を理解する

    この記事はJavaScriptの入門書として書いているjs-primerのthisに関する部分をベースにしています。 またjs-primerでは書けなかった現在時点(2018年1月1日)でのブラウザの挙動についてを加えたものです。 次の場所にjs-primer版(書籍版)のthisについての解説があります。 この記事と違って実際にコードを実行しながら読めるので、学習ソースとしては書籍版を推奨します。 書籍版: 関数とthis · JavaScriptの入門書 #jsprimer また、バグ報告やPRも直接リポジトリにして問題ありません。 asciidwango/js-primer: JavaScriptの入門書 おかしい場所を選択した状態で右下にある”Bug Report”ボタンを押せば、簡単にtypoとかのバグを報告できます。(PRでも歓迎) 前置きはこの辺までで、ここから編。 この記

    ECMAScript 2015以降のJavaScriptの`this`を理解する
  • Node学園 16時限目 アウトラインメモ | Web Scratch

    Node学園 16時限目 ES2015発行記念 - connpass に参加してきたメモ Run Through ES6 - @teppeis スライド: Run through ES6 ES6 総復習 ES6 or ES2015 ? 〜WEB+DB PRESS Vol.87 ES6特集に寄せて〜 | Cybozu Inside Out | サイボウズエンジニアのブログ ECMAScript Ecmaで策定されてる仕様 ES6 ES3から16年、ES5から6年 特徴 モダンなシンタックス 大規模開発 後方互換性が高い 今すぐ動かせる ES6とES2015 一年ごとにリリースしていきたいよね ES6 Features 新しいシンタックス 新しいグローバルオブジェクト 既存のオブジェクトの拡張 新しいシンタックス 色々 Class Subclassing Module CommonJSとかは関

    Node学園 16時限目 アウトラインメモ | Web Scratch
  • React.js meetupにて10分で実装するFluxについて発表してきた

    React.js meetup #1 - connpassに参加して、Fluxアーキテクチャについて話してきました。 10分で実装するFlux - @azu 10分で実装するFlux というタイトルで発表してきました。 以前実装したmaterial-fluxをより小さくただのEventEmitterだけで実装したような内容になっています。 Fluxは図が複雑だったり、複雑そうな文章が出てきたりしますが、ミニマムな実装をするとやってることはよく見るようなものをある程度形式化しただけのように見えてきます。(Dispatcherが色々複雑な制御していますが) そういうのを理解するために実際に作って見るとわかりやすいかもなーと思って10分で実装するFluxというスライドを書きました。 発表では触れなかったおまけでFluxライブラリの比較やよくある疑問とかもちょっと書いてました。 material-

    React.js meetupにて10分で実装するFluxについて発表してきた
  • ある要素が表示されるまで待つJSライブラリを書いた(MutationObserver)

    使い方 waitForElement(selector, [timeout]) という感じで使います。 waitForElement()はPromiseを返すので、見つかったthenで登録したコールバックが呼ばれて、見つからなかったらcatchが呼ばれるという感じです。 Promiseについて詳しくはJavaScript Promiseのを見てください /** * Wait until an element that is matched the selector is visible. * @param {string} selector the css selector * @param {number} timeout the timeout is millisecond. default:2000ms * @returns {Promise} */ var waitForElem

    ある要素が表示されるまで待つJSライブラリを書いた(MutationObserver)
  • Frontrend Conference アウトラインメモ

    Frontrend Conference - A conference for front-end developer(2015年2月21日開催) に参加してきたのでメモ 殆どCSS側のセッションにいたのでCSSが中心。 終わったあとに#ゴーヤsushiと#ルノアール_sushiをしたのでとても長かった。 Pragmatic Front-end Developer: From Artisan to Expert - 斉藤 祐也 基調講演 メンテンス性 WEBを構成するJS+CSS+HTMLはあんまりメンテしやすくない けど専門的な知識がなくてもかけてしまう学びやすさがある 言語的にシンプル コードスタイルガイドライン 多くの人が開発しても、一人の人が書いたように見えるようにしたほうがいい JavaScript IDOMATIC.js jQuery Code Style GuideLine

    Frontrend Conference アウトラインメモ
  • Virtual DOMを持つMV*ライブラリのmercuryについて

    最近node-webkitアプリを書く時、何かしらのMV*やデータバインディングライブラリと言われるものを試しているのですが、floating-memo.appではRaynos/mercuryを使いました。 mercury は小さなモジュールを組み合わせたライブラリとも言えますが色々特徴的です。 完全にモジューラーな実装 Virtual DOM FRP ファイルサイズが小さめ モジューラーな実装とは何かというとmercuryのindex.jsを見ると面白い事が書かれています。 /* Pro tip: Don't require `mercury` itself. require and depend on all these modules directly! */ require("mercury") しないで、直接それぞれのモジュールを読み込んで使えるという事が書かれています。 (これ

    Virtual DOMを持つMV*ライブラリのmercuryについて
  • JavaScript Promiseの本を書きました | Web Scratch

    JavaScript Promiseのという無料で読める電子書籍を書きました。 タイトルそのままで、JavaScriptのPromiseについて書いた書籍です。 書籍の目的 この書籍を読むことで学べる事として、次の3つを目標にして書きました。 Promiseについて学び、パターンやテストを扱えるようになる事 Promiseの向き不向きについて学び、何でもPromiseで解決するべきではないと知る事 ECMAScript6 Promiseの基をよく学び、発展した形を自分で形成できるようになる事 Promiseは、次のECMAScriptの言語仕様として策定が進められていて既に多くのブラウザに実装されています。 Promiseについて扱う書籍ですが、この機能はjQuery.Deferred()やAngularJSの$qやBluebird等の類似の機能が既にあるため扱ったことがあるかもしれま

    JavaScript Promiseの本を書きました | Web Scratch
  • npmとbrowserifyを使ったクライアントサイドのウェブアプリ開発

    YoutubeとVimeoの検索結果のRSSをまとめてOPMLで取得できるサイトを作った | Web scratch で公開した Tech Video RSS Searcher はbrowserifyを使って作ったので、その辺の開発フローについての記事です。 browserify って何? browserify はNode.jsスタイルで書かれたモジュール(CommonJS)を ブラウザで利用できるように変換するコマンドラインツール(Nodeモジュール)となっています。 又、node.jsのCore Modulesのshimが用意されていて、 npmで公開されているnode.js向けのモジュールも一緒に変換してブラウザで動かすことが出来るようになっています。(普通に require で読みこめば勝手に変換されます) 原理的に無理だったり全てのモジュールが動くわけじゃないですが、 その辺の互

    npmとbrowserifyを使ったクライアントサイドのウェブアプリ開発
  • 1