TypeScript 2.8.1 変更点 - Qiita
こんにちはソウゾウ社な@vvakameです。 TypeScript 2.8.1がアナウンスされました。 What's new in TypeScriptも更新されているようです。 破壊的変更もあるよ！ 今回からこの辺に僕が試した時のコードを投げておくことにしました。 変更点まとめ Conditional types（条件付きの型） Conditional types T extends U ? X : Y みたいなの書ける Conditional typesでの型推論 Type inference in conditional types infer の導入 ある型に式を当てはめた結果、得られた型推論の型を新たな型パラメタとして利用可能 type ReturnType<T> = T extends (...args: any[]) => infer R ? R : T; こういう R が新
flex-grow: 1な感じで作った不定の要素の高さを知る子要素を作りたい - Qiita
なやみ 下みたいなflex-grow: 1で作った子要素を、親要素と同じ高さにしたい つらい 試しに子要素を height: 100% にしてみると、まぁそりゃ子要素見ちゃうよね じゃあ親要素を100%にすればいいじゃん、としても、その親の高さを見ちゃうのでflex-grow台無し。そんなに人生甘くない ここで子要素100%にしても残当な結果 ひらめき The box’s position (and possibly size) is specified with the top, right, bottom, and left properties. These properties specify offsets with respect to the box’s containing block position: relative / absolute の関係にすれば、子absol
[コラム] 正規表現の先読み/後読みは、どう考えても名前が悪いので、呼称禁止令を出してルックと気軽に呼んでみませんか。 - Qiita
[コラム] 正規表現の先読み/後読みは、どう考えても名前が悪いので、呼称禁止令を出してルックと気軽に呼んでみませんか。regex 正規表現の "先読み" / "後読み" を、分かりにくいと感じるすべての人にお送りします。 --- 追記：2017/06/04 コメントにて、ご指摘を頂いております。 当記事の解釈には誤りがあります。コメントのご指摘内容をご覧いただければ幸いです。 当記事の主旨としては、"先読み・後読み" よりも "ルックアヘッド" の方が、意味を捉えやすいのでは？というものでしたが.. そもそも私の、「lookahead」の解釈（とくに、look の主語はどれなのかという部分だと思います）に、勘違いがありました。 ですので、いまのところ当記事の主題は、「"先読み" でも、"ルックアヘッド” でも、どちらでもよいけど、しっかりと厳密に理解しよう！（反省）」となります。 コメント
![[コラム] 正規表現の先読み/後読みは、どう考えても名前が悪いので、呼称禁止令を出してルックと気軽に呼んでみませんか。 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/410c3d412478ee539641a77fe623cca950f16bac/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JTVCJUUzJTgyJUIzJUUzJTgzJUE5JUUzJTgzJUEwJTVEJTIwJUU2JUFEJUEzJUU4JUE2JThGJUU4JUExJUE4JUU3JThGJUJFJUUzJTgxJUFFJUU1JTg1JTg4JUU4JUFBJUFEJUUzJTgxJUJGJTJGJUU1JUJFJThDJUU4JUFBJUFEJUUzJTgxJUJGJUUzJTgxJUFGJUUzJTgwJTgxJUUzJTgxJUE5JUUzJTgxJTg2JUU4JTgwJTgzJUUzJTgxJTg4JUUzJTgxJUE2JUUzJTgyJTgyJUU1JTkwJThEJUU1JTg5JThEJUUzJTgxJThDJUU2JTgyJUFBJUUzJTgxJTg0JUUzJTgxJUFFJUUzJTgxJUE3JUUzJTgwJTgxJUU1JTkxJUJDJUU3JUE3JUIwJUU3JUE2JTgxJUU2JUFEJUEyJUU0JUJCJUE0JUUzJTgyJTkyJUU1JTg3JUJBJUUzJTgxJTk3JUUzJTgxJUE2JUUzJTgzJUFCJUUzJTgzJTgzJUUzJTgyJUFGJUUzJTgxJUE4JUU2JUIwJTk3JUU4JUJCJUJEJUUzJTgxJUFCJUU1JTkxJUJDJUUzJTgyJTkzJUUyJTgwJUE2JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wZjgzMzEwZTk1Y2Y3MWVlMjRmMjVkZTU1YTc0N2QyZg%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwbW9jaGl6dWtpa290YXJvJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz02MDJlZDc5NzE4MWM3ZDQ0YmIxOTMyMzFiMGU2MzVkOA%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D85b983ba91ea6ab5e6094c57c4ca6b3c)
Firefoxだけborder-radiusがなぜか効かないcssコード - Qiita
border-radiusとは block要素の角を丸くするcssです。 指定した長さを半径として、ブロックの四隅が丸くなります。 また、十分大きな長さを指定すると、block要素を円形に切り取ることができます。 参考：https://developer.mozilla.org/ja/docs/Web/CSS/border-radius 発生した現象 以下のコードで、div要素を丸く切り取って表示しようとしました。 <style type="text/css"> div { width: 100px; height: 100px; background-color: red; border-radius: 1000000000px; } </style> <div/> このコードはMac Chrome, Mac Safari,iOS Safari, iOS Chrome, Android
結合文字列を合成する安全な方法を考える - Qiita
結合文字列をUnicode正規化で合成する方法の危険性 では、結合文字列を解消する方法としてNFCを適用することの危険性を説明しました。それではどうしたらいいのかをここで考えてみます。 考察 結合文字列を解消する現実的な方法は「Composition Exclusionを処理対象から除いてNFCを適用する」だと思います。そこでComposition Exclusionを正規表現にしてみたのがこちら。 これをもとにしてhappyscriptさんが書いてくれたPerlのスクリプトがこちら。 #!/usr/bin/perl use strict; use Unicode::Normalize; use utf8; #-ソースがUTF8だという宣言 use Encode; binmode STDOUT, ":utf8"; #-画面に出力したい文字コード binmode STDERR, ":utf8
「１から100まで出力する」のJavaScriptのPromise使った例 - mizchi's blog
追記：冷静になるとこの記事なんか変なので、あとで修正します。参照しないように。 forやめろ -- LL Diver 2014 LT枠 forを使わないループ、簡単な例はみんな思いつくからいいとして、一番ややこしいやつ考えてたんだけど、やっぱり無駄にPromise酷使する例だと思った。 追記：この例はちょっとミスってた。正しいコードを末尾に載せる CoffeeScript # Serialized Sync Promise [1..100] .map (i) -> new Promise (d) -> console.log i; d() .reduce ((l, p) -> l.then p), Promise.resolve() JavaScript (function() { _results = []; for (_i = 1; _i <= 100; _i++){ _results
はてなのAPIをつかってみた / Rails4とWSSE認証
API使ってどうのこうのという分野に経験が浅いので、頑張ってみた。慣れるといろんなことできて楽しい。HTTPリクエストの投げ方とか、勉強になりました。今回ははてなブックマークでやってみました。 はてなで指定されたURIに、指定されたフォーマットでリクエストを投げる。 ていうと簡単だけど、指定されている状態をどうつくるのか悩んだ。。 認証にはOAuthとWSSEがあって、WSSEは非推奨でセキュリティもよろしくないという話だけど、シンプルなのでWSSE認証ででやりました。 基本はここに載っている。 はてなブックマークAtomAPI WSSE認証についてはここにありますが、 下のようなものをヘッダにつけろということです。 X-WSSE: UsernameToken Username="hatena", PasswordDigest="ZCNaK2jrXr4+zsCaYK/YLUxImZU=",
ブラウザの空間ナビゲーション - saneyuki_s log
この記事はWeb Accessibility Advent Calendar 2013のゲリラ投稿です。何か書いてみようかなーと色々思案し、ネタを思いついたところで投稿しようとしてアドベントカレンダーのページを開いたら全部枠が埋まっていたので何日目とか関係なく仕方なくゲリラ投稿します。 さて、Web Accessibilityということで非常に悩んだ物の、ブラウザエンジニアもどきを自称する私としては、本稿ではブラウザの空間ナビゲーションについて語ろうと思っています。 What is 空間ナビゲーション? キーボードを用いてページ中のフォーカスを移動する機能です。それだったらタブキーで出来るじゃねーかと思う方も沢山いらっしゃるかもしれませんが、矢印キーでフォーカスを移動できる機能です。 空間ナビゲーション - Opera Wikiの記述を引用してみましょう。 空間ナビゲーションとは、レンダリ
自作オブジェクトのイベントのやりとりにはjQuery.triggerではなくjQuery.triggerHandlerを使うほうがよいと思った - hitode909の日記
DOMオブジェクトには昔からdispatchEventとか，addEventListenerとかあって，最近だと，node.jsのEventEmitterとか，jQueryのon, triggerを使って自作のオブジェクト間でアプリケーション的に定義されたイベントをやりとりできる． これまで，自作オブジェクトからイベントを発行するのに，jQueryのtriggerを使ってたけど，意図しない挙動をすることがあることが分かって，triggerHandlerを使うように変えた． jQuery.trigger()は，イベントタイプと一致する関数をレシーバが持ってるとき，その関数が呼ばれる． イベントのやりとりと，メソッドの呼び出しは独立しているというイメージがあったので，うっかり同名のメソッドを定義したときに，一見するとよく分からない挙動になって，難しい． なので，自作オブジェクトがイベントを発行
これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ
スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewport を指定せずに、単純な HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んな素材がごった煮になった様子をお椀で表現しています。 湯気が<strong>「てっく」</strong>に見えるのが隠し味になっていま
ハナの本棚 - HPO機密日誌
「おおかみこどもの雨と雪」二回目鑑賞達成。 おおかみこどもの雨と雪 (角川文庫) 作者: 細田守出版社/メーカー: 角川書店(角川グループパブリッシング)発売日: 2012/06/22メディア: 文庫 クリック: 359回この商品を含むブログ (83件) を見る 今回はできるだけハナの本棚を目に焼き付けようとした。 草野心平詩集 (岩波文庫) 作者: 草野心平,入沢康夫出版社/メーカー: 岩波書店発売日: 2003/04/16メディア: 文庫 クリック: 13回この商品を含むブログ (21件) を見る ロング・グッドバイ 作者: レイモンド・チャンドラー,村上春樹出版社/メーカー: 早川書房発売日: 2007/03/08メディア: 単行本購入: 5人 クリック: 100回この商品を含むブログ (283件) を見る ヘッセ詩集 (新潮文庫) 作者: ヘッセ,高橋健二出版社/メーカー: 新潮社
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
Latest topics > CSS3のborder-imageを先行実装した-moz-border-imageの仕様変更とその対策 - outsider reflex
「Metal」の場合、右の辺だけ5ピクセル幅でそれ以外の辺は10ピクセル幅という事にしていた。しかし、単にこう書くと、「タブの内容」の周囲に「10ピクセル幅の枠線」が付くことになるので、タブの高さが上下合わせて20ピクセル広がってしまう。なので、「タブの内容」の方に という感じでネガティブマージンとそれを相殺するパディングを指定して、枠線とタブの内容を重ねることでタブの大きさをそれほど大きく変えないようにしていた。 それが、Nightlyではこんな事になってしまってた。 新しいborder-imageの仕様に合わせて実装が変わったということなのか、「タブの内容の周囲に10ピクセル幅の枠線が付」いても、その分ボックスの大きさが広がるという事が無くなったようだ。にもかかわらずネガティブマージンを適用していたがために、今度は逆にタブの高さが上下合計で20ピクセルも小さくなってしまって、このスクリ
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
jQuery.Deferredの問題点 - taiyoh独言
（updated 2011-07-11: この記事はjQuery1.5当時のものです。jQuery1.6以上であればpipeメソッドが存在するので、このエントリで懸念している部分については解決します。id:nanto_viさまのコメントも参照のこと） 最近、僕の観測範囲ではjQuery1.5からサポートされたDeferred Objectが話題になってますね。 ここで書いていたことをちょっと解説。 リリース時、遂にjQeuryでも遅延処理のサポートが！と僕もちょっと喜んだのですが、それもつかの間、以下の動作を見ていただきたいな、と。 → http://jsdo.it/ttaiyoh/evYG 普通、とくにjsDeferred使っていた人間なら、以下のような動作を期待しますよね？ → http://jsdo.it/ttaiyoh/zI5H Deferred Objectのソースみてもらえると
2011-04-23 [翻訳者の疑問]文字間スペースの調整は誰の仕事か？ - IT翻訳者の疑問
新しいクライアントの仕事をすることになって、各種指示書に目を通していて、「全角文字と半角文字の間にはスペースを入れる」などと書かれているのを見るとため息が出てしまいます。文字間にスペースを入れるという規則には、いろいろな例外がくっついてくるからです。句読点の前後が半角でも入れないとか。やってるうちに慣れますが、いくらか余計な時間をとられます。こういう規則を作る側の人と直接話したことはないのですが、いったいどういう理由で、ある企業はスペースを入れ、別の企業はスペースを入れていないのでしょうか。「ITだから」ということではありませんよね。 http://www-01.ibm.com/support/docview.wss?uid=pub3gc88807903からダウンロードできるIBMの翻訳ガイド（2006年発行）には、 翻訳文では日本語と英語が混在した文章になりますが、このスペースが入ってい
![2011-04-23 [翻訳者の疑問]文字間スペースの調整は誰の仕事か？ - IT翻訳者の疑問](https://cdn-ak-scissors.b.st-hatena.com/image/square/9c2363b7ab4c125b9d25d473c1a91b69f363f2a9/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F8599973812282739454%2F8599973812282746291%2F1500996563)
IEでのa要素の各属性について - monjudoh’s diary
色々あってa要素でURLをパースするというコードを書いていて色々はまったのでまとめます。 IE6-8でのa.hrefの上限 IE6,7:4096bytes IE8:4121bytes でした。 なお、Firefox,Google Chrome,Safariは1MBとか普通に扱えます。 使わないけど。 http://jsdo.it/monjudoh/8Fm6/read 各属性の取得状況 a.hrefにURLを代入して各属性がどうなるか調べてみました。 URLの長さが短い⇔上限超え outerHTMLハックを使わない⇔使う a.hrefにURLを代入後、別の要素のinnerHTMLにa.outerHTMLを代入し、そのfirstChild(a要素)の各属性を見ること の二軸を変えて調べてみました。 http://jsdo.it/monjudoh/sc82 IE6 a.hrefへの代入で更新され
【寄付ハック】 3000円を慈善団体に寄付したら、新型iPadプレゼント
「3000円以上どっかの慈善団体に寄付した人から、抽選で1名に、新型iPadプレゼントしようと思います。」 現在募金額40万円突破。ありがとうございます。 清水さんの寄付に関するエントリへの、自分なりの解答です。 ルール ・「1/15 〜2/15の期間に3000円以上を慈善団体に寄付し、連絡先をコメント欄に書き込んだ人」から、抽選で1名に次に発売される新型iPadをプレゼント（アメリカ行ってでも入手します）。 細かい規定は末尾にあるので、各自で確認。 質問等は僕のTwitter@fladdictへ。 オンラインで簡単に寄付できる例 ・国境なき医師団 ・マクドナルド・ハウス・チャリティー ・ユニセフ（日本支部無視して直接） ・パキスタンの洪水 ・中国Qinghai の大地震 ・チリの大地震 ・ハイチの大地震 Tweet なんでこんなアホなことを？ しない善よりする偽善。売名だろうが下品だろう
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
リストと配列(Array)はPerlでは別物
All URLs regardless of their length are now automatically wrapped with t.co | Twitter Developers