玩转js之06-操作符_如果一个操作数是字符串,另一个是数值,在比较相等性之前-CSDN博客

本文链接：https://blog.csdn.net/m0_68348293/article/details/125331781

本文深入探讨JavaScript操作符，包括一元操作符（自增、自减）、逻辑操作符（&&、||）、比较运算符、相等判断、in运算符和逗号运算符，并通过实例解析其工作原理和应用场景。

摘要由CSDN通过智能技术生成

一、操作符有哪些？

一元操作符

只能操作一个值的操作符叫做一元操作符。一元操作符是 ECMAScript 中最简单的操作符。

自增

都是让变量的值加1，无论前置还是后置既有存值操作也有取值操作
前置++ ：就是先把变量修改了再取值操作，先加后取
后置++ 就是先取变量的值然后在加1操作，先取后加

自减

同上

例题

题1：

var a=10
			a=(a++)+(++a)
			console.log(a)

答案：22
解析：取值和存值就是把一个变量保存的数据取出来把一个计算结果存入变量，一个变量只能保存一个数据
a++,先取值10后a+1=11
++a，先a+1=12，再取值12
所以10+12=22，打印22

题2：

var num1 = 2;
var num2 = 20;
var num3 = num1-- + num2;
var num4 = num1 + num2;

答案：22 21
解析：
num1–，先取num1 = 2再num1 -1= 1，num1 = 1
num3 = num1-- + num2=2+20=22
num4 = num1 + num2=1+20=21

题3：
高薪研究：

var obj={age:20}
			var a=100
		    var c=(-a+++obj.age++)
			console.log(c)

答案：-80
解析：
计算顺序是（（-a）++）+（obj.age++）
a=100,-a=-100
（-a）++，先取-100再++，obj.age++，先取20再++
所以c=-100+20=-80，打印c等于-80

题4：

var age = 29;
var anotherAge = --age + 2;
alert(age);//28 
alert(anotherAge); //30

答案：28 30
解析：
–age，先age-1=28再取28，age=28
所以anotherAge = --age + 2=28+2=30

题5：

var num1 = 2;
var num2 = 20;
var num3 = --num1 + num2;
var num4 = num1 + num2;

答案：21 21
解析：
在这里， num3 之所以等于 21 是因为 num1 先减去了 1 才与 num2 相加。而变量 num4 也等于 21 是因为相应的加法操作使用了 num1 减去 1 之后的值。

题6：

var a = 2;//4
			var b = 3;//4
			var c = (++a) + (b++) + b + (a++) - a;//3+3+4+3-4
			console.log(c)//9

答案：9
解析：
++a，先a+1=3再取3，b++先取3再a+1=4，b=4，a++先取a=3再a+1=4，a=4
所以3+3+4+3-4=9，打印9

应用不同值的规则

在应用于一个包含有效数字字符的字符串时，先将其转换为数字值，再执行加减 1 的操作。字符串变量变成数值变量。
在应用于一个不包含有效数字字符的字符串时，将变量的值设置为 NaN。字符串变量变成数值变量。
在应用于布尔值 true 时，先将其转换为 1 再执行加减 1 的操作。布尔值变量变成数值变量。
在应用于布尔值 false 时，先将其转换为 0 再执行加减 1 的操作。布尔值变量变成数值变量。
在应用于浮点数值时，执行加减 1 的操作。
在应用于对象时，先调用对象的 valueOf()方法（后面章节将详细讨论）以取得一个可供操作的值。然后对该值应用前述规则。如果结果是 NaN，则在调用 toString()方法后再应用前述规则。对象变量变成数值变量。
以下示例展示了上面的一些规则：

var s1 = "2";
var s2 = "z";
var b = false;
var f = 1.1;
var o = {
    valueOf: function() {
     	return -1;
    }
};
console.log(s1++)

console.log(s2++);
console.log(b++);  
console.log(f--);  
console.log(o--);

在这里插入图片描述

&&符号

逻辑与操作符由两个和号（&&）表示，有两个操作数，如下面的例子所示：

var result = true && false;

false的情况有变量为以下情况：null，undefined，空字符串，空对象，空数组，0，NaN
逻辑与的真值表如下：
有假为假，都真为真
在这里插入图片描述

逻辑与操作属于短路操作，即如果第一个操作数能够决定结果，那么就不会再对第二个操作数求值。
逻辑与（中断操作，表达式1为假，就返回表达式1，表达式2不会执行，反之返回表达式2）

 var re=A&&B

