WebStrom便利 その1

5月 16th, 2012
var AAA = {
    zeroStr :function(num){
        num = num instanceof String ? parseInt(num) : num;
        if(num < 10){
            return 0 + num.toString();
        }else{
            return num.toString();
        }
    }
};

zeroStr :function(num){

んとこで

/**

って書いてEnterキーおしたら

/**
 *
 * @param num
 * @return {String}
 */

zeroStr :function(num){

って出てくるのでちょっと楽チン

jQueryを模倣した簡単なライブラリのひな形

4月 24th, 2012
(function (window,undefiend) {
    var module = function(){
      return new module.prototype.init();
    };

    module.prototype = {
      init:function(){
        return this;
      },
      aNumber:0,
      increment:function(){
        this.aNumber += 1;
        return this;
      }
    };

    module.prototype.init.prototype = module.prototype;
    window.module = window.MDL = module;
}(this));

html

<p id="test01"></p>
<p id="test02"></p>

JavaScript

var a = MDL();
var b = MDL();
a.increment().increment().increment().increment();

document.getElementById("test01").innerText = a.aNumber;
document.getElementById("test02").innerText = b.aNumber;

result

<p id="test01">4</p>
<p id="test02">0</p>

jQuery的ライブラリの入り口

2月 27th, 2012

Twitter Bootstrap

2月 24th, 2012

Bootstrap
少しだけさわった。
さわったってか、まぁ、書き写した。
sample
IE6未対応
formはcheckboxだけどうにかすれば使えるけど、ボタンに関しては問題外かな…
いや、ダメかな…
ふむ…IE6捨てなサイトでしか使用すんなってことね
そうなりますよねー
ちょっちくらいの崩れなら、許容できるけど、ここまでだと、厳しいなぁ…うーん…

compass

2月 23rd, 2012

Compassいいぜ

http://compass-style.org/

compass project xxxx

でcompassのプロジェクト作って

生成されたconfig.rbをひらいてcss_dirやらsass_dir を指定したりして、

cd /d %~dp0
compass watch

ってバッチ作っとけば、sass_dirで指定したディレクトリ内の全scssがcss_dirにcssとしてぶっこまれてく。
sass_dirで指定したフォルダ内に小ディレクトリもきちんとcssディレクトリ内に小ディレクトリとして吐き出されとる。

あと、別に

compass project xxxx

ってやらんくても、config.rbと何かしらのscssがあればいい。

ひゃっほい。

JSでnewするときにOR(|)が使えるの?

2月 22nd, 2012

お疲れ様です。
new (window.XDomainRequest || window.ActiveXObject || XMLHttpRequest)(‘Microsoft.XMLHTTP’);
ってやり方を見たので、
また、ちょっと、試したいなぁ、という意思表明。
いや、そんなに時間がかかるもんでもないけど、メモのため。

んでやってみた

function test(a){
    this.a = a;
}

test.prototype.bell = function(){
    return this.a;
};


var b = new (unko || test)(45);

console.log(b);

ってやると
[ Uncaught ReferenceError: unko is not defined ]
ってなる
まぁ、そりゃunkoっ変数でも関数でもなければ、なんじゃ、って話っすよね…

var b = new (window.unko || window.test)(45);

ってすると、まぁ、いけるわけすよ。
グローバルのプロパティとして登録されてるかどうか、ってことなので。
window.unko は登録されてないからundefinedとなって、window.testがnewされると。
はぁん、なるほどねぇ。

jsのnamespace

2月 14th, 2012
(function(window,namespace,undefined){
   
    if(!window[namespace]){
        window[namespace] = G;
    }else{
        throw new Error("this namespace [" + namespace + "] is already defined.");
    }
   
   
    function G(a){
        this.message = a || "write somthing";
    }
   
   
    G.prototype.show = function(){
        alert(this.message);
    };
   
    G.prototype.unko = function(){
        alert(this.message + ' unko');
    };
   
}(this,'GAINA'));

var a = new GAINA();
var b = new GAINA("unkokoko");
a.show();   //write somthing
b.show(); //unkokoko

みたいのではダメなのかなぁ…

namespaceも使えるやつだけぶっこんで確かめたりするのかなぁ…

うーん…

if(!namespaceCreate){
    var namespaceCreate = {};
}

function namespaceCreate(global,namespace,classname){
    this.global = global;
    this.namespace = namespace;
    this.classname = classname;
    this.ns = "";
}

namespaceCreate.prototype.create = function(){
    if(this.namespace instanceof Array){
        var len = this.namespace.length,i;
        for(i = 0;i < len; i +=1){
            if(!this.global[this.namespace[i]]){
                this.global[this.namespace[i]] = this.classname;
                this.ns = this.namespace[i];
                return;
            }
            if(i === len - 1){
                throw new Error('these namespace is already defined.');
            }
        }
    }else{
        if(!this.global[this.namespace]){
            this.global[this.namespace] = this.classname;
            this.ns = this.namespace;
        }else{
            throw new Error('this namespace [' + this.namespace + '] is already defined.');
        }
    }
};

namespaceCreate.prototype.debug = function(){
    if(window.console){
        console.log('使用するnamespaceは [' + this.ns + '] です');
    }else{
        alert('使用するnamespaceは [' + this.ns + '] です');
    }
};

(function(window,namespace,undefined){
   
    var ns = new namespaceCreate(window,namespace,G);
    ns.create();
    ns.debug();
    //namespaceCreate(window,namespace,G);
   
    function G(a){
        this.message = a || "write somthing";
    }
   
    G.prototype.show = function(){
        alert(this.message);
    };
   
    G.prototype.unko = function(){
        alert(this.message + ' unko');
    };
   
}(this,['location','window','GAINA']));

var a = new GAINA();
var b = new GAINA("unkokoko");
a.show(); // write somthing
b.show(); // unkokoko

そもそもnamespaceってこんな認識であってるのかもわかんないわー

うだうだやって、最終型

jQueryオブジェクトのcontext

1月 12th, 2012

【メモ】

jQueryオブジェクトのcontextから親を参照するプロパティ

IEやらChromeやらsafariには[parentElement]があるけど

FireFoxには[parentNode]しかないので注意

thisの違い

1月 6th, 2012

当たり前かもしれないけど

var test = {
    test : function(){
        return this;
    }
}

function test02(){
    return this;
}

console.log(test.test()); //Object (test自身)
console.log(test02()); //DOMWindow

underscore

1月 5th, 2012

便利

underscore.js

読み書きプログラミング

ここのやつを写経してた。

anyとかfilterとかtimesとかdelayとかオブジェクト系とか何か色々便利そうだす。

_.filter([1,2,3,4,5,6,7,8,9],function(num){return num % 3 === 0;});

なら、返す値は[3,6,9]

 

mixinで拡張もできる

_.mixin({
    test : function(state){
        console.log("mixin : " + state);
    }
});
_.test("unko"); //mixin : unko

ほへぇ…

コンソール見て