Skip to content
This page has been auto-translated and may contain errors.View in English

演算子と比較

docs.scrimba.com

ショッピングカートを追跡していると想像してください。価格を合計し、割引を適用し、合計額が送料無料の基準を超えているかを確認し、カートが空の場合に警告を表示するかどうかを判断します。これらの各ステップは演算子が機能しています:1つまたは2つの値を取り、新しい値を生成する記号です。この章では、数値の算術演算から値を比較し、真偽値のテストを組み合わせるまで、常に使用する演算子について説明します。

算術と代入

**算術演算子**は、既に知っている数学を実行します:+は足し算、-は引き算、*は掛け算、/は割り算です。もう1つあります。%は剰余演算子で、割り算の後に残ったものを与えてくれます。

js
const total = 8 + 5; // 13
const change = 20 - 13; // 7
const leftover = 17 % 5; // 2、5は17に3回入って2が残るため
console.log(total); // 13

値をそれ自身に基づいて更新したい場合、省略記法があります。score = score + 10の代わりに、score += 10と書くことができます。同じ意味です:現在の値を取得し、10を加え、結果を保存します。

js
let score = 100;
score += 10; // scoreは110になります
score -= 30; // scoreは80になります
console.log(score); // 80

そして数値を正確に1だけ上下に移動するには、++--が1つのステップで実行します。count++は1を加え、count--は1を引きます。

js
let lives = 3;
lives--; // livesは2になります
console.log(lives); // 2

**算術演算子**は+-*/%です。最初の4つは馴染みがあります。%が2番目の見方の価値があります。割り算の剰余を返します。これは「これは均等に割り切れるか?」チェックと、範囲内で値を折り返すための標準的なツールです。

js
const isEven = 10 % 2; // 0、つまり10は偶数
const isOdd = 7 % 2; // 1、つまり7は奇数
console.log(isEven); // 0

値をそれ自身から更新することは一般的であり、省略記法があります。各算術演算子は=と対になり、複合代入を形成します:+=-=*=/=%=。したがって、price *= 1.2は「priceに1.2を掛けて保存する」と読めます。price = price * 1.2を書く必要はありません。

js
let price = 40;
price *= 1.2; // 20パーセント追加、priceは48になります
price -= 8; // priceは40になります
console.log(price); // 40

正確に1の変化の場合、++--は現在地でインクリメントとデクリメントします。カウンターをステップするときにきれいに読め、常に見られます。

js
let attempts = 0;
attempts++; // attemptsは1になります
console.log(attempts); // 1

**算術演算子**は基本的な4つについてはほとんど驚きを持ちませんが、%+のオーバーロードが本当に注意を払う価値があります。剰余演算子%は整数スタイルの除算後に残ったものを返し、左被演算子の符号を保持します:-7 % 32ではなく-1です。これは数学的なモジュロを期待する人を混乱させます。これは除数テストと、インデックスを範囲内に折り返すためのツールです。

js
const remainder = 17 % 5; // 2
const negative = -7 % 3; // -1、符号は左被演算子に従う
console.log(negative); // -1

+演算子はオーバーロードされます:2つの数値の場合は加算されますが、どちらかが文字列の場合は連結され、もう一方を文字列に強制します。その単一のルールは、驚きの全体のクラスの背後にあるため、追加する前に持っているものに名前を付けてください。

js
const sum = 5 + 3; // 8
const glued = "5" + 3; // "53"、3は文字列になりました
console.log(glued); // 53

複合代入(+=-=*=/=%=)はバインディングをそれ自身から更新する慣用的な方法であり、同じ+のオーバーロードを継承します:msg += countcountを文字列化します。インクリメントとデクリメント演算子++--は、式が返す値が異なるプレフィックスとポストフィックス形式で提供されます:x++は古い値に評価され、その後インクリメントされます。++xはインクリメントされてから新しい値に評価されます。式の区別が重要であるため、違いが重要でない独立したステートメントにそれらを保持してください。この方法で再割り当てするものについてはletを使用してください。constバインディングは更新できないためです。

js
let counter = 5;
const before = counter++; // beforeは5、counterは6になります
const after = ++counter; // afterは7、counterは7になります
console.log(`${before} ${after}`); // 5 7
Juno算術と代入 数学演算子は期待される通りで、除算の後の剰余のために%を加えます。値をそれ自身から更新するときは、省略記法に達します:score = score + 10の代わりにscore += 10。そして++または--は数値を1だけ上下に押し上げます。これらを信頼するのに少し時間がかかりましたが、それらは短く書かれた同じ数学です。
Juno算術と代入 5つの算術演算子、そして%の剰余は除数テストでその価値を獲得します。price *= 1.2のような複合代入は、値をそれ自身から1つの動きで更新し、++または--は1ステップします。この方法で更新することを計画しているものについてはletを使用してください。constは再割り当てできないためです。
Juno算術と代入 2つのことをシャープに保ちます:%は左被演算子の符号を保持するため、-7 % 3-1で、+はどちらかが文字列の瞬間に連結されます。プレフィックス対ポストフィックス++は異なる値を返すため、それが重要でない独立したステートメントにそれらを保持してください。算術演算子の残りは正確に予想どおりに動作します。

