【TS JS】if文 真偽値の挙動

if文の条件式のところに
数字が代入されてて「？？？」となったので
手を動かしておべんきょしてみた🐾

const flag1: boolean = true;
const content: string = flag1 ? "apple" : "lemon";

console.log("◆ifの条件の中にboolean以外の型が入ってきた場合はどうでしょうか？");

const num: number = 1;
if (num) {
  console.log("trueだあよ");
} else {
  console.log("falseだあよ");
}

console.log("否定文の場合は？");
if (!num) {
  console.log("trueだあよ");
} else {
  console.log("falseだあよ");
  console.log(!num);
}
console.log("結論：0 = false,  1 = true");

console.log(
  "TypescriptやJavascriptの世界で boolean型の false として処理される値は 「6種類」 しかない" +
    "\n" +
    "①「boolean型のfalse」" +
    "\n" +
    '②「string型の空文字"」 Web系システムだと、ラベルとして表示する文字列が存在する場合のみ要素として追加する時に用いられる' +
    "\n" +
    "③「number型の0」" +
    "\n" +
    "④「number型のNaN」" +
    "\n" +
    "⑤「null」" +
    "\n" +
    "⑥「undefined」 従って空配列[]や空オブジェクトの{}もtrue" +
    "\n"
);

console.log('②「string型の空文字"」');
const label: string = "";
console.log(!!label);
0;

console.log("④「number型のNaN」");
// 数字ではないため、数値へは変換できない
Number("文字列"); // => NaN
// 整数としてパースできない文字列だった
Number.parseInt("e10s", 10); // => NaN
// 未定義の値はNaNになる
Number(undefined); // => NaN
// 空オブジェクトは数値にできない
Number({}); // => NaN

let x = 10;
let y = x + NaN;
let z = y + 20;
console.log(x); // => 10
console.log(y); // => NaN
console.log(z); // => NaN
// NaNは何と演算しても結果はNaNになる特殊な値です。

// ※以下で紹介する記法は、必ずしも「可読性が高い」とはいえません。
//   しばしば同様の議論を見かけますが、
//   技術レベルの大きく異なるメンバがいるチーム開発の場合は
//  「多少冗長でもif~else構文で記載する」等の注意が必要です。
console.log(
  "◆短絡評価 : 「左辺を評価してtrueなら左辺を、falseなら右辺を返す」" +
    "n" +
    "&&は 「左辺を評価してtrueなら右辺を、falseなら左辺を返す」 という挙動"
);

const obj: { hoge: string } = {
  hoge: "hogehoge",
};

// trueなので左辺のobj.hogeをaに代入
let a: string = obj.hoge || "null";

const obj2: { hoge: string } = {
  hoge: "hogehoge",
};

// この場合左辺obj.hogeが`true`なので右辺の"null"がaに代入される
let a2: string = obj.hoge && "null";

console.log("◆オプショナルチェイニング演算子");

let obj3: { hoge?: string } | undefined;

let a3: string = "";

// アクセスしたいプロパティまでが全て定義されているかチェック
if (obj && obj.hoge) {
  a3 = obj.hoge;
}
// 例えばこれがobj.hoge.fuga.puniのようにプロパティが入れ子になっていくにつれ、判定も長くなっていきます
// そこで活躍するのがオプショナルチェイニング演算子?.です。

console.log(
  "これは指定したプロパティに到達するまでの参照が正しいかどうかをチェックせずにアクセスし、正常にアクセスした場合はその値を、できない場合はundefinedを返します。"
);
let obj4: { hoge?: { fuga?: { puni?: string; baz?: string } } } | undefined = {
  hoge: { fuga: { baz: "aaa" } },
};

let puni = obj4?.hoge?.fuga?.puni;
let baz = obj4?.hoge?.fuga?.baz;

// puniは未定義のためundefinedが入る(ここでエラーが出て落ちることはない)
console.log(puni); // --> undefined
// bazは存在するため通常通り代入される
console.log(baz); // --> "aaa"

// obj.hoge.fuga.puniが参照できなければ"null"が入る
let puni2: string = obj4?.hoge?.fuga?.puni || "null";