タグ

Javascriptに関するlockcoleのブックマーク (280)

  • 2日でできる! JavaScript トレーニング - mixi engineer blog

    こんにちは。SNS mixi の JavaScripter、kuniwak です。 新しい仲間たちが入社する季節になりましたね。 さて、ミクシィを支えるエンジニアが作成した JavaScript 研修の資料を Github にて公開しました。 ミクシィは 2013年から研修資料を公開していましたが、今年は JavaScript の進化に合わせて内容を刷新しています! 2015年度の JavaScript 研修は、Web アプリケーションの部品(モジュール)をつくれるようにすることを目標とした、実践的な研修として計画されました。 JavaScript 研修のために与えられた期間は2日ということもあり、MVC や Flux といった設計方面の話題には踏み込めていませんが、Promise、Fetch API、Bower など、現在・未来のフロントエンド開発に必須の要素を盛り込んだ最新のJavaS

    2日でできる! JavaScript トレーニング - mixi engineer blog
  • エヴァンゲリオンでわかってしまうJavaScript - Qiita

    はじめに 全国1億2000万人のエヴァンゲリオンはわかるけど,JavaScriptはちょっと、、、な皆さんこんにちは。 JavaScriptのプログラミングは、エヴァンゲリオンよりは簡単なのですが、なぜかプログラマにしか浸透しません。 エヴァンゲリオンの諸概念を理解している方であれば、すでにJavaScriptプログラミングは理解していると言っても過言ではありません。 そのあたりをそういうことにして、編にとりあえず行きましょう。 あわせて読みたい 半年で40kg痩せた!ダイエットでわかるリーンなプロジェクトマネジメント手法 1.地球とミックスイン まずは、エヴァンゲリオンの世界における地球をJavaScriptで表現してみたいと思います。 ここで登場するのはもちろんエヴァンゲリオン世界のトリックスター、ナディアと我らをつなぐものこと「第一始祖民族」ですよね。 彼らは隕石に「白き月」と「黒

    エヴァンゲリオンでわかってしまうJavaScript - Qiita
    lockcole
    lockcole 2014/06/11
    Qiita内で唯一の「エヴァンゲリオン」タグがついた記事
  • brook の実装読んでみた - 健康意識の高まり

    brook という、非同期処理をシーケンシャルに記述できる javascript のフレームワークを最近使う機会があったので、どういう実装になってるのかを読んでみた。 (ちなみに iPhonechromegithub 開いてコードを読んだのですが、 iPhonegithub 上のソースを読む時のベスプラとかあるんですかね・・・?) そもそも brook ってなんぞ?は以下を。 tanabe/Advent-calendar-2011 · GitHub brook どこにあるの?は以下を。 https://github.com/hirokidaichi/brook ※brook は、 Namespace という、javascript に名前空間を提供するライブラリに依存しています。 実装読む前にそもそもどう使うのか たとえば、setTimeout で、1秒毎に挨拶文を変更する

    brook の実装読んでみた - 健康意識の高まり
    lockcole
    lockcole 2013/04/12
    brookのコードリーディング
  • SourceMapを使って、効率の良いJavaScript開発生活/mixi Engineers' JS Advent Calendar 2012

    【追記】 「mixiページ」サービス終了に向けてのスケジュールは、2020年8月31日に全てサービス提供終了としていましたが、以下の日程に変更します。 ・2020年9月7日11時頃 モバイル版mixiページ終了 ・2020年9月14日11時頃 PC版、スマートフォン版mixiページ終了 終了時刻は前後する場合がございます。 ダウンロード機能はPC版スマートフォン版mixiページ終了と同時の2020年9月14日11時頃に終了いたしますので、「mixiページ」データのダウンロードをご希望の方は、お早めにダウンロードをお願いします。 以上、どうぞよろしくお願いいたします。 【追記】 終了予定の「mixiページ」とは、SNSmixi全体の中の一部特定サービスの名称でございます。 SNSmixiの全てが終了するわけではございません。2020年8月31日以降も引き続きSNSmixiはご利用いただけます

    lockcole
    lockcole 2012/12/02
    mapファイルの構造解説がわかりやすい
  • Flash?いいえ、HTML5です: ファイルのドラッグ&ドロップによるフォトアップロード機能について - mixi engineer blog

    はじめまして。コミュニケーションサービス開発部の澤と申します。コーヒーカレーをこよなく愛する新卒2年目の新米エンジニアで、弊社Webのフロントエンドを主に担当しています。最近はmixiスマートフォン版(mixi Touch)の開発にも精力的に取り組んでいます。 さて、日はPC版のmixiで1つの機能をリリースいたしました。ファイルをWebブラウザにドラッグ&ドロップするだけで写真をmixiフォトにアップロードできるもので、HTML5 File API※1を採用しています。記事ではこの機能について色々とお話をしたいと思います。 なにこれ? 以下では、ドラッグ&ドロップによるアップロード機能を「機能」と呼びます。 百聞は一見にしかずです。機能のプロモーションムービーがありますので、まずはこちらをご覧ください。 動画では下記を説明しています。 従来のアップロード方法からドラッグ&ドロッ

    Flash?いいえ、HTML5です: ファイルのドラッグ&ドロップによるフォトアップロード機能について - mixi engineer blog
    lockcole
    lockcole 2011/02/24
    「DataTransferオブジェクトのFile API対応を利用して、ドラッグ&ドロップによるアップロード機能を加えました。」
  • Titaniumで簡単にmixi Graph APIを使う方法 - Nobody is perfect.

    mixiGraphAPIって? iPhoneAndroidといった外部環境からOAuth認証をへてmixiの機能を利用することができるようになるものです。 例えばボイスの一覧の取得・投稿、フォトの投稿・閲覧といった機能を利用したアプリケーションを構築できます。 http://developer.mixi.co.jp/connect/mixi_graph_api 個人開発者でも利用可能になったみたい! http://developer.mixi.co.jp/news/news_platform/12028 用意するもの Developer登録とアプリケーションの設定 ConsumerKey ConsumerSecret RedirectURI https://sap.mixi.jp/connect_consumer.pl 利用したいスコープを調べる 利用したい権限を絞る、選択することが出来

    Titaniumで簡単にmixi Graph APIを使う方法 - Nobody is perfect.
    lockcole
    lockcole 2010/12/22
    ためしてみたい
  • 403 アクセス禁止

    申し訳ありません ... コンピュータ ウィルスやスパイウェア アプリケーションの自動リクエストと類似したクエリが送信されました。 ユーザーを保護するため、このリクエストをすぐに処理することはできません。 できるだけ早くアクセスを復旧しますので、しばらくしてからもう一度お試しください。 お使いのコンピュータやネットワークがウィルスの被害にあっていると思われる場合は、ウィルス チェッカーやスパイウェア削除ツールを実行して、システムからウィルスや不正ソフトウェアを駆除してください。 引き続きこのエラーが表示される場合は、GoogleCookie を削除してから、Google に再度アクセスすると問題が解決する場合があります。 ブラウザ固有の手順については、お使いのブラウザのオンライン サポート センターにお問い合わせください。 ネットワーク全体が影響を受けている場合は、Googl

    lockcole
    lockcole 2008/06/07
    GreasemonkeyからGoogle AJAX Libraries APIを利用する方法。google.load()でcallback関数を指定しているところがポイントかな。
  • http://www.xuldev.org/misc/docs/SessionStoreAPI.pdf

    lockcole
    lockcole 2007/09/15
    セッション周りの機能。JSON形式でセッションは保存されている。クラッシュ判定はsession { state:“running” }が再起動時に残っているかを見ている。そしてセッションAPIを用いたセッションマネージャ拡張の作成。
  • JavaScript の配列と連想配列の違い - IT戦記

    id:cheesepie:20070131:1170172709 最近は、こういう風に JavaScript を勉強する人が増えていてとても嬉しいです ^^ id:cheesepie さん頑張ってください! で、ちょっと配列と連想配列の使いかたが違うようなので、エントリーを書こうと思いました。おせっかいだったらすみません>< ! やっぱり、このへんが JavaScript の難しいところのひとつなのだろうか。 ということで、 JavaScript の配列と連想配列の違い いってみよおー 連想配列とは JavaScript では連想配列は一番シンプルなオブジェクトのことである。つまり、すべてのオブジェクトは連想配列である。 以下のすべての連想配列はまったく同じものである。 // 1 var obj = { hoge: 'hoge' }; // 2 var obj = { 'hoge': 'h

    JavaScript の配列と連想配列の違い - IT戦記
    lockcole
    lockcole 2007/09/11
    基本,連想配列。配列はArrayオブジェクトを継承したオブジェクト。配列の走査でfor inを使ってOKなのは連想配列,ダメなのは配列。
  • JavaScriptのreplaceで正規表現による後方参照 : ひろ式めもちょう

    a. ○できる txt.replace( /hoge(.*)huga/, "huga$1hoge"); b. ×できない txt.replace( /hoge(.*)huga/, "huga" + $1 + "hoge"); c. ×できない txt.replace( /hoge(.*)huga/, "huga" + RegExp.$1 + "hoge"); ※いったんmatchさせたあとでないと使えないらしい bができない理由がわからない…_| ̄|O(そんなに難しいことか?) で、代わりにこうする。 d. ○できる txt.replace( /hoge(.*)huga/, function (whole,s1) { return( "huga" + s1 + "hoge"); } ); なげー。だいたいこの、関数の引数決めうちってのがキライなのだが…まぁ、Perlでもsortとかそうだか

    JavaScriptのreplaceで正規表現による後方参照 : ひろ式めもちょう
    lockcole
    lockcole 2007/09/08
    bの txt.replace( /hoge(.*)huga/, "huga" + $1 + "hoge");ができないのは確かに納得がいかない。でも無名関数でくるんでやればできる。なるほど・・・。
  • javascriptlibraries.com - このウェブサイトは販売用です! - javascriptlibraries リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    lockcole
    lockcole 2007/08/09
    Javascriptライブラリのカテゴリ別まとめ。総合,表示系,数学系,Ajax,グラフ系などなど。
  • 超便利!JavaScript用の文字列拡張関数いろいろ:phpspot開発日誌

    Ivan Uzunov Blog Blog Archive Top 10 JavaScript String.prototype Extensions This is the list of mine top 10 JavaScript String.prototype extensions. If you want to you can post yours bellow. 超便利!JavaScript用の文字列拡張関数いろいろ String.prototype でStringクラスを拡張し、次のような機能を実装するための関数が公開されています。 trim - トリミングを行う関数 splitrim - トリミングとsplitを行う関数 escHtml  - HTMLエスケープを行う関数 unescHtml - HTMLアンエスケープを行う関数 urlEncode - URLエンコードを

    lockcole
    lockcole 2007/07/27
    String.prototypeを拡張して便利メソッドを追加してくれるライブラリ。トリミング,URL/Email判定,文字列存在判定処理,など。
  • Part3 JavaScriptに学ぶ「言語の拡張性」:ITpro

    サイボウズ・ラボ株式会社に勤めるWebプログラマ。出身は石川県金沢市。21歳でプログラミングに出会い,IT戦士になることを決意。それからというもの,寝ても覚めてもプログラムを書き続け今に至る。はてなでamachangというidでブログを書いてます。 最近,「とんがった」プログラマの間ではJavaScriptがちょっとしたブームです。あちこちの書店で,JavaScriptの書籍を見かけるようになりました。「はてブのホッテントリ」*1にも,よくJavaScriptの記事が入っています(図1)。 その人気を象徴的に示しているが,Shibuya.js*2という団体が開催しているJavaScript関連のイベント「Technical Talk」です。1回目は2006年4月,2回目は6月に開催されましたが,いずれの回も予約が殺到し,たった1日で席が埋まってしまいました。これには「JavaScript

    Part3 JavaScriptに学ぶ「言語の拡張性」:ITpro
    lockcole
    lockcole 2007/07/23
    amachangによるJavascript解説。プロトタイプベースのオブジェクト指向についての説明と実例に多くの文章を割いていて,図もあって非常にわかりやすい。クラスベースとの違い,人間の感覚に近い,などなど。
  • Collection & Copy - ドキュメントのロード完了に合わせて関数を実行する

    JavaScriptページロード時にプログラムを実行するためにwindow.onloadやbody.onloadがしばしば使われる。しかし、ページ内に大きな画像が存在する場合などは、画像のロードを待つため、実行が遅れてしまう。「ドキュメントのロードが終わっていて、かつ、イメージのロードが完了する前」に関数を実行する方法のリンク2つの要点をコピー。 script要素defer、DOMContentLoadedイベントを利用する方法The window.onload Problem - Solved! Firefoxの場合非公式のイベントハンドラ、DOMContentLoadedを利用する。 // for Mozilla browsersif (document.addEventListener) { document.addEventListener("DOMContentLoaded",

    lockcole
    lockcole 2007/07/18
    script要素のdefer属性,DOMContentLoadedイベントを利用する方法,それからsetIntervalを使う方法。これライブラリに組み込んで欲しいところだけど,難しいかな。体感性能に影響があるのでなんとかしたいところ。
  • Firebug | Drupal.org

    lockcole
    lockcole 2007/07/16
    Firebug LiteをDrupalに組み込むモジュール。ふだんはFirefox&Firebugで開発しているから使わなさそうだけど,IEやOperaで動作確認するときに便利かも。
  • cyano: なぜCSSは先でJavaScriptは後に読み込ませることが推奨されるのか

    lockcole
    lockcole 2007/07/13
    CSSを先に読んでおかないとページがレンダリングされない=体感速度に影響する ということで,JSより先にCSSを記述すべきということ。
  • JavaScriptで複雑なURLをパースできるライブラリ「parseUri」:phpspot開発日誌

    parseUri 1.2: Split URLs in JavaScript I've just updated parseUri. If you haven't seen the older version (the last official release was v0.1), parseUri is a function which splits any well-formed URI into its parts, all of which are optional. JavaScriptで複雑なURLをパースできるライブラリ「parseUri」 「http://usr:pwd@www.test.com:81/dir/dir.2/index.htm?q1=0&&test1&test2=value#top」のようなURLを次のように分解することが出来ます。 複雑なURLもきちんと分

    lockcole
    lockcole 2007/07/13
    URLを要素別に分解してくれるJavascriptのライブラリ。しかし,「複雑なURLもきちんと分解したいような場合に使えそうですね。」ってどんな状況か説明しきれていないところがphpspot開発日誌らしい。
  • 音声認識テキスト入力Javascriptライブラリ w3voiceIM.js

    たった一行追加するだけで、あなたのサイトに音声認識機能を付けられます! w3voiceIM.jsは、Webページの上のテキスト入力フォームに音声認識機能を追加するJavascriptライブラリです。 手軽に音声認識を利用できることが特徴になっています。 また、http://w3voice.jp/でサービスする共有型音声認識エンジンを利用するために、利用者やWeb開発者は、音声認識プログラムのインストールや設定作業を必要としません。 JavaおよびJavascriptが動作するPC及びWebブラウザからの利用をサポートしています。 現在のバージョン 最新のw3voiceIM.jsのバージョンは0.02です。 とりあえず動くようになった開発途上バージョンです。 使い方 音声入力を開始するには、テキストの入力欄をマウスでダブルクリックします。 音声入力パネルが出現したら、「Push here」と

    lockcole
    lockcole 2007/07/12
    音声入力Appletを呼び出し→音声認識でテキスト変換→結果を表示するライブラリ。非常に先々が楽しみな取り組み。
  • new function(){}と(function(){})()の違い - nothing but trouble

    (function(){})() の代わりに - IT戦記関連 カップリングとか言われたのでのっかりコネタ。 (function(){ this; // object global })() new function() { this; // object object } (function(){})() thisがglobal(ブラウザだったらwindowオブジェクト) returnしたものを返す。 new function(){} thisが自分自身(実行しているのがコンストラクタだから) thisを返す。 他になんかあったっけ?とりあえず両者を区別しなくても困るケースは思いつかない。

    new function(){}と(function(){})()の違い - nothing but trouble
    lockcole
    lockcole 2007/07/06
    thisが挿すオブジェクトの違い。
  • MOONGIFT: » ソースコードをもっと見やすく「SHJS」:オープンソースを毎日紹介

    元々テキストエディタやIDEで開発している際にはソースコードはハイライト表示されている。何も色分けされていない状態に比べて、その方が見やすいのは誰もが知っているところだろう。 ではサイトにコードを掲載する場合はどうか。手作業で色分けなどとてもできないだろう。ツールを使ってやるのが一番だ。 今回紹介するオープンソース・ソフトウェアはSHJS、JavaScriptによるソースコードハイライタだ。 SHJSが対応するプログラム言語は20種類以上。C/C++/C#/CSS/HTML/Java/JavaScript/Perl/PHP/Python/Ruby/SQL/XML等の基的なものに加え、ChangeLog/Flex/LaTeX/Log files/M4/Makefiles/Shell等にも対応する。 各言語別にJavaScriptファイルが分かれており、必要なものだけ読み込む事でそれ程重くな

    MOONGIFT: » ソースコードをもっと見やすく「SHJS」:オープンソースを毎日紹介
    lockcole
    lockcole 2007/07/06
    20種類以上の言語に対応するJavascriptのソースコード色分けライブラリ。pre要素のclass指定で言語を決め打ちしちゃうので,不要なスクリプトは読み込まず。逆に言えば,必ずclass指定しなきゃいけないところがネックか。