比較

**比較**は2つの値について質問をし、trueまたはfalseで答えます。これらの真偽の答えはブール値で、プログラムが後で決定を下すために使用するものです。

最も使用する比較は===で、これは「これら2つは正確に等しいか?」と問いかけます。

js
const answer = 42;
console.log(answer === 42); // true
console.log(answer === 7); // false

その反対は!==で、「これら2つは異なるか?」と問いかけます。そして順序については<><=>=があり、数学と同じように機能します:未満、より大きい、以下、以上。

js
const age = 18;
console.log(age >= 18); // true
console.log(age !== 21); // true

===で比較します。==は決して使いません。ダブルイコール版は人々を驚かせるニュアンスを持っており、トリプルイコール版は毎回予想通りにできます。

**比較**は2つの値を取り、ブール値のtrueまたはfalseを返します。そのブール値は、条件文で書く決定の原材料であるため、比較を正しく取得することが重要です。

等式に===を、不等式に!==を使用してください。順序付けのために<><=>=があります。

js
const stock = 3;
console.log(stock === 0); // false
console.log(stock > 0); // true
console.log(stock <= 5); // true

==ではなく===に到達する理由は、それらが同じ演算子ではないからです。===(厳密な等式)は値と型の両方を比較し、一致する場合にのみtrueを返します。==(緩い等式)は最初に両側を共通の型に変換してから比較し、ほぼ誰も予測しない結果を生成します。

js
console.log(0 == ""); // true、そして滅多にあなたが望むものではない
console.log("1" == 1); // true、文字列は数値になりました
console.log("1" === 1); // false、異なる型

毎回===!==にデフォルト設定します。それらは変換せずに比較するため、変換ルールについて理由を述べる必要はありません。古いコードを読むために==を保存し、新しいコードを書くためにはしません。

**比較**はブール値を返し、演算子は等式(===!==)と関係(<><=>=)の2つのファミリーに分かれます。関係型は数値で単純です。等式型は、JavaScriptが2つを提供するため、実際の決定が住んでいるところです。

===(厳密な等式)は、両被演算子が型と値を共有する場合にのみtrueを返します。変換はありません。==(緩い等式)は抽象等式アルゴリズムを実行し、最初に被演算子を共通の型に強制します。実践的なルールは、古いコードを読めるように知る価値があります:数値と文字列を比較すると、文字列を数値に変換します("1" == 1true)。ブール値から何かを比較すると、ブール値を最初に数値に変換します(true == 1false == 0)。null == undefinedtrueですが、どちらも他には等しくありません。そしてNaNは何とも等しくありません。それ自体ではありません。

js
console.log(0 == ""); // true、""は0になります
console.log("1" == 1); // true、"1"は1になります
console.log(null == undefined); // true、特別なケース
console.log(NaN === NaN); // false、NaNは何とも等しくありません

===!==を使用します。==を読み取り専用知識として扱います。要点は、すべての強制パスを覚えることではなく、それらを回避することです:厳密な等式には強制がないため、その結果は被演算子から直接読まれます。==が言及に値する1つの場所はnull == undefinedチェックで、いくつかのコードベースはnullishの値の両方をキャッチするために意図的に使用しますが、この章の後のnullish演算子はより明確にそのジョブをします。

Juno比較 比較は2つの値についてはい・いいえの質問をし、trueまたはfalseで答えます。等式を確認するには===を使用し、「異なる」場合は!==を、順序については<><=>=を使用してください。===を守り、==をスキップしてください。ダブルバージョンにはサプライズがあり、トリプルバージョンは動作するからです。
Juno比較 すべての比較はあなたに真偽値を与え、これはあなたが次に書く決定の燃料です。===は値と型を一緒にチェックします。==は最初に側を変換し、0 == ""trueであるような珍しい例を生成します。===!==にデフォルト設定して、変換について理由を述べる必要がないようにし、古いコードを読むために==を残します。
Juno比較 厳密な等式は強制なしで型と値を比較するため、その答えは被演算子から直接読まれます。緩い==はあなたの背後で変換アルゴリズムを実行します。これが"1" == 1trueである理由で、NaNは全く何とも等しくありません。===!==を書き、古いコードの強制ルールを読み取り専用知識として保持します。

論理演算子とtruthiness

多くの場合、複数の比較を組み合わせる必要があります。**論理演算子**がそれを行わせます:&&(および)、||(または)、!(ではない)。