A是一个表达式 B也是一个表达式 re等于A表达式或者B表达式
(如果A表达式判定为布尔表达式的值的false)re就是A 否则反之为B表达式
如果re为A表达式那么B表达式不运行

例题：

滴滴出行原题

var a=(b=0)&&(c=30)
			//b=0==>var b=0
			console.log(a)//a=b=0 并不是a=false
			console.log(b)
			console.log(c)

答案：0 0 报错
解析：

0做布尔判定时会判定为flase
取一个变量的数据时(1.没有声明就会报错 2.取的是最近一次保存的数据)
js中变量保存数据(1.已经有就更新 2.没有就隐藏声明)

||符号

逻辑或操作符由两个竖线符号（||）表示，有两个操作数，如下面的例子所示：

var result = true || false;

逻辑或的真值表如下：
有真即真，都假为假
在这里插入图片描述

var re=A||B

A表达式的布尔判定为true re=A 注意:B表达式不运行反之re=B
与逻辑与操作符相似，逻辑或操作符也是短路操作符。也就是说，如果第一个操作数的求值结果为true，就不会对第二个操作数求值了。下面看一个例子：

var found = true;
var result = (found || someUndefinedVariable); 
alert(result);

答案：true
解析：这个例子跟前面的例子一样，变量 someUndefinedVariable 也没有定义。但是，由于变量 found的值是 true，而变量someUndefinedVariable 永远不会被求值，因此结果就会输出"true"。

||这个符号在开发中往往是优化的代码最常用的js符号

练习

ar c = (a = 3) || (b = 4);
console.log(a);
console.log(c);
console.log(b);

答案：3 3 报错
解析：a=3为真，返回c=a=3,后面个表达式不运行
隐式声明a
b没有定义没有声明就取值报错

取反运算符

a=!a !a 把a的值取出来然后转化为布尔值true 在取反在把取反的结果赋值给变量a
开关思想:把一个变量中保存一个布尔值然后在业务执行时修改这个变量的值:为取反然后通过变量的值执行分支业务

 var a="isLogin"//登录过
		   a=!a//  !a 把a的值取出来 然后转化为布尔值true  在取反    在把取反的结果赋值给变量a
		   a=!a
		   console.log(a)
		//    开关思想:把一个变量中保存一个布尔值 然后在业务执行时 修改这个变量的值:为取反  然后通过变量的值执行分支业务
		   var flag=true
		   function fn(){
			   flag=!flag
			   if(flag){
			   			   
			   }else{
			   			   
			   }
		   }
		    fn()

比较运算符

运算符==>底层cpu会去计算会执行操作得到一个结果
小于（<）、大于（>）、小于等于（<=）和大于等于（>=）这几个关系操作符用于对两个值进行比较，比较的规则与我们在数学课上所学的一样。这几个操作符都返回一个布尔值true或false
规则：

如果两个操作数都是数值，则执行数值比较。
如果两个操作数都是字符串，则比较两个字符串对应的字符编码值。
如果一个操作数是数值，则将另一个操作数转换为一个数值，然后执行数值比较。
如果一个操作数是对象，则调用这个对象的 valueOf()方法，用得到的结果按照前面的规则执行比较。如果对象没有 valueOf()方法，则调用 toString()方法，并用得到的结果根据前面的规则执行比较。
如果一个操作数是布尔值，则先将其转换为数值，然后再执行比较。
任何操作数与 NaN 进行关系比较，结果都是 false。

var result = "a" < 3;

相等判断

确定两个变量是否相等，ECMAScript 提供两组操作符：相等和不相等——先转换成相似类型再比较，全等和不全等——仅比较而不转换。
相等==规则：
**比较的是两个表达式的值是否相等，引用数据比较时会看是否是同一个内存空间，字符串（布尔值）比较，字符串（布尔值）先转换成数值，再与基本数据比较 **

