jQueryでウィンドウサイズによって処理を変える

JavaScript

jQueryでオブジェクトの型を取得して判定などをしたい場合はjQuery.type()を使う

jQuery.type(obj)を使えばオブジェクトの型を知ることができるみたいです。取得した型を判定して、処理を分けたりといった時などに役立ちそうな感じですね。ということでさっそく使ってみました。使い方は引数に何か値を入れるだけです。以下サンプルコードです。

[ads_center]

jQuery.type(obj)

こんな感じで色々と引数に値を入れてみると、その型を取得できます。

var valueType = $.type("aaa");
alert(valueType); // string

var valueType = $.type(123);
alert(valueType); // number

var valueType = $.type(true);
alert(valueType); // boolean

var valueType = $.type([]);
alert(valueType); // array

var valueType = $.type({});
alert(valueType); // object

配列やオブジェクトに入れた値の型を1つずつ判定して何か処理をしたい場合は以下のようにすればいいですね。

配列

var arr = ["aaa", 123, true, [], {}];
$.each(arr, function(i, value) {
    var valueType = $.type(value);
    if(valueType === "string") {
        $('<p />').text("arr[" + i + "](" + value + ")は" + "stringです").appendTo('body');
    } else if(valueType === "number") {
        $('<p />').text("arr[" + i + "](" + value + ")は" + "numberです").appendTo('body');
    } else if(valueType === "boolean") {
        $('<p />').text("arr[" + i + "](" + value + ")は" + "booleanです").appendTo('body');
    } else {
        $('<p />').text("arr[" + i + "]" + value + "は" + valueType + "です").appendTo('body');
    }
});

// 実行結果
// arr[0](aaa)はstringです
// arr[1](123)はnumberです
// arr[2](true)はbooleanです
// arr[3]はarrayです
// arr[4][object Object]はobjectです

オブジェクト

var obj = {
    key1: "aaa",
    key2: 123,
    key3: true,
    key4: [],
    key5: {}
};
$.each(obj, function(i, value) {
    var valueType = $.type(value);
    if(valueType === "string") {
        $('<p />').text("obj[" + i + "](" + value + ")は" + "stringです").appendTo('body');
    } else if(valueType === "number") {
        $('<p />').text("obj[" + i + "](" + value + ")は" + "numberです").appendTo('body');
    } else if(valueType === "boolean") {
        $('<p />').text("obj[" + i + "](" + value + ")は" + "booleanです").appendTo('body');
    } else {
        $('<p />').text("obj[" + i + "]" + value + "は" + valueType + "です").appendTo('body');
    }
});

// 実行結果
// obj[key1](aaa)はstringです
// obj[key2](123)はnumberです
// obj[key3](true)はbooleanです
// obj[key4]はarrayです
// obj[key5][object Object]はobjectです

ということで、型を知りたい時にはとても便利ですね。以下のサイトが参考になりました。

関連記事

  1. WEB TICKER

    JavaScript

    テキストや画像を無限にスクロールさせれるティッカー実装「WEB TICKER」

    WEB TICKERは、テキストや画像、リストなどさまざまなコンテンツ…

  2. megamenu.js

    JavaScript

    レスポンシブでスマートなメガメニューを実装できる「megamenu.js」

    megamenu.jsはjQueryを使ったレスポンシブでスマートなメ…

  3. JavaScript

    1つのテキストリンクから複数のリンク先が表示される「μllinx」

    μllinx(mullinx)は1つのテキストリンクから複数のリンク先…

  4. Gradientify

    JavaScript

    シンプルなCSSグラデーション変化を実装できる「Gradientify」

    GradientifyはシンプルなCSSグラデーション変化を実装するこ…

  5. jquery.inputmask

    JavaScript

    テキスト入力のマスク(入力補助)を作成する「jquery.inputmask」

    jquery.inputmaskは、ウェブページでのテキスト入力のマス…

  6. Lightense Images

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. オリジナルチキン6ピース
  2. 200-DGCAM019
  3. ハクバ GW-PRO RED フォトグローブプロ PL
  4. Soundcore Liberty Air 2

アーカイブ

PAGE TOP