了解JavaScript中的操作符(二)

2024-01-02 14:52:11

前言

? ? ? ? 上一篇文章我们了解了一元操作符、布尔操作符和乘性操作符,这一篇文章讲述加性操作符、关系操作符、相等操作符、条件操作符。

一、加性操作符

? ? ? ? 加性操作符包括加法和减法两种操作符。与数学运算中类似,加性操作符能将两个数值进行加减运算,但除此之外,加性操作符作用在数值类型以外的类型时,会有不同的表现形式。

? ? ? ? 加法

????????下面给出一些加法操作符作用在不同类型值时候的示例。

console.log(10+8)                   //输出18。两个操作数都是数值型,则返回两个操作数的和
console.log('10'+8)                 //输出108。如果其中一个操作数为字符串型,则另一个操作数也将作为字符串,两个操作数做连接操作
console.log('10'+'8')               //输出108。如果两个操作数都为字符串型,两个操作数做连接操作
console.log(null+10)                //输出10。如果其中一个操作数为null,另一个操作数为数值型,则返回另一个操作数
console.log(null+'abc')             //输出nullabc。如果其中一个操作数为null,另一个操作数为字符串型,则将null转化为字符串,与另一个操作数做连接操作
console.log(null+null)             	//输出0。如果两个操作数都为null,则返回0
console.log(undefined+undefined)    //输出NaN。如果两个操作数都为undefined,则返回NaN
console.log(undefined+null)         //输出NaN。如果其中一个操作数为undefined,则返回NaN
console.log(NaN+10)                 //输出NaN。如果其中一个操作数为NaN,则返回NaN
console.log(undefined+10)           //输出NaN。如果其中一个操作数为undefined,则返回NaN
console.log(Infinity+10)           	//输出Infinity。如果Infinity与正数相加,则返回Infinity
console.log(Infinity+Infinity)      //输出Infinity。如果两个Infinity相加,则返回Infinity
console.log(Infinity+(-Infinity))   //输出NaN。如果Infinity与-Infinity相加,则返回NaN
console.log(-Infinity+(-Infinity))  //输出-Infinity。如果-Infinity与-Infinity相加,则返回-Infinity
console.log(Infinity+(-10))         //输出Infinity。如果Infinity与负数相加,则返回Infinity
console.log(Infinity+'10')          //输出Infinity10。如果Infinity与非数值型相加,则将Infinity作为字符串与另一个操作数的字符串值拼接
console.log(10+function(){})        //输出10function(){}。如果其中一个操作数为函数,则将函数字符串化,两个操作数做拼接操作
console.log(10+{})                  //输出10[object Object]。如果其中一个操作数为对象,并且对象中没指定valueOf函数,则将对象字符串化为默认值,两个操作数做拼接操作
console.log(10+{
	valueOf:function (){
		return 'abc';
	}
})                  				//输出10abc。如果其中一个操作数为对象,并且对象中指定valueOf函数,则将valueOf函数的返回结果为非数值型,则将valueOf函数的返回结果作为另一个操作数,然后按照以上规则,决定两个操作数如何操作
console.log(10+{
	valueOf:function (){
		return 10;
	}
})                  				//输出20。如果其中一个操作数为对象,并且对象中指定valueOf函数并返回数值型值,则将valueOf函数的返回结果作为另一个操作数,与另一个操作数做相加操作。

? ? ? ? 减法

?????????下面给出一些减法操作符作用在不同类型值时候的示例。

