日期:2024年10月18日

运算符(2)

一元运算符(Unary operators)

一元运算符指只有一个操作数的运算符。

符号作用示例
+正号,不会改变数字的正副+10
负号,会将一个数字符号取反-10
delete删除变量或属性delete a 或 delete o.name
typeof检查一个值的类型typeof 123

一元的+,实际上就是数学中的正号。对一个数字加个正号不会对数字产生任何的影响,对于一个非数字的值加正号会将其转换为数字。

一元的-,也就是数学中的负号。它会导致一个数字的符号位取反,正号变负号,负号变正号,其他特点和一元的+是一样的。

delete用来删除一个变量或是对象中的属性,删除以后变量和属性将会消失,但是注意常量是删不了的。

typeof用来检查一个值的类型,它会返回一个描述被检查值的类型的字符串来说明其类型。返回值情况有以下几种:

类型返回值
未定义(Undefined)“undefined”
空值(Null)“object”
布尔值(Boolean)“boolean”
数值(Number)“number”
大整数(BigInt)“bigint”
字符串(String)“string”
函数(Function)“function”
其他对象(Object)“object”
Symbol“symbol”

赋值运算符(Assignment operators)

最典型的赋值运算符就是等号,通过赋值运算符可以用来修改变量的值。除了等号以外在JS中还提供了很多其他的赋值运算符号,这里只是简单罗列一下不再详细说明。另外这里的所有操作都属于该变量,调用后变量的值即发生变化。

符号作用示例
=将右侧值赋值给左侧变量a = 10
+=对左侧变量增加指定的值a += 10 等价于 a = a + 10
-=对左侧变量减少指定的值a -= 10 等价于 a = a – 10
*=对左侧变量乘指定的值a *= 10 等价于 a = a * 10
/=对左侧的变量除以指定值a /= 10 等价于 a = a / 10
%=对左侧变量%以指定值a %= 10 等价于 a = a % 10
**=对左侧变量取指定幂数a **= 10 等价于 a = a ** 10

关系运算符(Relational operators)

关系运算符用来比较两个值间的大小关系,如果关系成立会返回true,如果关系不成立会返回false。

符号作用示例
<检查一个值是否大于另一个值10 < 5
>检查一个值是否小于另一个值10 > 5
<=检查一个值是否大于或等于另一个值10 <= 5
>=检查一个值是否大于或等于另一个值10 >= 5

这种玩意儿和数学中的规则一模一样,所以常规情况不再赘述。

特殊情况就是非数字的情况,比如true > false要如何处理。大部分情况下,如果对一个非数字的值进行这种大于小于比较时会自动转换为数字然后比较,所以true > false的结果和1 > 0是相同的,最后结果会返回true。

还有一个特殊情况就是两个字符串比较的情况,比较两个字符串时,不会转换为数字进行比较而是逐位的比较每一个字符的编码。比如:’abd’ > ‘abc’,实际上会比较它们的Unicode编码,本例中,会先比较两个字符串中第一个字母a和a的编码大小,如果能比较出结果,就不会再看后边的编码,如果比不出来,则继续比较第二个字母b和b的字符编码,有结果不比了,没有结果,继续比较第三个字母d和c的字符编码,以此类推。

a的编码是97,b的是98,c的是99,d的是100,所以比较两个字符串实际上是这样比的a(97)b(98)d(100)> a(97)b(98)d(99)。第一位a,97和97相等,继续看第二位b,98和98相等,再看第三位d和c,d是100,c是99,100大于99,成立返回true,所以’abd’ > ‘abc’ 会返回true。

结果

这里又一个问题需要注意如果要比较数字类型的字符串比如”14″ > “4”,此时比较的依然是字符编码,由于1的编码小于4的编码所以这个判断会返回false。这个问题一定要注意,比较两个字符串时确定一下你是否真的相比较它们的字符编码。

结果

利用这个特性可以通过比较两个字符串的大小来将字符串按照字母顺序排序,但是对于汉字来说作用就不太明显了。在Unicode编码表中,中文是按照偏旁部首进行排序的,所以比较时不一定能达到的预期。

相等运算符(Equality operators)

符号作用示例
==比较两个值是否相等1 == 1
!=比较两个值是否不等1 != 1
===比较两个值是否全等1 === 1
!==比较两个值是否不全等1 !== 1

