icon
icon

JavaScriptの論理演算子「&&」「||」「!」の使い方を現役エンジニアが解説【初心者向け】

初心者向けにJavaScriptの論理演算子「&&」「||」「!」の使い方について現役エンジニアが解説しています。論理演算子はif文などで使用し、&&は論理積で両方の条件を満たすか、||は論理和でどちらかが満たすか、!は否定を意味します。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日  調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名  調査手法:インターネット調査

JavaScriptの論理演算子「&&」「||」「!」の使い方について、TechAcademyのメンター(現役エンジニア)が実際のコードを使って初心者向けに解説します。

 

JavaScriptについてそもそもよく分からないという方は、JavaScriptとは何なのか解説した記事をみてみましょう。

なお本記事は、TechAcademyのオンラインブートキャンプJavaScript/jQuery講座の内容をもとにしています。

 
なお、今回の記事の内容は動画でもご覧いただけます。

テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。

 
 

 

田島悠介

今回は、JavaScriptに関する内容だね!

大石ゆかり

どういう内容でしょうか?

田島悠介

JavaScriptの論理演算子「&&」「||」「!」の使い方について詳しく説明していくね!

大石ゆかり

お願いします!

JavaScriptに限らず、論理演算子は、ifで条件分岐する場合など非常に重要な意味を持ちます。

そこで、本記事では、JavaScriptの論理演算子「&&」「||」「!」の使い方を現役エンジニアが解説いたします。

目次

 

論理演算子とは

論理演算子とは、「命題」や「集合」などの論理演算をするためのものです。

プログラミングでは、if文の条件判定によく使うものであり、真(true)または偽(false)を判定することができます。

四則演算の演算子( + や – など )に相当します。

 

例えば、条件Aと条件Bがあった場合、以下のような条件判定が可能です。

  • A && B は、「AとBが両方成立する必要がある」(AND演算)
  • A || B は、「AまたはBのどちらかが成立すればOK」(OR演算)
  • !A は、「A以外なら何でもOK」(NOT演算)

[PR] フロントエンドで副業する学習方法を動画で公開中

論理演算子の使い方

論理演算の基本は、下記の3通りで、ベン図を使うことで意味をわかりやすく理解できます。

  • 論理積
  • 論理和
  • 否定

集合とド・モルガンの法則

ド・モルガンの法則は、JavaScriptにおける論理演算にそのまま応用することができます。

以下のif文条件判定は等価です。

if( !(A || B) ) // ケース1 : 「 A または B 」でない
if( !A && !B ) // ケース2 : 「 A でない 」かつ「 B でない 」

if…else文での論理演算子の使い方

実際に条件ABの成立の方法をif文で場合分けするプログラムを見てみましょう。

JavaScript

// 3通りのオブジェクト型データ(仕事)
// 条件A:儲かる。 条件B:楽。
var job_a = { moukaru : true , raku : true };
var job_b = { moukaru : true , raku : false };
var job_c = { moukaru : false , raku : false };

// 3通りのデータをそれぞれ条件判定するためのメソッド
function sigotoSagashi( job ) {
  if( job.moukaru && job.raku ){
    console.log("A かつ B の場合、最高です!");
  } else if( job.moukaru || job.raku ){
    console.log("A または B なら、はたらきたいです!");
  } else if( !job.moukaru && !job.raku ){
    console.log("どちらも満たさないのはいやです!");
  }
}

// 実際のメソッド実行部分
sigotoSagashi( job_a );
sigotoSagashi( job_b );
sigotoSagashi( job_c );

実行結果

A かつ B の場合、最高です!
A または B なら、はたらきたいです!
どちらも満たさないのはいやです!

まとめ

JavaScriptの論理演算子を使いこなすことで、複雑な業務処理もプログラミングで実現できます。

ぜひマスターして有効に活用していきましょう。

 

執筆してくれたメンター

寺谷 文宏

Webアプリケーションエンジニアとして数多くのプロジェクトを経験し、フロントエンドからサーバーサイドまで総合的な開発を得意としています。

TechAcademyではフロントエンド、Javaコースを担当。

 

大石ゆかり

JavaScriptの論理演算子「&&」「||」「!」の使い方の使い方がよくわかったので、良かったです!

田島悠介

ゆかりちゃん、これからも分からないことがあったら質問してね!

大石ゆかり

分かりました。ありがとうございます!

 

TechAcademyでは、初心者でも、JavaScript・jQueryを使ったWebサービス公開を習得できるオンラインブートキャンプを開催しています。

また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。