console.log(10-8)                   //输出2。两个操作数都是数值型,则返回两个操作数的差
console.log('10'-8)                 //输出2。如果其中一个操作数为字符串型,另一个操作数为数值型,如果字符串可以转为有效数字,则返回两个操作数的差
console.log('10'-'8')               //输出2。如果两个操作数都为字符串型,如果两个字符串都可以转为有效数字,则返回两个操作数的差
console.log(true-8)               	//输出-7。布尔类型true作为1
console.log(false-8)               	//输出-8。布尔类型false作为0
console.log(null-10)                //输出-10。null作为0
console.log(null-'abc')             //输出NaN。null作为0,如果另一个操作数为非数值型,并且不能转为有效数字,则返回NaN
console.log(null-null)             	//输出0。如果两个操作数都为null,则返回0
console.log(undefined-undefined)    //输出NaN。如果两个操作数都为undefined,则返回NaN
console.log(undefined-null)         //输出NaN。如果其中一个操作数为undefined,则返回NaN
console.log(NaN-10)                 //输出NaN。如果其中一个操作数为NaN,则返回NaN
console.log(undefined-10)           //输出NaN。如果其中一个操作数为undefined,则返回NaN
console.log(Infinity-10)           	//输出Infinity。如果Infinity与正数相减,则返回Infinity
console.log(Infinity-Infinity)      //输出NaN。如果Infinity减去Infinity,则返回Infinity
console.log(Infinity-(-Infinity))   //输出Infinity。如果Infinity与-Infinity相减,则返回Infinity
console.log(-Infinity-(-Infinity))  //输出NaN。如果-Infinity与-Infinity相减,则返回NaN
console.log(Infinity-(-10))         //输出Infinity。如果Infinity与负数相减,则返回Infinity
console.log(Infinity-'10')          //输出Infinity。如果Infinity与非数值型相减,则返回Infinity
console.log(10-function(){})        //输出NaN。如果其中一个操作数为函数,则返回NaN
console.log(10-{})                  //输出NaN。如果其中一个操作数为对象,并且对象中没指定valueOf函数,则返回NaN
console.log(10-{
	valueOf:function (){
		return 'abc';
	}
})                  				//输出NaN。如果其中一个操作数为对象,并且对象中指定valueOf函数,并且valueOf函数返回的值不能转为有效数字,则返回NaN
console.log(10-{
	valueOf:function (){
		return '10';
	}
})                  				//输出0。如果其中一个操作数为对象,并且对象中指定valueOf函数,并且valueOf函数返回的值可以转为有效数字,则与另一个操作数做相减操作。

二、关系操作符?

?????????关系操作符包括大于(>)、小于(<)、大于等于(>=)、小于等于(<=),用来对两个操作数进行比较。如果两个操作数都为数值类型,则比较规则与数学中的规则一样,如以下代码所示

console.log(1>2)	//输出true
console.log(1<2)	//输出false

? ? ? ? 如果关系操作符作用在非数值类型的值时,会有不同的表现形式,下面以大于(>)操作符举例

console.log('10'>8)                 //输出true。如果其中一个操作数为字符串型,另一个操作数为数值型,如果字符串可以转为有效数字,则返回两个数值的比较结果
console.log('10'>'8')               //输出false。如果两个操作数都为字符串型,虽然两个字符串都可以转为有效数字,但并不是比较两个数字谁更大,而是将另个操作数作为字符串,比较两个字符串中对应位置的字符编码值
console.log(true>8)               	//输出false。布尔类型true作为1
console.log(false>8)               	//输出false。布尔类型false作为0
console.log(null>10)                //输出false。null作为0
console.log(null>'abc')             //输出false。null作为0,如果另一个操作数为非数值型,并且不能转为有效数字,则返回false
console.log(null>null)             	//输出false。如果两个操作数都为null,则返回false
console.log(undefined>undefined)    //输出false。如果两个操作数都为undefined,则返回false
console.log(undefined>null)         //输出false。如果其中一个操作数为undefined,则返回false
console.log(NaN>10)                 //输出false。如果其中一个操作数为NaN,则返回false
console.log(undefined>10)           //输出false。如果其中一个操作数为undefined,则返回false
console.log(Infinity>10)           	//输出true。Infinity大于任何数
console.log(Infinity>'10')          //输出true。Infinity大于任何数,字符串10可以转为有效数字10
console.log(10>function(){})        //输出false。如果其中一个操作数为函数,则返回false
console.log(10>{})                  //输出false。如果其中一个操作数为对象,并且对象中没指定valueOf函数,则返回false
console.log(10>{
	valueOf:function (){
		return 'abc';
	}
})                  				//输出false。如果其中一个操作数为对象,并且对象中指定valueOf函数,并且valueOf函数返回的值不能转为有效数字,则按照字符串的比较规则得出结果

