Day.14 「基础打稳了,就能走得更长久~」 —— JavaScript 基础运算子

「让 Javascript 帮你算数比较~」 —— JavaScript 基础运算子

学习任何东西,都要把基础学的扎实,基础稳了,遇到问题就能迎刃而解。
而学习程序语言的基础就是数学逻辑,不用到很专精,只要有基础数学逻辑,多写多做就能锻链出写程序逻辑的金鱼脑,基础逻辑打稳了,任何程序语言都有相似的地方,会越学越快,然後发现根本是无底洞,没有尽头

算数运算子

就如同我们国小上课一样,算数就要先从 加、减、乘、除 的基础开始教起,而运算先後顺序就如同我们国中所学的,先乘除後加减有括号先算括号,这对聪明的你来说,实在是小 case!

运算符 说明 运算符 说明
+ 加法 ++ 自增
- 减法 -- 自减
* 乘法 ** 次方
/ 除法 % 余数

一元运算符

前面变数转型那一篇有稍微提到使用 + 的一元运算符,来为变数转型成数字型别
而使用 - 的一元运算符,聪明的你,一定马上就猜出来,是把型别变成数字型别的相反数
typeof 本身也是一元运算符,是用来判断型别的。

字串串接

利用 + 运算符,可以进行字串串接,当 + 两边其中一边为字串(string)型态时,Javascript 会自动帮我们把两边的转型成字串型态,并进行串接。

let a = 10;
let b = '10';
let c;
console.log( a + b ); // "1010"
console.log( b + c ); // "10undefined"

自增 与 自减

++-- 可以对自己数字 增加 1减少 1
放在变数前後的位置很重要!
当运算符在前面时 ++a当下为变数更改後的数值,想像已经先 +1
当运算符在後面时 a++当下为变数的原本数值,想像已经先赋值还来不及 +1

let a = 10;
let b = a++; // b = 10
let c = 10;
let d = ++c; // d = 11

console.log(a, b, c, d) // 11, 10, 11, 11

逻辑运算子

运算符 说明 判断中断规则 返回值
! 非(not) 返回与原本布林值相反的值
&& 和(and) 如果左侧为 false,则不判断右侧值 如果左侧为 false,返回左侧,反之亦然
∣∣ 或(or) 如果左侧为 true,则不判断右侧值 如果左侧为 false,返回右侧,反之亦然

藉由 Javascript 任何型别都能转换成布林值,会先转换成布林值再进行逻辑判断。
如果是使用 ! 返回的会是布林值,而 &&∣∣ 返回的是原本的值。

let a = 123;
let b = 'abc';
let c = null;
let d;
console.log( a && b ); // "abc"     左侧为 ture ,返回右侧值
console.log( a || b ); // 123        左侧为 ture ,判断中断,直接返回左侧值
console.log( c && b ); // null       左侧为 false,判断中断,直接返回左侧值
console.log( c || b ); // "abc"      左侧为 false,返回右侧值
console.log( c && d ); // null       左侧为 false,判断中断,直接返回左侧值
console.log( c || d ); // undefined  左侧为 false,返回右侧值

赋值运算子

运算符 说明
= 最基本的赋值
+= a = a + 2a += 2 一样
-= a = a - 2a -= 2 一样
*= a = a * 2a *= 2 一样
/= a = a / 2a /= 2 一样
%= a = a % 2a %= 2 一样

最基础的 = 就是赋值语句,把右侧的值,赋值给左侧的变数。
= 左侧添加算术运算子,能有效把原本比较长的运算式简化。

比较运算子

运算符 说明
> 是否大於
< 是否小於
>= 是否大於等於
<= 是否小於等於
== 是否相等
!= 是否不相等
=== 是否全等
!== 是否不全等

用来进行比较的运算子,就跟数学课的比大小一样。
比较运算子会对两侧值进行比对,返回的会是布林值。

1 > 2;       // false
1 < 2;       // true
1 <= 1;      // true

== 相等 与 === 全等 的差别

简单来说,== 比较时 Javascript 会自动帮你转型进行比对,而 === 则是进行严格比对,不会自动转型。

1 == "1";    // true
1 === "1";   // false
1 != "1";    // false
1 !== "1";   // true
false == 0;  // true

比较运算子中的特例! NaN

在所有型别中,数字型别的 NaN 非常特别,NaN 不管跟谁比对,都是回传 false,包括他跟自己比对也是。

NaN == NaN;  // false
NaN != NaN;  // true

总结

一开始我也以为逻辑运算子返回的都是布林值,但实际返回的并不一定是布林值,因为这个特性,让我们在撰写 Javascript 会更加弹性好运用来取得我们所想要的值。
我们现在已学会了基本的宣告变数基础型别,也学会了基础的运算子,接着我们就能利用目前所学的东西,来学习如何让程序语言帮我进行条件判断!下一个章节就来介绍条件判断式

参考资料


<<:  [2021铁人赛 Day08] General Skills 05

>>:  Day 23 - 前端开发工具 - HBuilder X

全端入门Day11_全端之IDE环境尾篇

昨天介绍了什麽是IDE,今天就要介绍我常用的IDE了 IDE大比较 1. Visual Studio...

从零开始学3D游戏设计:游戏资料储存基础

这是 Roblox 从零开始系列,游戏资料章节的第一个单元,你将会学习如何进行游戏资料的储存 【Yo...

Day 5 - 建立测试计画

出於书本 Chapter 3. Developing Your Ethical Hacking Pl...

c++ 打包执行档

linux中:使用cmake,把编译生成全部放入out文件夹,然後这个就是没有源码的linux执行包...

NETGEAR WIFI EXTENDER SETUP

When we talk of Netgear WiFi Extender Setup , our ...