suVeneのアレ

なんか見かけたのでちょっと作ってみた。

① ～ ③は他人様。最後に俺。

タイム測定の為に、メソッド名はちょっと改変させてもらってる。

① 3桁ごとに区切る – PleasureDelayerDiary

Number.prototype.split3_1 = function() {
var r = "";
var s = this.toString().split("").reverse();
for(var i = 0; i < s.length; i++) {
if(i % 3 == 0 && i != 0 && s[i] != "-") {
r = s[i] + "," + r
} else {
r = s[i] + r;
}
}
return r;
}

② iandeth. - javascriptで数値をカンマ区切り文字列に変換する関数メモ

Number.prototype.split3_2 = function () {
var to = String(this);
var tmp = "";
while (to != (tmp = to.replace(/^([+-]?d+)(ddd)/,"$1,$2"))){
to = tmp;
}
return to;
}

③ JavaScriptで数値を3桁ごとに区切る - 0x集積蔵

Number.prototype.split3_3 = function() {
var m = (this < 0) ? -1 : 1;
var str = String(this*m).split('.');
var arr = String(str[0]).split(''), len = Math.ceil(arr.length/3), res = [];
for (var i =0;i<len;++i) res.push(arr.splice(-3,3).join(''));
return (m == -1 ? '-' : '') + res.reverse().join(',') + (str[1] ? '.' + str[1] : '');
};

後続の割りに洗練されていない俺バージョン

Number.prototype.split3_ore = function() {
('' + this).match(/(-?)([0-9]+)(.[0-9]*)?/);
var sp = [RegExp.$1, RegExp.$2, RegExp.$3];
var x = Math.floor(sp[1].length / 3) * 3;
var len = sp[1].length;
return sp[0] + (sp[1].substr(0, len - x)) + (len - x == 0 ? '' : ',') +
(sp[1].substr(len - x, x).match(/[0-9]{3}/g).join(',')) + sp[2];
}

タイム測定

②番速っっっ！！

Programming JavaScript

JSON(JavaScript Object Notation)ってのは、Javascipt扱う人ならば大体知っていると思う。
簡単に言えば、JavaScript のデータ互換フォーマットの事。

{
"hoge": 1,
"fuga": ["a", "b", "c"]
}

みたいなフォーマット。
参考)
Collection & Copy – [翻訳]JSON入門
JavaScript++かも日記 – JSON/簡単なテスト:基本

これは確かに、同一ドメインでクライアントに渡すデータとしては有効で、レスポンスをそのまま eval して使えるので便利なのだ。(prototype.js では Ajax.Request.prototype.evalJSON() を利用すれば JavaScript のオブジェクトになる)

ただ、JavsScript ではセキュリティの問題でクロスドメインでのデータ通信は制限されているのは周知のとおりで、自分でサーバースクリプトを触れないと利用できない。
そのため、様々な解決方法が考えられているが、最近の流行は JSONP って方法だ。
(この「JavaScriptのクロスドメインはセキュリティの問題」ってのがバズワード化しているようにも思える。XmlHttpRequestでクロスドメインのデータ使うのと、他の手段を使ってクロスサイトのスクリプト読み込むのとで、根本的にセキュリティの穴の違いってあるの？結局、不特定多数がスクリプト仕込めるような環境だと、同じに思えるんだけれども！同じなら、制限なくなればいいのにと思ったり。誰か決定的な違いがあるって知ってたら教えてください)

簡単に説明すると以下のようになる。
1) JavaScript のインポートは XmlHttpRequest と違い、同一ドメインでなくても読み込めるという点を利用する。

var script = document.createElement('script');
script.charset = 'utf-8';
script.src = url; // 同一ドメインでなくても良い
document.body.appendChild(script);

2)レスポンスは JavaScript として動けばそれでよいので

var data = {"prop1": "serverdata"}

などを返す事により、var data を利用する。

ただ、問題なのはインポートは非同期なので、すぐ後に

alert(data.prop1);

などと書いても、undefined となってしまう。そのために、読み込み完了を通知する為の callback を指定するという方法だ。どんな方法でも良いのだが、例えば

if (typeof data == 'undefined') var data = {};
data = {"prop1": "serverdata"};
if (typeof(data.onload) == 'function') data.onload(data);

などとしてレスポンスを実装したりする。
他にも、単純に

calbackfunc({"data": {"prop1": "serverdata"}})

などのレスポンスでも良い。

現在、webで有名なサービスも続々と JSONP を提供してくれてる。
(Google, Amazon, del.icio.us, Flickr等)
XMLをJSONにしてくれるdrk7.jpさんのサービスもそうなのだが、XMLにエラーがあると、JSONPでなくJSONになるのが困る。
参考)
snippets from shinichitomita’s journal – ブラウザからJSONで呼び出せるサービス一覧

もっと詳しい説明は、以下の参考記事を見てくれ！
とりあえず、Hatena も API や Feed だけじゃなく JSONP 提供してくれねーかなぁって感じ。


* 参考記事
from __future__ import * » Remote JSON – JSONP
ITmedia エンタープライズ：実は、Ajaxのウラにこそ勝算がある (1/5)
hail2u.net – Weblog – JSONScriptRequest
hail2u.net – Weblog – JSONP
JavaScript++かも日記: 【JSON】Remote JSON – JSONP
JXML を JSON に変換するサービス – ベータ版を公開 :: Drk7jp

Programming JavaScript