三、相等操作符?

? ? ? ? 确定两个变量是否相等是编程中非常重要的操作,如果比较的两个操作数都为数值型,则比较规则与数学中的一样。如果涉及到非数值型的操作数,则比较规则就变得复杂了。在早期,JavaScript中的相等和不相等操作会在执行比较前,先将两个操作数转为相似的类型。后来,有人提出这种转换并不合理,以至于到最后,JavaScript提供两组操作符:相等和不相等,全等和不全等。前者先转换再比较,后者仅比较不转换。

????????相等和不相等

? ? ? ? 相等操作符用两个等号(==)表示, 相等则返回true。不相等操作符用一个英文叹号加一个等号(!=)表示, 不相等则返回true。这两个操作符都会先转换对象的类型,再进行比较。以下用一组代码表示这两个操作符用在不同类型对象时的不同表现。

console.log('10'==8)                 //输出false。如果其中一个操作数为字符串型,另一个操作数为数值型,如果字符串可以转为有效数字,则返回两个数值的比较结果
console.log('10'=='8')               //输出false。如果两个操作数都为字符串型,虽然两个字符串都可以转为有效数字,但并不是比较两个数字谁更大,而是将另个操作数作为字符串,比较两个字符串中对应位置的字符编码值
console.log(true==8)               	 //输出false。布尔类型true作为1
console.log(false==8)                //输出false。布尔类型false作为0
console.log(null==10)                //输出false。null作为0不等于10
console.log(null==0)             	 //输出false。虽然null可以转化为0,但null却不等于0
console.log(null=='abc')             //输出false。
console.log(null==null)              //输出true。如果两个操作数都为null,则返回true
console.log(undefined==undefined)    //输出true。如果两个操作数都为undefined,则返回true
console.log(undefined==null)         //输出true。undefined等于null。
console.log(NaN==10)                 //输出false。如果其中一个操作数为NaN,则返回false
console.log(NaN==NaN)                //输出false。NaN不等于任何值,包括它自己
console.log({}=={})                	 //输出false。空对象不等于空对象
console.log(undefined==10)           //输出false。如果其中一个操作数为undefined,则返回false
console.log(10==function(){})        //输出false。如果其中一个操作数为函数,则返回false
console.log(10=={})                  //输出false。如果其中一个操作数为对象,并且对象中没指定valueOf函数,则返回false
console.log(10=={
	valueOf:function (){
		return '10';
	}
})                  				//输出false。如果其中一个操作数为对象,并且对象中指定valueOf函数,并且valueOf函数返回的值可以转为有效数字,则按照数字的比较规则得出结果
console.log(10=={
	valueOf:function (){
		return 'abc';
	}
})                  				//输出false。如果其中一个操作数为对象,并且对象中指定valueOf函数,并且valueOf函数返回的值不能转为有效数字,则按照字符串的比较规则得出结果
console.log('10'!=8)                 //输出true。如果其中一个操作数为字符串型,另一个操作数为数值型,如果字符串可以转为有效数字,则返回两个数值的比较结果
console.log('10'!='8')               //输出true。如果两个操作数都为字符串型,虽然两个字符串都可以转为有效数字,但并不是比较两个数字谁更大,而是将另个操作数作为字符串,比较两个字符串中对应位置的字符编码值
console.log(true!=8)               	 //输出true。布尔类型true作为1
console.log(false!=8)                //输出true。布尔类型false作为0
console.log(null!=10)                //输出true。null作为0不等于10
console.log(null!=0)             	 //输出true。虽然null可以转化为0,但null却不等于0
console.log(null!='abc')             //输出true。
console.log(null!=null)              //输出false。因为null等于null
console.log(undefined!=undefined)    //输出false。因为undefined等于undefined
console.log(undefined!=null)         //输出false。因为undefined等于null。
console.log(NaN!=10)                 //输出true。NaN不等于任何值
console.log(NaN!=NaN)                //输出true。NaN不等于任何值,包括它自己
console.log(10!=function(){})        //输出true。空函数不等于任何值
console.log(10!={})                  //输出true。空对象不等于任何值
console.log(10!={
	valueOf:function (){
		return '10';
	}
})                  				//输出false。如果其中一个操作数为对象,并且对象中指定valueOf函数,并且valueOf函数返回的值可以转为有效数字,则按照数字的比较规则得出结果
console.log(10!={
	valueOf:function (){
		return 'abc';
	}
})                  				//输出true。如果其中一个操作数为对象,并且对象中指定valueOf函数,并且valueOf函数返回的值不能转为有效数字,则按照字符串的比较规则得出结果

