タグ

JavaScriptに関するmaraigueのブックマーク (25)

  • JavaScriptは如何にしてAsync/Awaitを獲得したのか: がおさんち 技術部屋

    JavaScriptを記述する上で、避けて通れないのが非同期処理。 人類は、長い年月、この非同期的な処理を「如何にして書きやすく、読みやすく記述するか」について探求してきました。 要するに†闇†の塊なのですね。(闇に飲まれよ!!!!) この物語は、そんな†闇†の存在だった非同期処理を、人類がどのように苦しみ、そしてどのように解決していったかを書いていくポエムである。 補足:厳密には、JSはシングルスレッドで動くため、非同期処理は存在しない!と言ってしまえばそこまでなのですが、今回はsetTimeoutやajax通信、onloadイベント登録など、見かけ上、非同期的な挙動を示すものすべてを対象に話していきます。 第一章 ~人類はsetTimeoutを採用しました~ 古代のJavaScriptで、以下のような処理をしたい場合、どうしていただろうか。 「ブラウザ更新直後に『a』を表示し、その2秒

  • Javascriptを使うのをやめろ:Railsの時代遅れ云々についての結論 - Qiita

    結論: Javascriptの乱用をやめるのが一番。 はじめに書いておきますがしょうもない話です。 結論、開発者としてはどのような方向性でやるべきか、を書いています。 JS多い時代でのフレームワークの根的な問題云々のことは書いてません。 さて、現状、モバイルにおいて、Javascriptでまともに動くものを作ることは難しいです。 Twitterから引き抜いた超優秀なWebエンジニアを多数抱えるMediumですら、未だにモバイルで多数のバグを抱えています。 超優秀なエンジニアを世界一抱えているであろうGoogleのGmailですら、モバイル版のWebはすぐクラッシュします。また、自前スクロールに致命的なバグも抱えています。 正確には「UIが不審な挙動をする」ですが、エンドユーザにとっては同じことで、「バグ」です。 サーバサイドで起こるバグと同じ程度、いやそれ以上に、サービスに影響を与えます

    Javascriptを使うのをやめろ:Railsの時代遅れ云々についての結論 - Qiita
    maraigue
    maraigue 2014/09/24
    "ほとんどのJS Heavyなサイトは、JSで実現される「操作感」よりも、JSのバグが産み出すユーザ離脱や、JSで産み出されるUI遅延のほうが大きいのが現実です"
  • 集え変態プログラマ!JavaScriptの最短コードに挑んだコードゴルフ大会 in Code 2013 | DX.univ

    8月3日〜4日に開催されたプログラマのためのお祭り的イベント集え変態プログラマ!JavaScriptの最短コードに挑んだコードゴルフ大会 in Code 2013 by Yoshiaki Sato in Tech — 2013/08/06 フロントエンド担当のヨシアキです。 8月3日〜4日に開催された"Code 2013"に参加してJavaScriptのコードゴルフの問題を出題してきましたので、そのレポートを兼ねて、JavaScriptのショートコーディングについて語ってみようと思います。 Codeとは プラットフォーム・言語・コミュニティの壁を超えてプログラマが達が集う、プログラマのためのお祭り的イベントです。 開催地はこれまでのところ、温泉郷で有名な札幌の定山渓で開催されています。 そのため、ゆったりと温泉に浸かりながらプログラミングについて語り、美味しいお料理とお酒に舌鼓を打ちなが

  • GitHubのようなtextareaの補完機能を実装する - カーソル位置の取得 - Qiita

    続編 JavaScript - Qiitaのtextarea自動補完がOSSになりました GitHubのコメントでは@と入力するとカーソルの下に入力補完が出現する。さらっとやっているが、実はこれが結構難しい。なぜ難しいのかというと、JavaScriptではカーソルが何文字目にいるかは分かるが、 カーソルのXY座標を取得するAPIが存在しない からだ。カーソル位置が分からなければ、適切な位置に補完候補を表示することができない。では一体どうすればいいのか? 今回Qiitaではコメント欄でのメンションの補完機能を実装した。稿では前述の問題を解決するために用いたテクニックを解説する。 ちなみにこのメンション補完機能はチーム用プライベートQiitaである「Qiita:Team」でも勿論使える。現在絶賛無料トライアル実施中なので、興味を持たれた方はそちらも使ってみて欲しい。 要約 textarea内

    GitHubのようなtextareaの補完機能を実装する - カーソル位置の取得 - Qiita
    maraigue
    maraigue 2013/04/17
    "GitHubのコメントでは@と入力するとカーソルの下に入力補完が出現する(中略)なぜ難しいのかというと、JavaScriptではカーソルが何文字目にいるかは分かるが、 カーソルのXY座標を取得するAPIが存在しないからだ"
  • JavaScript Quiz

    var x = {}; console.log(x + 0 == x - 0) var x = []; console.log(x + 0 == x - 0) var x = (function(){}); console.log(x + 0 == x - 0) var x = null; console.log(x + 0 == x - 0) var x = undefined; console.log(x + 0 == x - 0) var x = Infinity; console.log(x + 0 == x - 0) var x = Array; console.log(x + 0 == x - 0) var x = 0; console.log(x + 0 == x - 0) var x = false; console.log(x + 0 == x - 0) var x =

    maraigue
    maraigue 2013/04/02
    xに{}とか[]とか(function(){})とかを代入して x + 0 == x - 0 を調べるとどうなるか、って問題。法則性がわかりにくすぎる…。
  • Ruby脳が理解するJavaScriptのオブジェクト指向

    (追記:2012-12-15) 記事およびこれに続くその2,その3をまとめて電子書籍化しました。「Gumroad」を通して100円にて販売しています。内容についての追加・変更はありませんが、誤記の修正およびメディア向けの調整を行っています。 電子書籍Ruby脳が理解するJavaScriptのオブジェクト指向」EPUB版 このリンクはGumroadにおける商品購入リンクになっています。クリックすると、オーバーレイ・ウインドウが立ち上がって、この場でクレジットカード決済による購入が可能です。購入にはクレジット情報およびメールアドレスの入力が必要になります。購入すると、入力したメールアドレスにコンテンツのDLリンクが送られてきます。 購入ご検討のほどよろしくお願いしますm(__)m 関連記事: 電子書籍Ruby脳が理解するJavaScriptのオブジェクト指向」EPUB版をGumroadか

  • JavaScriptでSLを走らせる「SL.JS」を作りました | Creazy!

    開発に関わっていて、UNIX(Linux)を触った事のある人は「SLコマンド」をご存知の方が多いのではないでしょうか? lsを間違えてslと打つとこんなのが煙を吹きながら走る sl(1) コマンドを作りました. via: 豊田正史とslコマンド (Masashi Toyoda and SL command) ファイル一覧を出力する「ls」をtypoして「sl」と打ってしまうと、文字通りSLが画面を走り抜けるというすばらしくくだらない仕組みなのだ。いわゆる、ジョークコマンドの一つとしてとても有名で、多くの開発者の気持ちを和らげた(腰を砕いた)ことでしょう。 さて、そんなくだらないジョークコマンドを懐かしんでいると、JavaScriptでSLを動かしてみたくなってしまったので作ってみました。 ・SL.JS ブックマークレット方式にしてあるので、上のSL.JSリンクをブックマークして下さい。 ど

    JavaScriptでSLを走らせる「SL.JS」を作りました | Creazy!
  • (」・ω・)」うー!(/・ω・)/にゃー!encode

    JavaScriptのコードを(」・ω・)」うー!(/・ω・)/にゃー!します。 変換後のコードはJavaScriptとして実行可能です。 元ネタは「這いよれ!ニャル子さん」と「aaencode」です。 解説:(」・ω・)」うー!(/・ω・)/にゃー!encode - kusano_kの日記 (」・ω・)」うー!(/・ω・)/にゃー!ises arbitrary JavaScript codes. The translated code can be executed as a JavaScript code. This tool has been inspired by 這いよれ!ニャル子さん and aaencode.

    maraigue
    maraigue 2012/05/28
    ※生成されたコードは「(」・ω・)」うー!(/・ω・)/にゃー!」だらけですが、ちゃんと動くJavaScriptのコードです
  • jsとカプセル化の談義

    Kenichiro Ota @oota_ken @t_wada 先生!TAの指標としてお聞きしたいのですが、JavaScriptでクラスを作る方法はカプセル化の観点からはクロージャーベースがよいのでしょうか?それともプロトタイプベース? 2012-05-24 15:11:23

    jsとカプセル化の談義
    maraigue
    maraigue 2012/05/24
    読み解くのに時間がかかったが納得した。この例だとpersonに与えた引数(name)は、返り値のオブジェクトの中からのみ操作できて、その外部からは操作出来ないわけね
  • いやなブログ: 配列操作の比較表: Ruby, Python, JavaScript, Perl, C++

    配列操作の比較表: Ruby, Python, JavaScript, Perl, C++ プログラムを書いていると、他のプログラミング言語の記憶とごっちゃになって、「配列の後ろに要素を追加するのは push だっけ、 append だっけ」などと混乱することがあります。特に Ruby, Python, JavaScript はコードの書き方が似ているので、この問題が起きがちです。 そこで、備忘録として、 Ruby, Python, JavaScript, Perl, C++ の配列操作の比較表を作りました。一番慣れている Ruby を基準にしています。間違いなどがあったらご指摘いただけると助かります。他の言語のもあるといいなあ。 Ruby (Array) Python (list) JavaScript (Array) Perl (@) C++ (std::vector)

  • JavaScriptの匿名関数やC# 2.0の匿名メソッドがやたら便利な理由は何か? 【▲→川俣晶の縁側→ソフトウェア→技術雑記】

    メソッドを変数や引数に入れる……というテクニックは、別に珍しいものではありません。 アセンブラの時代には、ジャンプ先、コール先のアドレスを受け渡すのは珍しいことではないし、Cの関数ポインタも要するに同じことです。C# 1.xのdelegateも同じですね。 しかし、それらは特別な場合にのみ使うものであって、それを多用したプログラミングは必ずしも楽ではありません。いろいろ面倒も抱え込むわけですね。 それにも関わらず、JavaScriptの匿名関数やC# 2.0の匿名メソッドが湯水のごとく使いまくれるほど便利な理由は何か……。 実際にコーディングして体感した理由はほとんど1つに絞られます。 それは、「名前がない」ことではなく、「処理に必要なデータの受け渡しの面倒がない」ことです。 たとえば、C# 1.xで書いているとき、delegate経由でメソッドAからメソッドBを呼び出す際、メソッドAが持

    maraigue
    maraigue 2011/12/25
    つまりは無名関数がクロージャであるかどうか、ってことね。でも「名前がない」ことも意義こそ違えど同等に便利だと思う。
  • wise9 › JavaとJavaScriptの20年戦争

    モバイルゲーム 物凄い勢いで勃興したモバイルゲーム業界は、いろいろな課題や問題に直面しながらも巨大化し、今日の時点でのスマートフォン向けゲームの市場へと継承されていきます。 モバイルゲーム歴史 2001 Javaアプリと3Dゲームの登場 Javaが利用できるようになったことにより、ダウンロード型のゲームが供給できるようになりました。 2002 携帯電話端末の大容量化・3D化競争 Java搭載携帯電話端末が登場してからごく僅か1年の間に、アプリのサイズに関しては10倍に広大化し、表現方法も2Dから3Dにシフトし始めました。J-PHONEは『ゼビウス』や『スペースハリアー』などといった昔のアーケードゲームを、ドコモはSIMCITYなどパソコンで世界的規模のヒットを飛ばしたゲームを主力商品としていました。 2003 モバイルゲームの一般化 メモリの制限が厳しいJava仮想マシン上ではなく、OS

  • Hatena::Let

    81973 Bookmarklets! Create Hatena::Let でブックマークレットをかんたんに作成・公開しよう! https://tech.classi.jp/entry/2024/04/23/183000 document.addEventListener('keydown',(function(event){if(event.key==='Enter'&&event.isComposing){e...

    maraigue
    maraigue 2011/10/27
    ブックマークレットをWeb上に公開できるサービス。これは俺得
  • 知ってて当然?初級者のためのJavaScriptで使う即時関数(function(){...})()の全て

    (function(){...})()は、 (function($){ $.hoge = function() { }; })(jQuery) みたいに使われていたりするコード。GreasemonkeyとかjQueryのプラグインとか、あれこれ見かけることがあると思います。 この話題はいくつかWebでも取り上げられていますが何がどうなってんのかちょっと難しいですね。しかし、誰でも理解できるレベルではあります。というのも、こういう種の難しさは体系的な知識が備わっているか否かということなのです。 でも、この知識を体系化する作業って結構しんどくて、難しくて、まーハゲるほど悩むこともあるかもしれない。それはきっと、とても毛根に悪いかもしれない。スカルプDも真っ青の状況になるかもしれない。それは、悲しいことなのだと思う・・・っ! 毛根にはこれからもがんばってほしい!いつだって頭を温かいまなざしで見守

  • 私はいかにしてソフトバンク端末60機種のJavaScriptを検証したか - ockeghem's blog

    昨日のソフトバンクの非公式JavaScript対応の調査結果 | 徳丸浩の日記で報告したように、昨年5月に、ソフトバンク60機種の検証を行い、JavaScript対応の状況などを調査しました。当時はまだ公式なJavaScript対応機種はない状態でしたが、既にほとんどの端末が *非公式に* JavaScriptに対応していました。 このエントリでは、検証の様子を報告します。 なぜJavaScript対応状況を調査したか http://www.hash-c.co.jp/info/20091124.htmlを公表した前後に、とある方(この方)から、ソフトバンクのケータイでもJavaScriptが動作すると伺いました(参考のやりとり)。XMLHttpRequestも含めてJavaScrptが動くと教えていただいた932SHを私も購入して調べたところ、以下が判明しました。 確かにJavaScrip

    私はいかにしてソフトバンク端末60機種のJavaScriptを検証したか - ockeghem's blog
  • JavaScriptのnewって本当にいらない子? - あと味

    先日、「JavaScriptのオブジェクトについて考察してみた - あと味」を書いてから、chikuraさんからコメントいただいたり、id:dankogaiさんから「404 Blog Not Found:javascript - にはクラスはない」という記事で言及いただいたり、JavaScript: The Good Partsを読み返したりした結果、newについて調べたいという衝動にかられましたので、その調べた結果を書いてみたいと思います。 newを調べようと思ったキッカケを整理 まずは、そのキッカケから整理します。 chikuraさんのコメントより 押さえるべきポイントは、new演算子の際に何が行われるか?だと思うので、こちらのページもぜひ読んでみてください。 JavaScript の new 演算子の意味: Days on the Moon http://nanto.asablo.j

    JavaScriptのnewって本当にいらない子? - あと味
    maraigue
    maraigue 2011/06/16
    JavaScriptのnewは、newという記法を使わなくても実現できる機能であるという解説。こんな挙動になってたのね
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
    maraigue
    maraigue 2011/05/31
    一時Rubyでコードゴルフに挑戦してたけど、JavaScriptのコードゴルフも同じくらいに変態だな…w
  • 記号だけのJavaScriptプログラミングの基本原理 - Articles Advent Calendar 2010 Sym

    こんにちは。プログラマ定年を迎えたのであとは悠々自適に日々過ごそうと思ってるはせがわです。 JavaScriptで記号プログラミングを行う基的な取り組を説明します。 jjencodeなどで使っているテクニックです。 まず最初は数字の作り方。 +[] // 空の配列にプラス演算子で数値の 0 ~[] // 空の配列にビット反転で -1 ~{} // 空のオブジェクトにビット反転で -1 -~[] // 空の配列にビット反転で-1、-1に単項マイナスで +1 -~-~[] // +1 にビット反転で -2、-2 に単項マイナスで +2 このように、空の配列や空のオブジェクトに数値用の演算子を適用することで、任意の数値を記号だけで生成することができます。 次に文字の作り方。 ![] // 空の配列に論理否定で false !![] // 空の配列に論理否定を2回で true (![]+"")

    記号だけのJavaScriptプログラミングの基本原理 - Articles Advent Calendar 2010 Sym
    maraigue
    maraigue 2010/12/12
    Perlは有名だけど、JavaScriptでも出来るのか…
  • TwitterのIDが64bitになるとJavaScript等で問題が出るので対策を - F.Ko-Jiの「一秒後は未来」

    Twitterのシステムが生成する ID の体系が変わるという情報は以前からありました。 » Twitterのstatus IDの仕組みが変わる – 頭ん中 » The Twitter Engineering Blog: Announcing Snowflake » Status IDs are changing on 21st September – Twitter Development Talk | Google グループ Snowflakeというシステムを使って、ツイートやユーザーの ID が64bitの整数で生成されるようになるそう。 特に影響はないかなと思っていたのですが、ProgrammableWebの「The Twitter ID Shuffle: Text vs Numbers」という記事に気になることが。 The reason for aborting the laun

    TwitterのIDが64bitになるとJavaScript等で問題が出るので対策を - F.Ko-Jiの「一秒後は未来」
    maraigue
    maraigue 2010/10/21
    今まではID比較のために if(id1>id2){ ... } と書いてればよかったものが、例えば if(id1_str.length>id2_str.length || (id1_str.length == id2_str.length && id1 > id2)){ ... } と書かないとならなくなるわけか
  • JavaScriptのwithをRubyでも使いたい夢をあきらめないで。 - このブログは証明できない。

    JavaScriptには、withという構文があります。あまり使われていないようです。むしろ、使わないことが推奨されているようです。ですから、知らない人もいるかもしれません。withを知っているかどうかが、JavaScriptのwithを知っているかどうかの分かれ目ですね。私はwithを知っていますが、使ったことはありません。 それでは、JavaScriptのwithの使い方を見てみましょう。まずは、withを使わない場合。 console.log(Math.cos(1/2)); //=> 0.8775825618903728 console.log(Math.sqrt(2)); //=> 1.4142135623730951 普通ですね。次に、withを使う場合。 with(Math) { console.log(cos(1/2)); //=> 0.8775825618903728 co

    maraigue
    maraigue 2010/05/22
    JavaScriptのwith構文はRubyのinstance_evalで再現可能