【JavaScript】AND条件とOR条件の違いを実例で解説

JavaScriptでプログラムを作るとき、条件によって処理を分けることがよくあります。
その際によく使うのが「AND条件（&&）」と「OR条件（||）」という論理演算子です。

このページでは、複数の条件を組み合わせて判定するANDとORの違いを、具体的な実例コードを使ってわかりやすく解説します。
初心者の方でも理解しやすいように配列を使ったサンプルコードで説明しているので、ぜひ参考にしてください。

コード
1. 実行結果
解説
Web制作を学ぶならUdemy

コード

const person1 = {
  name: '佐藤',
  age: 26,
  gender: 'male',
};

const person2 = {
  name: '田中',
  age: 19,
  gender: 'male',
};

const person3 = {
  name: '鈴木',
  age: 33,
  gender: 'female',
};

const person4 = {
  name: '高橋',
  age: 15,
  gender: 'female',
};

const people = [person1, person2, person3, person4];

for (const person of people) {
  if (person.age >= 20 && person.gender === 'male') {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「AND条件」で入場できます`);
  } else {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「AND条件」で入場できません`);
  }

  if (person.age >= 20 || person.gender === 'male') {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「OR条件」で入場できます`);
  } else {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「OR条件」で入場できません`);
  }

  console.log('-------------------------');
}

実行結果

佐藤さん（26歳, male）は「AND条件」で入場できます
佐藤さん（26歳, male）は「OR条件」で入場できます
-------------------------
田中さん（19歳, male）は「AND条件」で入場できません
田中さん（19歳, male）は「OR条件」で入場できます
-------------------------
鈴木さん（33歳, female）は「AND条件」で入場できません
鈴木さん（33歳, female）は「OR条件」で入場できます
-------------------------
高橋さん（15歳, female）は「AND条件」で入場できません
高橋さん（15歳, female）は「OR条件」で入場できません
-------------------------

解説

このコードは、people という配列に4人の人物情報をオブジェクトでまとめています。

const people = [person1, person2, person3, person4];

それぞれの人物には、名前（name）、年齢（age）、性別（gender）が設定されています。

const person1 = { name: '佐藤', age: 26, gender: 'male' };
const person2 = { name: '田中', age: 19, gender: 'male' };
const person3 = { name: '鈴木', age: 33, gender: 'female' };
const person4 = { name: '高橋', age: 15, gender: 'female' };

for...of 文を使って、この配列の中の1人ずつを順番に取り出し、2種類の条件で入場可能かどうかを判定しています。

for (const person of people) {
  // AND条件
  if (person.age >= 20 && person.gender === 'male') {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「AND条件」で入場できます`);
  } else {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「AND条件」で入場できません`);
  }

  // OR条件
  if (person.age >= 20 || person.gender === 'male') {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「OR条件」で入場できます`);
  } else {
    console.log(`${person.name}さん（${person.age}歳, ${person.gender}）は「OR条件」で入場できません`);
  }

  console.log('-------------------------');
}