? ? ? ? 全等和不全等

? ? ? ? 全等操作符用三个等号(===)表示, 不全等操作符用一个英文叹号加两个等号(!==)表示,全等和不全等操作符除了不将两个操作数进行类型转换之外,与相等和不相等操作符没有任何区别。?全等:只有在两个操作数字面量相等的情况下,才返回true。不全等:只有在两个操作数字面量不相等的情况下,才返回true。下面用两组代码来说明

console.log(8===8)                 	  //输出true。数字8全等于数字8
console.log('8'==='8')                //输出true。字符串8全等于字符串8
console.log(true===1)                 //输出false。虽然true可以转化为1,但true不全等于1
console.log(false===0)                //输出false。虽然false可以转化为0,但false不全等于0
console.log(null===0)             	  //输出false。虽然null可以转化为0,但null却不全等于0
console.log(null===null)              //输出true。因为null全等于null
console.log(undefined===undefined)    //输出true。因为undefined全等于undefined
console.log(undefined===null)         //输出false。因为undefined不全等于null。
console.log(NaN===NaN)                //输出false。NaN不全等于任何值,包括它自己
console.log(10==={
	valueOf:function (){
		return 10;
	}
})                  				  //输出false。虽然valueOf返回10,但对象整体并不全等于10
console.log(8!==8)                 	  //输出false。数字8全等于数字8
console.log('8'!=='8')                //输出false。字符串8全等于字符串8
console.log(true!==1)                 //输出true。虽然true可以转化为1,但true不全等于1
console.log(false!==0)                //输出true。虽然false可以转化为0,但false不全等于0
console.log(null!==0)             	  //输出true。虽然null可以转化为0,但null却不全等于0
console.log(null!==null)              //输出false。因为null全等于null
console.log(undefined!==undefined)    //输出false。因为undefined全等于undefined
console.log(undefined!==null)         //输出true。因为undefined不全等于null。
console.log(NaN!==NaN)                //输出true。NaN不全等于任何值,包括它自己
console.log(10!=={
	valueOf:function (){
		return 10;
	}
})                  				  //输出true。虽然valueOf返回10,但对象整体并不全等于10

四、条件操作符?

? ? ? ? ?JavaScript中的条件操作符与java中的语法形式相同。如下面的例子所示

var a=1,b=2,c=a>b?a:b;
console.log(c)                 	  //输出2

? ? ? ? ?以上代码的重点在于变量c的赋值,这里用到了条件操作符,如果a大于b则将a的值赋给c,否则将b的值赋给c。条件操作符不光可以用来赋值,还可以用来执行语句,比如

var a=1,b=2;
a>b?console.log(111):console.log(222)

? ? ? ? 如果a大于b则输出111,否则输出222。

小结

? ? ? ? 本文讲述了加性操作符、关系操作符、相等操作符、条件操作符的使用,下一篇文章将讲述赋值操作符、逗号操作符和位操作符。

文章来源:https://blog.csdn.net/leonMary/article/details/135332608
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。