WEBOPIXEL

JavaScriptを短く書くためのショートコード集

Posted: 2014.12.25 / Category: javascript 

知っておくとちょっとだけコードが簡潔に書けるかもしれないショートコード集です。

Sponsored Link

小数点以下切り捨て

「Math.floor」で切り捨てですが、

    Math.floor(12.6598); //12

数値の前に「~~」付けるだけでもできます。

    ~~12.6598; //12

桁数の制御

「~e」に続く数字で桁数を制御できます。

    1e1 //10
    1e2 //100
    1e3 //1000
    1e4 //10000
    1e5 //100000

2の累乗はシフト演算子

2の累乗は左シフト演算子(<<)でできます。

    200 << 1; //400
    200 << 2; //800
    200 << 3; //1600

逆は右シフト演算子(>>)です。

    200 >> 1; //100
    200 >> 2; //50
    200 >> 3; //25

varは一つでまとめて変数宣言

「,」で区切ることでまとめて変数宣言できます。

    var x;
    var y;
    var z = 3;
    var x, y, z = 3;

配列の初期化

配列はnewではなくてブラケットだけで初期化できます。

    var hoge = new Array();
    var hoge = [];

短いif文は三項演算子を使う

if文は三項演算子にすると簡潔に書けます。

    var hoge;
    if (num > 10) {
        hoge = true;
    }
    else {
        hoge = false;
    }
    var hoge = (num > 10) ? true : false;

配列のパースはfor~in

順番の保証はされていないらしいので、確実に順番通りにパースしたいときはfor文を使用した方がいいみたいです。

    var hoge = [0,10,20,30,40,50];
    for (var i = 0; i < hoge.length; i++) {
        console.log(hoge[i]);
    }
    var hoge = [0,10,20,30,40,50];
    for (var i in hoge) {
        console.log(hoge[i]);
    }

JavaScript 1.6 から「forEach」が追加されたようです。

    hoge.forEach(function(ele){
        console.log(ele);
    });

charAtはブラケットを使う

文章の指定文字を抜き出せる「charAt」ですが、配列的にも抜き出せます。

    'あいうえおかきくけこ'.charAt(3);
    'あいうえおかきくけこ'[3];

Null, Undefined, Empty チェック

Null, Undefined, Empty チェックはまとめて。

    if( x !== null || x !== undefined || x !== "") {
    var y = x;
    }
    var y = x || "";

switchで関数を分けたいとき

switchで関数を分けたいときはオブジェクトにまとめておくと楽です。

    var hoge = 3;
    switch (hoge) {
        case 1:
            hoge1();
            break;

        case 2:
            hoge2();
            break;

        case 3:
            hoge3();
            break;
    }
    var hoge = 1;
    var arr = {
        1: hoge1,
        2: hoge2,
        3: hoge3
    };
    if (arr[hoge]) {
        arr[hoge]();
    }