Arrayのconcatメソッドが何気に便利だった - あと味
え、今さら？感満載ですけど。 配列を結合するメソッドという頭でいましたが、要素を追加して、ついでに要素追加反映後の配列コピーを返すメソッドと考えると結構便利な気がします。 Arrayオブジェクトのメソッドは、sortとかreverseとかmapとかfilterとかのように、配列を返すメソッドが多く、メソッドチェーンでつなげて配列を処理していくのが結構快適だったんですけど、pushは配列を返してくれないので、pushした後の配列に何か処理を施す際には、メソッドチェーンで処理をつなげていくことはできません。 concatはその代わりに使えます。 サンプルコード メソッドチェーンの例ではないけど、multiply_str関数のreturnの箇所では、pushを使うと1文余計に必要ですが、concatを使うとreturnの箇所が1文で書けます。 あと、配列をconcatで追加したい場合は、[1,2
配列内包表記 - あと味
最近、エキスパートPythonプログラミングをぼちぼち読み進めてます。自分には難しい内容で読み応えがあります。 Pythonのリスト内包表記っていうのがありますが、これコードを簡潔にしようと思うと、割と自然に使い始める代物で、Firefox限定でPythonからJavaScriptに輸入されてたりします。 配列から配列を作る時なんかに非常に便利で、Coolな記法です。これ標準になるとうれしいなー。 配列内包表記の使い方 例えば、配列の中の数値を10倍にした配列が欲しいと思った場合、配列内包表記がない場合は、以下のように書いたりします。 <script type="text/javascript"> var arr = [1,2,3,4,5] for (var i = 0; i < arr.length; i++) { arr[i] *= 10; } </script> これを配列内包表記に
jstudyで「JavaScriptとLisp」ってタイトルのLTしました - あと味
昨日、jstudyの第一回目のイベントがめでたく開催されました。 Twitterで見かけて、速攻で申し込んだんですが、せっかくだからLTしたいなと思い、稚拙ながら「JavaScriptとLisp」というタイトルでLTをさせていただくことができました。 発表するまで、ネタとしてどうなんだろうと不安でしたが、予想外に反応があったので良かったです。 jstudyの感想 jQuery、Dojo、JavaScriptの設計手法 x 2、ECMAScript5の仕様、jsdo.itの紹介、iPadとJavaScript、JavaScriptの高速化手法、JavaScriptで昔を懐かしむなどなど、JavaScript好きにはとっても楽しいひと時を過ごすことができました。 LTに立候補していた人があまりいないように思いましたが、実際には11名？の方が発表し、最初から最後まで飽きることなく楽しめました。
File APIとJavaScriptを使って、テキストファイルを加工する便利ツールを作った - あと味
昨日、たまたま仕事で、CSV形式の名簿を加工する必要があって、最近はこういう時、JavaScriptを使って加工することがあります。 昨日の話で言うと、具体的には以下のようなCSVファイルを、 ほげ株式会社,jdg,jdg@example.com 株式会社ふが,taiju,taiju@example.com 有限会社ぴよ,foo,foo@example.com以下のように加工しなければならないケースでした。 jdg＠ほげ株式会社,jdg@example.com taiju＠株式会社ふが,taiju@example.com foo＠有限会社ぴよ,foo@example.com「会社名,名前,メールアドレス」で構成されているCSVを「名前＠会社名,メールアドレス」で構成したCSVに加工するってことです。 こういう時、今までは、まずはテキストエディタの置換を使って、以下のような配列オブジェクトに
partial関数は引数の最後に関数を指定できるとネストした時に見やすい - あと味
letみたいなものをJavaScriptに実装しようと思っていろいろやってた時に感じたことなんですけど、Pythonとか、Python志向なMochikitなどに導入されているpartial関数は、引数の最後に関数を指定できると、ネストした時にが見やすいと思いました。好みはあると思いますが。 partial関数とは？ ある関数に必要な引数を部分適用できる関数です。例えば、以下のような関数があったとします。 function FromTo(from, to) { return from + 'から' + to + 'まで'; } FromTo('福井', '東京'); // 結果: // 福井から東京まで fromという引数とtoという引数を指定することで、◯◯から◯◯までという文字列を出力できる何の実用性もないプログラムです。 この時、partial関数を使用すると、先にfromという引数
JavaScriptでLispのような再帰的なリストを作るlist関数を作ってみた - あと味
Lispの勉強をする際に、まだLisp慣れを全然してないので、JavaScriptで書くとどうだろう？ということを考えることが多々あります。 その勉強方法の良し悪しは置いといて、JavaScriptでLispのサンプルプログラムを書いてみようと思った場合、一番ネックなのが、JavaScriptとLispでは、リストの考え方がそもそも違うことかなと思いました。 Lispで(1 2 3)というリストを作る時には、以下のようなコードで作ります。*1 (cons 1 (cons 2 (cons 3 '()))) consは第一引数と第二引数から成るセルを作る関数です。 単純に(cons 1 2)というコードをJavaScriptの配列リテラル表記で表すと[1,2]となるでしょうか。 そうすると、先程作りたかった(1 2 3)というリストを作るための上記のコードをJavaScriptの配列リテラル表
Pythonのrange関数をJavaScriptで再帰を使って実装してみた - あと味
Pythonにrange関数という数列を作る関数があるんですが、JavaScriptにもrange関数みたいなのがあると便利かもしれないと思って実装してみました。 関数型言語慣れするために再帰で書いたので、あまり長い数列は作れません。 Pythonのfor文 Pythonでは1から10までの数字をプリントする処理はこんな感じで書きます。 for i in range(1,11): print i range関数実装後のJavaScriptのコード JavaScriptでもこうやって書くと同じような結果になります。*1 range(1,11).forEach(function(i) { console.log(i); }); range関数のコード function range(start, end, step) { return ( (start === undefined) ? new
メソッドチェーンの作り方 - あと味
メソッドチェーンはわかりやすくて便利です。jQueryなどではメソッドチェーンが効果的に使えるように設計されているので、jQueryでメソッドチェーン使用している人も多いと思います。 このメソッドチェーンですが、作り方を解説するページがあまりない気がするので、JavaScriptを例にメソッドチェーンの作り方を紹介してみようと思います。 メソッドチェーンの原理 メソッドチェーンとは、名前のとおり、メソッドを実行して、その結果に対してさらにメソッドを実行する感じで、メソッドを繋げながら何らかの処理をしていく仕組みです。 例 hoge().fuga().piyo(); メソッドで返す値がメソッドを持っていることがメソッドチェーンを実行できる条件になります。 JavaScriptには最初からメソッドチェーンが実行できるメソッドがある JavaScriptには最初からメソッドチェーンが実行できるメ
ページズーム機能がないブラウザで、画像の拡大を含めたエラスティックレイアウトを実現するサンプルを作った - あと味
文字数で幅を指定できるエラスティックレイアウトが好きです。 CSSでレイアウトする時、各ブラウザがページズーム機能を導入した今はほとんど必要ないことかもしれませんが、一行あたりの文字数は読みやすい数というものがきっとあると思っています。 エラスティックレイアウトにしても、ページズームに対応していないブラウザでは、画像のサイズが拡大されません。そこがちょっと物足りないので、画像のズームも含めたエラスティックレイアウトを実現するためのサンプルを作ってみました。 最初に断っておくと、私はあんまりCSSを弄ることがないので、CSSのことツッコまれるとちょっとソワソワします。 HTMLサンプル <!doctype html> <html> <head> <meta charset="utf-8" /> <title>Elasticサンプル</title> </head> <body> <h1>Ela
createElementメソッドが微妙なので汎用的な関数にする - あと味
JavaScriptでDOMを生成するとき、document.createElementというメソッドを使いますが、属性の設定とかstyleの設定をしようとすると、縦にひたすら代入文を書き続ける感じになってあんまり好きじゃありません。 各種JSライブラリを導入すれば解決できる話ですが、車輪の再発明でシンプルな関数を作って対応することにします。 createElement関数のサンプル function createElement(elem, attrObj, styleObj) { var element = document.createElement(elem); if (attrObj) { for (var attr in attrObj) { element[attr] = attrObj[attr]; } } if (styleObj) { for (var prop in s
最近のJSの発育の良さは異常 - あと味
最近のJSはすごいね。 JavaScriptが第一級のプログラミング言語へ、分散バージョン管理にも注目が集まる － Publickey わんぱくでもいい、たくましく育って欲しい。 Inspired by 最近のJSの発育の良さは異常 - スチーム速報 ＶＩＰ
別のページにすでにある用語集を使って、用語にマウスポインタ合わせると用語集にある用語の説明をツールチップで表示するJSサンプル作った - あと味
タイトルなげー。 APIもDBもない時にこういうことしようと思ったらどうやって実現しようかなーと思ってサンプルを作ってみました。IE、バージョンの古いブラウザは未対応。 前提 こういう用語集のページがすでにあると過程。 grossary.html <!doctype html> <html> <head> <meta charset="utf-8"> <title>用語集</title> </head> <body> <dl> <dt class="term">インターネット</dt> <dd class="description">すばらしい</dd> <dt class="term">JavaScript</dt> <dd class="description">たのしい</dd> </dl> </body> </html> classは後から付ける感じになると思いますが、必ず対になっ
連番振るのがメンドイのでブックマークレット作った - あと味
テキストファイルにリストを書いてる時なんかに、文字の先頭に連番を振りたいことがあるんですが、途中で増減とかすると調整するのがメンドイので、ブックマークレットにしました。 下記のような感じのテキストを画面真ん中辺に表示されるテキストボックスに入力して、連番ボタンをクリックすると連番が振られます。 ひとつめ ふたつめ みっつめ ブックマークレット javascript:(function() { var textarea = document.createElement('textarea'); var input = document.createElement('input'); textarea.style.position = 'fixed'; input.style.position = 'fixed'; textarea.style.top = textarea.style.lef
指定時刻にアラートを出すブックマークレット作った（140字以内で） - あと味
最近、Twitter経由でテレビ番組の存在を知り、テレビを見ることが増えてきました。Twitterばかりやってて、メディアの中心がネットになっていると思いきや、むしろテレビの視聴率も上がっちゃってるのが不思議です。 15分後とかに見たい番組が始まるって時に、作業に集中していると、番組の始まる時間がとっくに過ぎてしまってたりするので、アラームが必要です。 超手軽に設定できるアラームが欲しいなーってことで、ブックマークレットで自作することにしました。ただし、140字以内で。 ブックマークレット*1 javascript:x=prompt('アラート時刻を入力 [hh:mm]');function f(y){(new Date+'').match(/\d{2}:\d{2}/)[0]!=y?setTimeout(f,1000,y):alert('AlertNow')}f(x) 140字以内だとTw
はてなダイアリーでJavaScriptを実行するためのiGoogleのガジェット作ってみた - あと味
キッカケは忘れましたが、昨日、はじめてiGoogleのガジェットを作ってみました。 なんだか難しいのかと思ってたら、意外と簡単で、試しに、はてなダイアリーでJavaScriptを実行するためのiGoogleガジェットを作ってみました。 一度作ってしまうと、mixiアプリにも応用が聞いて、勉強する対象としてはなかなかいいなーと思いました。 Google Gadget Editorを使って作るとプレビューがあって楽ですね。でも、opensocialのAPIはプレビューでは動かなかったなー。 iGoogleガジェットのソース <?xml version="1.0" encoding="UTF-8"?> <Module> <ModulePrefs title="JavaScript Eval for Hatena Diary" width="500" height="500" author="ht
JavaScriptのfor文の中で、カウンタ変数を利用する関数をジェネレートするいくつかの方法 - あと味
for文の中で、カウンタ変数を利用する関数を作るとき、はじめは必ずハマるであろうことが予想できます。 私も実際にハマったことが多々あります。 本エントリーでは、for文の中で、カウンタ変数を利用する関数をジェネレートするいくつかの方法を提示したいと思います。 問題のあるコード 以下のコードがfor文の中で、カウンタ変数を利用する関数をジェネレートするコードです。for文を1から5まで繰り返し、配列の中にカウンタ変数を出力する関数を格納していきます。関数が格納された配列をさらにfor文で走査し、1から5まで出力することを意図しています。 素直にコーディングすると、まずうまくいきません。 var func_list = []; for (var i = 1; i < 6; i++) { func_list.push(function() { return console.log(i); });
昨日は13日の金曜日だったので、JavaScriptでJSONと戯れました - あと味
ということで、JSONにチェーンソーメソッドチェーンを与えてみる。 Object.prototypeを汚しちゃうなんてお行儀悪いけど、仕方ないじゃない、ジェイソンなんだもん。お行儀悪い男の子なんだもん。 Object.prototype.show = function() { if (this.head) { console.log(this.head); } else { return '死んだ'; } if (this.body) console.log(this.body); if (this.foot) console.log(this.foot); } Object.prototype.chop = function() { if (!this._body) { this._body = this.body; this._foot = this.foot; } var clone
()()で呼び出せるJavaScriptのネスト関数の活用法を思いついた - あと味
関数を返すJavaScriptのネスト関数は、()()で呼び出すことができます。 ()()で呼び出すネスト関数の活用方法を考えたのですが、考えて出した答えがこれです。 答え var _ = function(x) { return function(y) { var oppaireview = ( x === '・' && y === '・' ) ? 'ハリのあるおっぱい' : ( x === '.' && y === '.' ) ? '垂れ気味のおっぱい' : ( x === '. ' && y === ' .' ) ? '左右に広げたおっぱい' : ( x === ' .' && y === '. ' ) ? '真ん中に寄せたおっぱい' : ( x === '◎' && y === '◎' ) ? '立体的なおっぱい' : ( x === '○' && y === '○' ) ? '乳
JavaScriptの再帰の回数制限を超える実験をしてみる - あと味
JavaScriptで再帰をすると、ブラウザによって再帰できる回数が違います。 ブラウザごとに何回再帰できるかを検証する記事がいくつかありました。 各ブラウザのJSランタイムがどこまで再帰できるか試してみた、という。 - muddy brown thang javascriptの再帰処理の限界 - 電脳戦士ハラキリ -SE道とは死ぬ事と見つけたり- JS の再帰 (追試) - 冬通りに消え行く制服ガールは✖夢物語にリアルを求めない。 - subtech Firefoxだと3,000回あたりが再帰回数の限界のようですね。 実験の概要 ということで、単純な等差数列の和を求めるコードを実行して、再帰回数の限界について実験してみました。*1 実験1 Firefoxで3,000回実行できるかどうか確認してみます。 var arithmetic_progression = function(n) {
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
パスワード認証