相等运算符,顾名思义用来比较两个值是否相等,如果相等返回true否则返回false。比如:1 == 1 会返回true,5 == 6 会返回false。’hello’ == ‘hello’ 也会返回true。但是对于JS来讲这些东西都会非常好理解。但是JS中最奇特的点就在于不同类型之间的比较,也就是类似于 1 == true 会如果比较呢?

对不同类型的值进行相等比较时,浏览器(JS解析器)会自动将其转换为相同的类型然后进行比较。所以1和true的类型不同,所以浏览器会先将它们转换为相同类型,转换为什么类型呢?通常会转换为数值然后比较,这里会将true转换为1,然后再和1进行比较,所以结果为true。

即使比较双方中没有数字,也会转换为数字进行比较。

布尔值true和字符串’true’进行比较时,true会转换为1,’true’会转换为NaN,所以结果为false。布尔值true和字符串’1’进行比较时,两个值都会转换为1,所以会返回true。

几种特殊情况:

null不会被转换为数字比较:

null和undefined相等比较时返回true:

NaN和NaN不相等:

比较对象时比较的是对象的内存地址:

!=表示不相等,用来检查两个值是否不等,同样也会做自动的类型转换,不细说了,直接看个案例。

1 != 1 // false
1 != ‘1’ // false 类型不同会进行类型转换
1 != 2 // true
null != undefined // false
NaN != NaN // true

=== 表示全等运算,!==表示不全等,和相等的区别在于全等不会进行自动的类型转换,两个值类型不同直接认为它们不全等,不会转换为相同的类型比较。自己试试吧。

逻辑运算符(Logical operators)

符号作用示例
!非运算,对当前值进行取反操作!true
&&与运算,两个值都为true则返回truetrue && false
||或运算,两个值有true则返回truetrue || false

逻辑运算主要用来进行逻辑判断,其中!表示非运算,即直接对布尔值进行取反操作,true变false,false变true。

由于逻辑运算也可以对非布尔值进行,所以更加通用的描述是:如果该值可以被转换true,则返回false。如果该值可以被转换为false,则返回true。

例如:!1,1如果转换为布尔值应该为true,所以!1会返回false。!’hello’,’hello’如果转换为布尔值应该为false,所以!’hello’会返回false。!null,null转换为布尔值是false,所以!null会转换为true。

看到这你可能会觉得有一点奇怪,所以需要建立一个概念,JS中的值可以进行互相转换,一个字符串可以转换为数值也可以转换为布尔值。换句话说所有的值在某些情况下都可以转换为布尔值。有的值会转换为true,有的值会转换为false。

会转换为false的情况:
0、-0、null、false、NaN、undefined、空字符串(””)都会转换为false

会转换为true的情况:
任意对象、数组、非空字符串(即使是字符串”false”)都会转换为true

所以对一个值做非运算时,如果它的值是true,取反后就变成false。如果它的值是false,取反后就变成的了true。

我们也可以对一个值进行去两次反,来将其转换为布尔值。

&&表示与运算,与运算需要两个值,当两个值都为true的时候,会返回true,否则返回false。

同样由于可以对非布尔使用,它还有一个更加通用的描述是:参与与运算的两个值中,如果第一个值可以转换为true,则返回第二个值,否则返回第一个。

主要看第一个值

||表示或运算,或运算也是需要两个值,两个值中有一个为true,则返回true,否则返回false。

对于非布尔值,更加通用的描述是:参与运算的两个值中,如果第一个值可以转换为true,则返回第一个值,否则返回第二个值。

条件运算符(Conditional operator)

条件表达式?语句1:语句2

条件运算符也被称为三元运算符。条件运算符需要三个值。第一个值被称为条件表达式,第二个和第三个值是一个语句。两个语句(语句1和语句2)只会执行其中一个,最终那个会执行有条件表达式的结果决定,如果条件表达式的结果为true,则执行语句1,结果为false,则执行语句2。

10 > 20 ? '10比20大' : '20比10大'

上例中10 > 20即是条件表达式,每一个条件表达式都会被转换为一个布尔值。10 > 20的运算结果为false,所以会执行表达式2,也就是字符串’20比10大’。需要注意的是如果你的表达式最终返回的值不是一个布尔值,浏览器也会将其转换为布尔值,然后判断。

0 0 投票数
文章评分
订阅评论
提醒
guest

0 评论
内联反馈
查看所有评论
0
希望看到您的想法,请您发表评论x