JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで文字列を真偽値(Boolean)に変換する方法


JavaScriptでは、文字列が「"true"」というリテラルと一致するかどうかを比較演算子で判定することで、文字列を実質的に真偽値(Boolean)として扱うことができます。ここでは、==(緩い等価比較)と===(厳密等価比較)の2つの方法を使った具体例を紹介します。

サンプルコード

<!DOCTYPE html>
<html>
<head>
<style>
    body {
        font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    }
</style>
</head>
<body>
<h1>文字列から真偽値への変換</h1>
<button class="Btn">CLICK HERE</button>
<input class="str" type="text" />
<p class="sample"></p>
<h3>上のボタンをクリックすると、文字列が真偽値に変換されます</h3>
<script>
    let sampleEle = document.querySelector(".sample");
    let inputEle = document.querySelector(".str");
    document.querySelector(".Btn").addEventListener("click", () => {
        sampleEle.innerHTML += "== を使用した場合:" + (inputEle.value == "true") + "<br>";
        sampleEle.innerHTML += "=== を使用した場合:" + (inputEle.value === "true") + "<br>";
    });
</script>
</body>
</html>

動作の仕組み

このサンプルでは、テキスト入力欄に任意の文字列を入力し、「CLICK HERE」ボタンをクリックすると、入力された値が「true」と一致するかどうかを2種類の比較演算子で判定し、その結果(true / false)を画面に表示します。

  • ==(緩い等価比較):必要に応じて型を暗黙的に変換したうえで値を比較します。文字列同士の比較であれば、内容が一致すれば true になります。
  • ===(厳密等価比較):値だけでなくデータ型まで含めて比較します。意図しない型変換によるバグを防げるため、実務ではこちらを使用することが推奨されています。

実行結果

入力欄に「true」と入力してボタンをクリックすると、次のように両方の比較結果が true と表示されます。

JavaScriptで文字列を真偽値(Boolean)に変換する方法

一方、「false」や空文字など「true」以外の文字列を入力してボタンをクリックすると、どちらの比較でも false が返されます。

JavaScriptで文字列を真偽値(Boolean)に変換する方法

補足:Boolean() 関数を使う方法との違い

なお、単純に文字列を真偽値へ型変換したいだけであれば、Boolean("true") のように Boolean 関数を使う方法もあります。ただしこの方法では、空文字("")以外のすべての文字列が true に変換されてしまうため、「true」という特定の文字列だけを判定したいケースでは、本記事のように文字列比較を行うアプローチが適しています。

  1. 文字列をJavaScriptオブジェクトに変換する方法【JSON.parse()の使い方】

    JavaScriptでJSON形式の文字列をオブジェクトに変換するには、JSON.parse()メソッドを使用します。このメソッドは、引数に渡された文字列を解析(パース)し、対応するJavaScriptオブジェクトを返します。 サンプルコード <!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, initial-scale=1.0 /> <title>Docum

  2. JavaScriptで整数配列を文字列配列に変換する方法

    JavaScriptで整数配列を文字列配列に変換する方法JavaScriptでは、map(String)メソッドを使うことで、整数の配列を簡単に文字列の配列に変換できます。map()は配列の各要素に対して指定した関数を適用し、その結果から新しい配列を生成するメソッドです。ここにString関数を渡すことで、配列内のすべての数値が文字列へと変換されます。例として、次のような整数の配列があるとしましょう。var integerValues = [101, 50, 70, 90, 110, 90, 94, 68];この整数配列を文字列配列に変換するには、次のように記述します。var stringVa