SQLの窓

2010年01月24日


JavaScript : window オブジェクトのプロパティとしてグローバル変数を定義する

実際は、右辺にオブジェクトをセットして専用の名前空間で参照できるライブラリのインスタンスとして利用します。

ルートで var で定義する変数と厳密には違うようですが、事実上同じと思っていいと思います。ですから、Fucntion 内でグルーバルな変数を利用したい場合は、window オブジェクトを使用すると良いでしょう
window.変数名 = "lightbox"

または

window["変数名 "] = "lightbox"

例えば、Shadowbox というライブラリを簡単にまとめると以下のような定義のしかたをしています( 以前は var で直接セットしていましたが、最新はこのようになります )
(function(){

    var ua = navigator.userAgent.toLowerCase(),

    S = {

        // いろいろな定義

        },

    // いろいろな定義
    ;

    window['Shadowbox'] = S;

})();


(function(){})(); は、関数を定義して呼び出すのを一度に行う書き方で、無名関数を定義して () で実行しています


posted by lightbox at 2010-01-24 18:46 | JavaScript オブジェクト | このブログの読者になる | 更新情報をチェックする

2010年01月23日


JavaScript : Numberオブジェクトに16進数文字列に変換して指定した長さで前にゼロを付けるメソッドを追加する

JavaScriptの function の引数の扱いと、prototype の使い方のサンプルです

Number.prototype.toHex = function () {
	var n;
	// デフォルトは長さ2で前にゼロ
	if ( arguments.length == 0 ) {
		n = 2;
	}
	// 以外は引数が長さで前にゼロ
	else {
		n = arguments[0]; 
	}
	// 数値を16進数文字列に変換
	var s_hex = this.toString(16);
	// 長さが引数より長い場合は何もしない
	if ( s_hex.length >= n ) {
		return s_hex;
	}
	// 長さが引数より短い場合は0で長さぶんを補完する
	else {
		return ("0000000000" + s_hex).substr(s_hex.length+10-n,n);
	}
}

alert((0).toHex());
alert((255).toHex());
alert((300).toHex(5));



posted by lightbox at 2010-01-23 02:05 | JavaScript オブジェクト | このブログの読者になる | 更新情報をチェックする

2010年01月21日


JavaScript : String オブジェクトの replace メソッドの第二引数に関数を指定する一括置き換え処理

Microsoft の関連ページ
replace メソッド

以下のように変換されます

2010年01月01日 2010年02月01日 2010年03月01日

※ a には、日付文字列全体がセットされます
buff = "2010/01/01 2010/02/01 2010/03/01"

result = buff.replace(
	/(\d+)\/(\d+)\/(\d+)/g,
	function (a, b, c, d) {
		return b + "年" + c + "月" + d + "日"
	}
)

alert(result)



タグ:javascript
posted by lightbox at 2010-01-21 17:53 | JavaScript オブジェクト | このブログの読者になる | 更新情報をチェックする

2009年09月03日


JavaScript : オブジェクトとインスタンスとプロパティの継承

Object オブジェクトは、JavaScript の全てのオブジェクトの元となるオブジェクトですが、
JavaScript はオブジェクトに対してプロパティを自由に追加できます。

Object.myData = 20090903;
Object.myFunc = function() {
alert(this.myData);
};

しかし、このプロパティは Object から参照した時に利用できますが、インスタンス化
したオブジェクトからは参照できません

Object.myData = 20090903;
Object.myFunc = function() {
alert(this.myData);
};
obj = new Object();
.
.
.

<INPUT type=button value="実行1" onClick='Object.myFunc();'>
<INPUT type=button value="実行2" onClick='obj.myFunc();'>

※ 実行1は、20090903 が表示される
※ 実行2は、エラー

重要
インスタンスからも利用できるようにするには、prototype プロパティにセットします。
この場合、同じ名前でセットされていた値は、prototype にセットされた内容で上書き
されます( ローディング後に上書きされるようです )

Object.myData = 20090903;
Object.myFunc = function() {
alert(this.myData);
};
Object.prototype.myData = 20091231;
Object.prototype.myFunc = function() {
alert(this.myData+"/prototype");
};
obj = new Object();
.
.
.

