javascriptの型チェックと等価(==)厳密等価(===)演算子

C言語ライクに使っても、わりと動作するjavascriptだが、javascript独自仕様でハマりそうなところを今一度まとめて備忘録として残す

型チェック

javascriptの標準関数とjQueryの関数を使うケースの2パターンある。
jQueryを使ったほうがより正確にチェックできるが、使えないケースを想定して両方知っておく必要がある。

  • javascriptの場合はtypeofを使う。

typeofを使うと変数の型を文字列で返す。null, object, arrayの判定があいまいになるので注意する。

// 問題なく使えるケース
typeof 23 // 'number'
typeof "hello" // 'string'
typeof true // 'boolean'
typeof undefined // 'undefined'
typeof function(){var a = 0; } // 'function'
 
// あいまいケース
typeof {a:0} // 'object'
typeof [1,0] // 'object'
typeof null // 'object'
  • javascriptの場合その2 Object.prototype.toString.call()を使う

typeofだと分からなかったobject,array,nullも判定できる

var check = Object.prototype.toString
 
check.call({a:0}) // "[object Object]"
check.call([0,1,2]) // "[object Array]"
check.call(null) // "[object Null]"
check.call(undefined) // "[object Undefined]"
check.call(9) // "[object Number]"
check.call("abc") // "[object String]"
check.call(true) // "[object Boolean]"
check.call(function(){var a = 0;}) // "[object Function]"
check.call(new RegExp()) // "[object RegExp]"
  • jQuery.type ( var 1.4.3 以上 )

Object.prototype.toString.call()と同じような結果を返す

$.type({a:0}) // "object"
$.type([0,1,2]) // "array"
$.type(null) // "null"
$.type(undefined) // "undefined"
$.type(9) // "number"
$.type("abc") // "string"
$.type(true) // "boolean"
$.type(function(){var a = 0;}) // "function"
$.type(new RegExp()) // "regexp"
  • おまけ) Object.prototype.toStringを使ってjQuery.typeに似た結果を返す関数
var is = function( input ){
    return Object.prototype.toString.call(input).slice(8,-1).toLowerCase();
}
is({a:0}) // "object"
is([0,1,2]) // "array"
is(null) // "null"
is(undefined) // "undefined"
is() // "undefined"
is(9) // "number"
is("abc") // "string"
is(true) // "boolean"
is(function(){var a = 0;}) // "function"
is(new RegExp()) // "regexp"

等価==と厳密等価===演算子

  • 等価演算子==

javascriptの等価演算子は、内部で型変換し、同じ型にした状態でチェックを行う。 よろしくやってくれて助かるケース?もあるかもしれないが基本あいまいな比較。アテにすると痛い目にあうかもしれない。C言語の仕様に近い?

  • 厳密等価演算子===

型変換せずに比較する演算子。C#の言語仕様に近い。
融通が利かないが、あいまいさを除外する意味でもこちらを使うことを推奨している。 全部こちらでやれば良い。

console.log( "1" == 1 ); // true
console.log( "1" === 1 ); // false
console.log( 1 == true ); // true
console.log( 1 === true ); // false
console.log( null == undefined ); // true
console.log( null === undefined ); // false
 
// オブジェクトの場合はインスタンスの比較になるので、どちらもfalseになる
console.log( new String("aa") == new String("aa")); // false
console.log( new String("aa") === new String("aa")); // false
console.log( "aa" == new String("aa")); // false
console.log( {a:0} == {a:0}); // false
console.log( {a:0} === {a:0}); // false
console.log( [0,1] === [0,1]); // false