JavaScriptで文字列を真偽値に変換する正しい方法

JavaScriptでこういうことをしたい場合・・・

"true" の文字列なら真として判断、
"false" の文字列なら偽として判断

つまり　文字列　＝＞　真偽値　への変換について。

例　：　URLクエリから真偽値を受け取る時など

その方法は意外と間違えやすいので、
ここでは文字列から真偽値への変換方法をまとめました。

このページの目次

まずは絶対すべきでない変換方法から・・・
- ダメな例１．等価演算子（==）を使った変換
- ダメな例２．Booleanオブジェクトを使って変換する方法
一番グッドな方法は JSON.parse を使うこと（かも）

まずは絶対すべきでない変換方法から・・・

まず絶対NGな変換方法について。

次の方法だと文字列から真偽値への変換は行えません。

ダメな例１．等価演算子（==）を使った変換

まずは等価演算子（==）を使った変換。

NGコードの一例を挙げるならこんなコードです。

var str = 'true';
var bool1 = str == true;
  /// bool1 => true

var str = 'false';
var bool2 = str == true
  /// bool2 => true

var str = 'true';

var bool1 = str == true;

/// bool1 => true

var str = 'false';

var bool2 = str == true

/// bool2 => true

これ一見良さそうに錯覚してしまいます。

でも 'true' 'false' に関わらず true という結果に・・・

その理由はMDNで解説されてました。

値が省略された場合や、値が 0, -0, null, false, NaN, undefined あるいは空文字列 ("") であった場合、オブジェクトは false の初期値を持ちます。それ以外のあらゆる値は、オブジェクトや "false" という文字列も含めて、true の初期値を持つオブジェクトを生成します。

引用元　：　Boolean - JavaScript | MDN

文字列の場合、空文字列以外は true という判定に。

だから　文字列　＝＞真偽値　の変換には不適切です。

ダメな例２．Booleanオブジェクトを使って変換する方法

ラップオブジェクトとして Boolean があります。

この Booleanを使っての変換も良くありません。

というか文字列だと空文字以外は true になります。

▼ Booleanを使ったダメな変換コード例

var str = 'true';
var bool1 = Boolean(str);
  /// bool1 => true

var str = 'false';
var bool2 = Boolean(str);
  /// bool2 => true

var str = 'true';

var bool1 = Boolean(str);

/// bool1 => true

var str = 'false';

var bool2 = Boolean(str);

/// bool2 => true

この通り。どっちも true になっちゃってます。

文字列以外ならまだ有用な方法なのですが・・・

これも　文字列　＝＞　真偽値　への変換にはバッドですね。

一番グッドな方法は JSON.parse を使うこと（かも）

現時点で思いつく一番グッドな方法・・・

それは JSON.parse を使って変換することです。

▼ JSON.parse についてのMDNでの解説

JSON.parse() メソッドは文字列を JSON として解析し、文字列によって記述されている JavaScript の値やオブジェクトを構築します。任意の reviver 関数で、生成されたオブジェクトが返される前に変換を実行することができます。

引用元 : JSON.parse() - JavaScript | MDN

この解説通り、文字列をJSONとして解析。

解析後に値・オブジェクトとして返してくれるメソッドです。

これ使って、文字列から真偽値への変換を書いてみました。

▼ そのコード例を挙げるなら以下の通り

var str = 'true';
var bool1 = JSON.parse(str.toLowerCase());
  /// bool1 => true

var str = 'false';
var bool2 = JSON.parse(str.toLowerCase());
  /// bool2 => false

var str = 'true';

var bool1 = JSON.parse(str.toLowerCase());

/// bool1 => true

var str = 'false';

var bool2 = JSON.parse(str.toLowerCase());

/// bool2 => false

今度はちゃんと変換できました！

でも値が 'true' または 'false' でしか通用しません。

もう少し汎用性を高くするなら、次みたいなコードですね。

▼ 汎用性高くするついでに関数化

function convertStrToBool(str){
  if(typeof str != 'string'){ 
    return Boolean(str); 
  }
  try{
    var obj = JSON.parse(str.toLowerCase());
    return obj == true;
  }catch(e){
    return str != '';
  }
}

function convertStrToBool(str){

if(typeof str != 'string'){

return Boolean(str);

}

try{

var obj = JSON.parse(str.toLowerCase());

return obj == true;

}catch(e){

return str != '';

}

やっていることは文字列以外なら Boolean(str) で普通に真偽値変換し、文字列だったら例外処理を挟んだうえで JSON.parse() を使って変換してるだけです。（JSONとして認知できない不正値だと例外が発生する）

この関数を使い、文字列・値を真偽値変換してみました。

▼ コードと変換結果

convertStrToBool('true');
  /// => true
  
convertStrToBool('false');
  /// => false

convertStrToBool('1');
  /// => true
  
convertStrToBool('0');
  /// => false
  
convertStrToBool('');
  /// => false

convertStrToBool('hogehoge');
  /// => true
  
convertStrToBool(null);
  /// => false
  
convertStrToBool(NaN);
  /// => false

convertStrToBool('true');

/// => true

convertStrToBool('false');

/// => false

convertStrToBool('1');

/// => true

convertStrToBool('0');

/// => false

convertStrToBool('');

/// => false

convertStrToBool('hogehoge');

/// => true

convertStrToBool(null);

/// => false

convertStrToBool(NaN);

/// => false

こういう感じで文字列以外も変換できます。

もしコードで変な所・不備を見つけたら教えてください。

以上、JSでの　文字列　＝＞　真偽値　の変換でした。ではまた。

JavaScriptで文字列を真偽値に変換する正しい方法

まずは絶対すべきでない変換方法から・・・

ダメな例１．等価演算子（==）を使った変換

ダメな例２．Booleanオブジェクトを使って変換する方法

一番グッドな方法は JSON.parse を使うこと（かも）

関連記事

プロフィール

人気記事

検索してみる