<INPUT type=button value="実行1" onClick='Object.myFunc();'>
<INPUT type=button value="実行2" onClick='obj.myFunc();'>

※ 両方とも 20091231/prototype が表示される

さらに、インスタンスにもプロパティを追加できます
Object.myData = 20090903;
Object.myFunc = function() {
alert(this.myData);
};
Object.prototype.myData = 20091231;
Object.prototype.myFunc = function() {
alert(this.myData+"/prototype");
};
obj = new Object();
obj.myFunc2 = function() {
alert(this.myData+"/インスタンス");
};
obj2 = new Object();

この場合、obj のみに追加され事になります( obj2 にmyFunc2 はありません )

重要
そして、結果的に、Object.prototype に追加されたものは、他のオブジェクトで
使用できる事になります

String.myFunc();
"abc".myFunc();
x = new String();x.myFunc();

いずれも同じ結果となります



posted by lightbox at 2009-09-03 11:13 | JavaScript オブジェクト | このブログの読者になる | 更新情報をチェックする

JavaScript : グローバル変数を使わずに、window オブジェクトのプロパティを使う

ECMAScript の仕様は良く解りませんが、ちょっと調べてみても グローバルな変数は、
window の名前空間で参照されますが、列挙できません。
だったら最初から window に登録すればいいのですが、他とのつりあい上少し注意
する必要があります。
window.myData = "123";

window.isDate = function (str) {
	if ( str == "" ) {
		return true;
	}
	if ( !str.match(/^\d{4}\/[\d]+\/[\d]+$/) ) { 
		return false; 
	} 
	var parts = str.split( "/" );
	var nYear = Number(parts[0]); 
	var nMonth = Number(parts[1]) - 1;
	var nDay = Number(parts[2]);
	// 月,日の妥当性チェック 
	if ( 0 <= nMonth && nMonth <= 11 && 1 <= nDay && nDay <= 31 ) { 
		var dt = new Date(nYear, nMonth, nDay); 
		if( isNaN(dt) ) { 
			return false; 
		}
		else if(
					dt.getFullYear() == nYear &&
					dt.getMonth() == nMonth &&
					dt.getDate() == nDay ) {
			return true;
		}
		else{ 
			return false;
		}
	}
	else{ 
		return false;
	}
};

String.prototype.isDate = function () {
	var str = this.valueOf();
	if ( str == "" ) {
		return true;
	}
	if ( !str.match(/^\d{4}\/[\d]+\/[\d]+$/) ) { 
		return false; 
	} 
	var parts = str.split( "/" );
	var nYear = Number(parts[0]); 
	var nMonth = Number(parts[1]) - 1;
	var nDay = Number(parts[2]);
	// 月,日の妥当性チェック 
	if ( 0 <= nMonth && nMonth <= 11 && 1 <= nDay && nDay <= 31 ) { 
		var dt = new Date(nYear, nMonth, nDay); 
		if( isNaN(dt) ) { 
			return false; 
		}
		else if(
					dt.getFullYear() == nYear &&
					dt.getMonth() == nMonth &&
					dt.getDate() == nDay ) {
			return true;
		}
		else{ 
			return false;
		}
	}
	else{ 
		return false;
	}
};

window はそもそも、JavaScript のプラットホームですから特殊です。
prototype を使うとIEではエラーは出無いのですが、なんかおかしくなります。
IE 以外ではエラーですし。

String は、JavaScript のオブジェクトなので、普通に prototype 経由で登録します。

何れも、for( a in window )、for( a in String.prototype ) で参照可能です

関連する記事
prototype.js で、$(id) 関数が name 属性のみの場合 IE 以外で使え無いのを
とりあえず使えるようにする




posted by lightbox at 2009-09-03 01:14 | JavaScript オブジェクト | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します
container 終わり



フリーフォントで簡単ロゴ作成
フリーフォントでボタン素材作成
フリーフォントで吹き出し画像作成
フリーフォントではんこ画像作成
ほぼ自由に利用できるフリーフォント
フリーフォントの書体見本とサンプル
画像を大きく見る為のウインドウを開くボタンの作成

CSS ドロップシャドウの参考デモ
イラストAC
ぱくたそ
写真素材 足成
フリーフォント一覧
utf8 文字ツール
右サイド 終わり
base 終わり