&&は両側がtrueの場合にのみtrueです。||は少なくとも1側がtrueの場合にtrueです。!はブール値をその反対にフリップします。

js
const age = 20;
const hasTicket = true;
console.log(age >= 18 && hasTicket); // true、両方ともtrue
console.log(age < 13 || hasTicket); // true、1側で十分
console.log(!hasTicket); // false、フリップされた

truthy and falsyと呼ばれる関連する概念があります。真偽の設定では、JavaScriptは非ブール値の一部を、それらがfalseのように扱います。falsy値はfalse0""(空の文字列)、nullundefined、およびNaNです。他のすべてはtruthyとしてカウントされます。

js
const name = "";
console.log(!name); // true、空の文字列はfalsy

**論理演算子**はブール値を組み合わせます:&&(および)はオペランド両方がtrueの場合にのみtrue||(または)は少なくとも1つがtrueの場合にtrue!(ではない)は単一のブール値を反転します。

js
const loggedIn = true;
const isAdmin = false;
console.log(loggedIn && isAdmin); // false、両方ともtrue必須
console.log(loggedIn || isAdmin); // true、1つで十分
console.log(!isAdmin); // true

演算子は本当のブール値で停止しません。JavaScriptはすべての値をtruthyまたはfalsyにソートするため。falsy セットは短く、覚える価値があります:false0""nullundefined、およびNaN。他のすべてはtruthyで、"0""false"、および任意の空でない文字列を含みます。これにより、!usernameのようなチェックを「ユーザー名が入力されなかった」を意味するように書くことができます。

js
const username = "";
console.log(!username); // true、""はfalsy
console.log(Boolean("hello")); // true、空でない文字列はtruthy

論理演算子&&||!で、重要な洞察は&&||がブール値を返さないということです。それらは短絡する:それぞれ左被演算子を評価し、必要に応じてのみ右を評価し、強制されたtrueまたはfalseではなく、実際の被演算子の1つを返します。

a || baが truthy の場合にaを返し、それ以外の場合はbを返します。a && baが falsy の場合にaを返し、それ以外の場合はbを返します。その動作はfalsy セットを支えます:false0""nullundefined、およびNaNは6つのfalsy値で、他のすべてはtruthyです。

js
const name = "";
const display = name || "Guest"; // "Guest"、""はfalsyため
const label = "太郎" && "active"; // "active"、左がtruthyなので右を返す
console.log(display); // Guest

||デフォルトのトリックには鋭いエッジがあります。これが??(nullish合体)が存在する理由です。||は左側がどのfalsy値であっても後退するため、0 || 1010で、"" || "n/a""n/a"で、0""は保持したい有効な入力でした。??は左側がnullまたはundefinedの場合にのみ後退し、0""を実値として扱います。

js
const count = 0;
console.log(count || 5); // 5、しかし0は実値でした
console.log(count ?? 5); // 0、??はnullまたはundefinedだけを置き換える

条件に基づいて2つの値から選択する必要がある場合、完全な比較に加えて三項condition ? whenTrue : whenFalse)は1行形式です。例えばage >= 18 ? "adult" : "minor"。これはプレビューです。条件文章はそれとifステートメントを完全に説明します。

Juno論理演算子とtruthiness&&は「両方」、||は「どちらか」、!はブール値をフリップします。その上、JavaScriptはいくつかの値を偽のように扱います:false0""nullundefined、およびNaNがfalsyで、他のすべてはtruthyです。これにより!nameは「名前が与えられなかった」を意味します。
Juno論理演算子とtruthiness&&は両側が必要で、||は1つが必要で、!は反転します。すべての値も truthy または falsy のいずれかで、falsy セットは小さく十分に記憶するに足ります:false0""nullundefinedNaN"0""false"は文字列なので、両方ともtruthyです。
Juno論理演算子とtruthiness&&||は短絡して被演算子を返す。ブール値ではないため、name || "Guest"がデフォルトとして機能するのはこのためです。そのデフォルトにはエッジがあります:||はすべてのfalsy値を置き換えるため、0""が保持したい入力である場合は??を使用してください。6つのfalsy値は全体の話なので、セットを学んで、残りは落ちます。

演算子はここからどこに行くか

演算子は言語の動詞です:保存する値を取り、結果と決定に変えます。算術は新しい数値を生成し、比較はブール値を生成し、論理演算子はそれらのブール値を、プログラムが機能するはい・いいえの答えに組み合わせます。

これらのブール値は単独ではあまり機能しません。次のステップは、それらを使用してコードをステアリングし、チェックが成功するとき1つのブランチを実行し、失敗するときは別のブランチを実行します。これは条件文章についてです。ここの値のいずれかが曖昧に感じた場合、データ型章は数値、文字列、ブール値の完全な処理です。