如果有一个操作数是布尔值，则在比较相等性之前先将其转换为数值——false 转换为 0，而true 转换为 1；
如果一个操作数是字符串，另一个操作数是数值，在比较相等性之前先将字符串转换为数值；
如果一个操作数是对象，另一个操作数不是，则调用对象的 valueOf()方法，用得到的基本类型值按照前面的规则进行比较
null 和 undefined 是相等的。
要比较相等性之前，不能将 null 和 undefined 转换成其他任何值（null == 0为false）。
如果有一个操作数是 NaN，则相等操作符返回 false，而不相等操作符返回 true。重要提示：即使两个操作数都是 NaN，相等操作符也返回 false；因为按照规则， NaN 不等于 NaN。
如果两个操作数都是对象，则比较它们是不是同一个对象。如果两个操作数都指向同一个对象，则相等操作符返回 true；否则，返回 false。
全等===
比较的是两个表达式的值和类型是否都相等
基本与引用数据比较，引用转为字符串，比较数值和内存空间是否一样

var a = 2
			var b = 3
			var c = "5"
			// a+b=c错误
			var d=(a+b)==c// 比较的是两个表达式的值是否相等
			console.log(d) //true
			console.log("100"==100)//true  值相等 但是类型不相等 number string

            var obj={name:"karen"}
			var obj2={name:"karen"}
			obj2.name="jack"
			console.log(obj==obj2)// false  引用数据比较时会看是否是同一个内存空间

// 难点和很多企业的笔试题中最喜欢在选择题中考==的比较表(背)
			var arr=[1,2,3,2]//arr.tostring()==> "1,2,3,2"
			var b=""
			console.log(arr==b) //false，数组转字符串，数值不同
			
			var arr=[[]]//这个内存空间
			var arr2=[]//这个另外一个内存空间
			console.log(arr==arr2) //false,不是同一个内存空间

in运算符

检查右侧对象里面是否拥有左侧属性名，如果有返回true；反之，返回false
“name” in obj ==>obj中是否使用name成员
对象在js中是一种键值对的集合: key:value key是字符串 value是数据/表达式

	var obj={"name":"karen",age:24}
			var re="name" in obj 
			console.log(re)
			var obj={age:28}
			console.log("toString" in obj)
			var re=obj.toString()
			console.log(re)
			
			var num=200.127
			num.toFixed(2)

expr1?A:B expr1表达式会做布尔判定判定的结果为true 就会执行表达式A 否则执行B
整个三目运算表达式的结果是A 或者B
开发时建议使用if-else

			var a=20;
			var re=a>=18?20:{name:"karen"};
			console.log(re)
			
			function render(){
				return isLogin?<User/>:<Login/>
			}

逗号运算符

逗号运算符多元运算符，会把逗号隔开的表达式全部执行最后一个运行的表达式的结果就是逗号运算符的结果

 var re=A,B,C,D,E,F 
 //re==>F

			var a,b,c,e=20;
			// 隐式操作  var a;var b;var c;var e=20
			var re=(20+30,40,50);
			console.log(re)

逗号表达式多用于for循环中笔试题
例题：

for (i=0, j=0; j<6, i<10; i++, j++) {
k = i + j;
}
console.log(k);

答案：18
解析：逗号运算符：逗号（,）的最后一个表达式作为逗号运算符的返回值；条件是i<10就行了，所以k=9+9=18

二、表达式计算-eval（）

eval()只有一个参数。如果传入的参数不是字符串，它直接返回这个参数。如果参数是字符串，它会把字符串当成JavaScript代码进行编译，如果编译失败者抛出一个语法错误异常。如果编译成功，则开始执行这一段代码，并返回字符串中的最后一个表达式会或语句的值，如果最后一个表达式或语句没有值，则最终返回undefifined。如果字符串抛出一个异常，这个异常将把该调用传递给eval()。
例题：

            var arr=[10,30,23,43]
			var re=arr.join("+")
			console.log(re+“hello”)

答案：10+30+23+43hello
解析：arr的join函数会用一个字符连接起来返回一个字符串

			var re=eval(200)
			var re=eval([10,30,40])
			var re=eval("10+20")
			console.log(re)

答案：200 / [10,30,40] /30
解析：eval函数会直接返回括号里的数据，如果数据是字符串类型会直接运行返回字符串的内容

			var arr=[10,30,23,43]
			var re=0;//arr[0]+arr[1]+arr[2]
			for(var i=0;i<arr.length;i++){
				re+=arr[i]
			}

var re=eval(arr.join("+"));
			console.log(re)

答案：106
解析：for循环完成数组内部数据的累加，也可以直接结合数组的jion函数以及eval函数计算数组内部数据的和

总结

js的操作符有一元操作符、逻辑操作符、乘性操作符、加性操作符、关系操作符、条件操作符(三目运算)、赋值操作符、逗号操作符（重点）
表达式计算（eval（））