オペレーター
演算子は演算子とも呼ばれ、割り当て、比較を実装し、算術演算を実行するために使用されます。
javascriptの一般的な演算子
- 算術演算子
- 比較演算子
- 論理演算子
- 代入演算子
- インクリメントおよびデクリメント演算子
算術演算子
2つの変数または値に対して算術演算を実行するために使用されます
<script>
// 算数运算符包括加减乘除 取余等等
console.log(1 + 1);
console.log(2 - 1);
console.log(1 * 6);
console.log(6 / 3);
console.log(6 % 3);
// 在算数运算符中 浮点数的精度会产生细微的差距，不要拿两个浮点数相比较
console.log(0.1 + 0.2);
console.log(0.7 * 100);
console.log(0.1 + 0.2 == 0.3)
</script>
予防
- jsでは、2つの浮動小数点数を直接比較することはできません
- jsの演算の順序では、乗算と除算が最初に計算され、次に加算と減算が計算され、括弧が最初に計算されます。
数が割り切れるかどうかを判断する方法は？
余数为0 说明这个数可以被整除
式
数値の演算子識別子で構成される式は、式と呼ばれます
戻り値
式は最終的に結果を返します。この結果は戻り値と呼ばれます。
var num = 1 + 1
上述代码中，这样的式子便叫做表达式，右边的公式计算完毕后有一个返回值，这个返回值赋值给左边的num
単項演算子
単項演算子は、プレタイプとポストポジションタイプに分けられます。これらは主に変数のインクリメントおよびデクリメント操作を実現するために使用され、変数と組み合わせて使用する必要があります。
前置詞演算子
事前入力演算子は、最初にインクリメント（デクリメント）してから操作を実行します
プレインクリメント演算子：最初にインクリメントしてから、操作を実行します
<script>
//前置型运算符 先自增（自减） 再进行运算
var num = 10;
++num;
console.log('num的值：', num) //11
var num2 = ++num + 5;
console.log('num2的值：', num2) //17
</script>
事前デクリメント演算子：最初にデクリメントしてから、操作を実行します
<script>
//前置自减运算符
var num = 20;
--num;
console.log('num的值：', num); //19
var num2 = --num + 5;
console.log('num2的值', num2); //23
</script>
ポスト演算子
最初に元の値を計算してから、インクリメントまたはデクリメント操作を実行します
ポストインクリメント演算子：最初に元の値を計算し、次にxiを自動インクリメントします
<script>
//后置型自增运算符 先原值运算，再自加
var num = 2;
num++;
console.log('num的值：', num); //3
var num2 = num++ + 2;
console.log('num2的值：', num2) //5
var num3 = num++ + 1;
console.log('num3的值：', num3) //5
</script>
ポストデクリメント演算子：最初に元の値を計算してから、デクリメントします
<script>
//后置自减运算符 进行原值计算 再自增
var num = 6;
num--;
console.log('num的值:', num); //5
var num2 = num-- + 1;
console.log('num2的值为:', num2); //6
var num3 = num-- + 1;
console.log('num3的值：', num3); //5
</script>
単項演算子の包括的な演習
<script>
//第一题
var a = 5;
++a;
var b = ++a + 6;
console.log('b的值:', b); //13
//第二题
var c = 10;
c++;
var d = c++ + 2;
console.log('d的值:', d); //13
// 第三题
var e = 10;
var f = e++ + ++e; //首先e++是10 然后自增1 于是++e变成12 所以值为22=10+12
console.log('f的值:', f) //22
</script>
単項演算子の要約
- 単項演算子は、主に変数に自己インクリメントまたは自己デクリメント操作を実現させるために、コード操作を単純化することです。
- 単独で使用しても違いはありません
- 事前インクリメント演算子と事前デクリメント演算子：最初にインクリメント（デクリメント）してから計算します
- ポストインクリメント演算子とポストインクリメント演算子：最初に元の値を操作してから、増加（減少）します。
- 実際の開発プロセスでは、より多くのポスト演算子が使用されます
比較演算子
比較演算子（関係演算子）は、主に2つのデータ演算子を比較するために使用され、比較演算の結果としてブール値を返します。
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
//比较运算符 是用来进行两个数据的比较所使用的运算符 得出的结果为布尔值
console.log(5 > 3) //true
console.log(6 < 7) //true
console.log(6 >= 5); //true 解析：因为6大于5 所以正确
console.log(7 <= 8); //true 解析：因为7小于8 所以正确
console.log(8 == '8') //true 解析：比较值而不比较数据类型
console.log(8 != 9); //true
console.log(8 !== 8) //false
console.log(8==="8") //false 解析：===要求数据类型和值都相等
</script>
</head>
論理演算子
論理演算子はブール演算を実行するために使用される演算子であり、結果もブール値です。実際の開発では、主に複数の条件を判断するために使用されます。
<script >
/*
* 逻辑运算符：是用来比较布尔值运算的运算符，其结果也是布尔值，开发中常用于多重条件的判断
*/
console.log(5 > 3 && 3 < 5); //true
console.log(5 < 3 && 3 < 7); //false
console.log(5 < 7 || 5 < 3); //true
console.log(5 < 7 && 5 < 3) //false
console.log(!true) //false
console.log(!false) //true
</script>
論理演算子の要約
- &&：両側が真の場合、結果は真になり、両側に偽があり、結果も偽になります
- ||：両側が偽の場合、結果は偽になります。両側に真がある場合、結果も真になります。
- ！：否定！trueの結果はfalseです
論理演算子の要約
<script>
var num = 7;
var str = "我爱你，亲爱的中国"
console.log(num > 5 && num <= str.length) //true
console.log(num < 5 && num <= str.length) //false
console.log(!(str.length > 11)) //true
console.log(!(num > 5 || str.length == num)) //fase
</script>
短絡効果
複数の式（値）がある場合、左側の式の値が判別できれば、右側の式の値演算は実行されません。
論理割り込みの論理積
<script>
console.log(234 && 456); //456
console.log(0 && 440) //0
console.log('' && 254 && 546); //""
</script>
論理割り込みの論理OR
構文：式1 ||式2
- 式1が真の場合、式1の値を返します。
- 式1がfalseの場合、式2の値を返します（論理ANDと比較できます）。
<script>
console.log(234 || 456); //234
console.log(0 || 440) // 440
console.log('' || 254 || 546); //254
</script>
代入演算子
変数にデータを割り当てる演算子。代入演算子と呼ばれます。
<script>
var num = 20;
num += 5;
console.log(num); //25
var num2 = 6;
num2 *= 6;
console.log(num2) //36
var num4 = 20;
num4 %= 4;
console.log(num4) //0
</script>
演算子の優先順位
- 単項演算子！優先度が高い
- 論理積が論理積よりも大きい
オペレーターシーケンスの演習（1）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>练习1</title>
</head>
<body>
</body>
<script>
console.log(4 >= 6 || '人' != '阿凡达' && !(12 * 2 == 144) && true)
/*
解析：4 >= 6 || '人' != '阿凡达' && true && true
false|| true && true && true
true
结果：true
*/
var num = 10;
console.log(5 == num / 2 && (2 + 2 * num).toString() === '22')
/*
* 解析：5==num/2&&(2+2*num).toString()==='22'
5==num/2&&'22'==='22'
5==5&&'22'==='22'
true
结果：true
*/
</script>
</html>
オペレーターシーケンスの演習（2）
<script>
var a = 3 > 5 && 2 < 7 && 3 == 4;
console.log(a)
/*
解析：a=false && true && false
结果：a= false
*/
var b = 3 <= 4 || 3 > 1 || 3 != 2
console.log(b);
/*
解析：b= 3 <= 4 || 3 > 1 || 3 != 2
b= 3 <= 4 || 3 > 1 || true
b= true || true || true
结果：true
*/
var c = 2 === "2"
console.log(c);
/*
解析：=== 用来比较数据类型和值是否相等 所以为false
*/
var d = !c || b && a;
console.log(d)
/* 解析： d = !c ||b && a;
d = true||b && a;
d = true||true && false;
d= true
结果为true
*/
</script>
フロー制御ステートメント
簡単に言えば、制御コードシーケンスが異なる構造シーケンスで実行されることを意味します
フロー制御ステートメント：シーケンス構造ブランチ構造ループ構造
フロー制御ステートメントのシーケンス構造
javascriptでは、コードの実行順序は上から下に順番に実行され、この実行順序は順次構造と呼ばれます。
分岐構造
コードを上から下に実行する際、さまざまなパスのコードがさまざまな条件に従って実行され、さまざまな結果が得られます。
2つのブランチ構造がjavascriptで提供されています
- ifステートメント
- switchステートメント
ifステートメント
文法
if(条件表达式) {
//执行的语句
}
注：条件式がtrueの場合、ステートメントは実行されます。条件式がfalseの場合、ステートメントは実行されません。
<script>
if(true) {
console.log('条件表达式为真，则执行语句');
}
if(false) {
console.log('条件表达式为假，则不执行语句');
}
</script>
二重分岐ステートメントの場合
文法
if(条件表达式) {
//执行的语句
}else {
//执行的语句
}
予防
- ifおよびelseの1つのステートメントのみを実行できます
- 他に何もない{}
ifダブルブランチステートメントのインターネットカフェケース
要求：弹出一个输入框，用户输入自己的年龄，如果大于等于18岁，提示可以进入网吧，如果小于18，则提示用户不能进入网吧
アイデアは次のとおりです
- 1.入力ボックスをポップアップし、ユーザーが入力した値を変数として保存します
- 2. if文を使用して判断を下し、ユーザーの年齢に応じて異なる文を実行します。
<script>
var userName = Number(prompt("请输入年龄")); //Number（）:将字符串类型转换成Number类型
if (userName >= 18) {
alert("恭喜你，可以进入网吧")
} else {
alert("对不起，你不能进入网吧")
}
</script>
二分岐ステートメントがうるう年と平年かどうかの判断
提示：能被4整除且不能整除100的为闰年（如2004年就是闰年，1901年不是闰年）或者能够被 400 整除的就是闰年
アイデアは次のとおりです
- 1.ユーザーは年を入力し、ユーザーが入力した値を変数の形式で保存します
- 2. ifステートメントを使用して、さまざまな条件に従ってうるう年と通常の年を判断します
<script>
var userName = Number(prompt("请输入年份"));
if (userName % 4 == 0 && userName % 100 != 0 || userName % 400 == 0) {
alert("闰年")
} else {
alert('平年')
}
</script>
マルチブランチステートメントの場合
シナリオ：複数の条件の判断に適用可能
if(条件表达式1) {
语句1；
}else if(条件表达式2) {
语句2；
}else if(条件表达式3) {
语句3；
.....
}else {
//以上代码不成立执行此处代码
}
予防
- さまざまな条件に応じて、さまざまなコードパスが実行され、最終結果が得られます。これは、複数を選択するプロセスです。
- else ifの後に条件式が追加され、elseの後に条件式がない
ifマルチブランチステートメントの達成事例
<script>
var source = Number(prompt("请输入分数"))
if (source >= 90) {
alert('A')
} else if (source >= 80) {
alert('B')
} else if (source >= 70) {
alert('C')
} else if (source >= 60) {
alert("D")
} else {
alert('E')
}
</script>
三項式
三項式は、いくつかの簡単な条件付き判断を行うことができます。三項演算子で構成される式は、三項式と呼ばれます。
構文は次のとおりです
条件式？式1：式2条件式がtrueの場合、式1の値を返し、条件式がfalseの場合、式2の値を返します。
三元式0の補集合
三項式を使用する必要があります
アイデアは次のとおりです
- 1.入力ボックスがポップアップし、ユーザーは0から59までの数字を入力します
- 2.0〜9の数字の前に0を追加し、10より大きい数字には何もしません。
- 3.変数を使用して、戻り値と出力を受け入れます（プログラム内で処理されます）
<script>
var userName = Number(prompt("请输入1~59之间的数字"))
var result = userName <= 9 ? '0' + userName : userName;
alert(result)
</script>
switchステートメント
switchステートメントはマルチブランチステートメントであり、さまざまな条件ステートメントを実行してさまざまな結果を取得することは、1つを選択するプロセスです。
予防
- ifマルチブランチステートメントは判断にのみ使用され、switchステートメントは主に特定の値のマッチングに適しています
- スイッチ：スイッチ。ケース：オプション。
- switchステートメントの後の変数の値がcaseの後の値と一致する場合、caseの後のステートメントが実行されます
- 値が一致しない場合は、デフォルトに従ってステートメントを実行します
- switchステートメントの後の式は変数です。
- ブレークを書くことを忘れないでください、さもなければそれは常に実行されます。
switchステートメントのフルーツケース
要件：ユーザーが必要な果物を入力すると、果物の価格が画面に表示されます。
アイデアは次のとおりです
- 入力ボックスがポップアップし、ユーザーは希望する果物を必要としています
- ユーザーが入力した値を変数の形式で保存します。切り替え後の条件式の値がケース後の値と一致すると、対応する果物の価格がポップアップ表示されます。
- 中断することを忘れないでください。そうしないと、プログラムは実行を継続します。
<script>
var fruit = prompt('请输入需要的水果');
switch (fruit) {
case "苹果":
alert("苹果3.5/斤");
break;
case "香蕉":
alert("香蕉5.5/斤");
break;
case "榴莲":
alert("榴莲10.5/斤");
break;
default:
alert("找不到此水果")
}
</script>
switchステートメントとifelseifステートメントの違い
- スイッチは特定の値のマッチングに使用され、ifelseステートメントは条件付きの判断に使用されます
- スイッチが値を決定した後、プログラムに直接実行され、ifステートメントを順番に判断する必要があります（実行効率はわずかに低くなります）
- ブランチが少ない場合は、ifelseを使用する方が効率的です