【前端】JavaScript入门及实战21-25

子非鱼921

于 2024-07-17 20:48:08 发布

阅读量878

点赞数 40

分类专栏：前端-JavaScript 文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/weixin_45980065/article/details/140504954

版权

前端-JavaScript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

文章目录

21 关系运算符
22 编码
23 相等运算符
24 条件运算符
25 运算符优先级

21 关系运算符

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">	
	/*
		通过关系运算符可以比较两个值之间的大小关系，
		如果关系成立它会返回true，如果关系不成立则返回false
		
		> 大于号：判断符号左侧的值是否大于右侧的值
				  如果关系成立，返回true，如果关系不成立则返回false
		
		>= 大于等于：判断符号左侧的值是否大于或等于右侧的值
					 如果关系成立，返回true，如果关系不成立则返回false
		
		<
		
		<=
		
		非数值的情况：1. 非数字进行比较时，先转换为数字再进行比较
					 2. 如果符号两侧的值都是字符串，不会将其转换为数字进行比较，
					     会分别比较字符串中字符的Unicode编码
	*/
	
	var res = 5 > 10; // false
	
	res = 5 > 4; // true
	
	res = 5 >= 5; // true
	
	res = 5 < 4; // false
	
	res = 4 <= 4; // true
	
	console.log(1 > true); // false
	
	console.log(1 >= true); // true
	
	console.log(1 > "0"); // true
	
	console.log(10 > null); // 10 > 0, true
	
	// 任何值和NaN做任何比较都是false
	console.log(10 > "hello"); // 10 > NaN, false
	
	console.log(true > false); // 1 > 0, true
	
	console.log("1" < "5"); // true
	
	// 特殊情况！！！
	console.log("11" < "5"); // true
	
	console.log("a" < "b"); // true
	
	// 比较字符编码时是一位一位进行比较的
	
	console.log("abc" < "b"); // true
	
	// 如果两位一样，则比较下一位，所以借用他来对英文进行排序
	console.log("bbc" < "b"); // false
	
	// 比较中文没有意义
	console.log("你" < "我"); // false
	
	// 如果比较两个字符串型的数字，可能会得到不可预期的结果
	// 注意：在比较两个字符串型的数字时，一定要转型
	console.log("453213245" < +"5"); // false, +"5" -> 5
</script>
<style>
</style>
</head>
<body>
</body>
</html>

22 编码

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		在字符串中使用转义字符输出Unicode编码：\u四位编码	
	*/	
	console.log("\u1C00"); // unicode编码
		
	console.log("\u0031"); // 1	
</script>
<style>
</style>
</head>
<body>
	<!--
		在网页中使用Unicode编码：&#编码;
		这里的编码需要的是10进制
	-->
	<h1 style="font-size: 100px;">&#9760;</h1>
	<h1 style="font-size: 100px;">&#9856;</h1>
</body>
</html>

23 相等运算符

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	
	/*
		相等运算符用来比较两个值是否相等，
		如果相等会返回true，否则会返回false
		
		使用==来做相等运算：当使用==来比较两个值时，如果值的类型不同，
							则会自动进行类型转换，将其转换为相同的类型
							大部分情况都转换为数字
							
		不相等：不相等用来判断两个值是否不相等，如果不相等返回true，否则返回false
				使用!=来做不相等运算
				不相等也会对变量进行自动的类型转换，如果转换后相等也会返回false
				
		===：全等：用来判断两个值是否全等，他和相等类似，不同的是他不会做自动的类型转换
				   如果两个值的类型不同，直接返回false
		
		!==：不全等：用来判断两个值是否不全等，和不等类似，不同的是他不会做自动的类型转换
					 如果两个值的类型不同，直接返回true
		
	*/
	
	console.log(1 == 1); // true
	
	var a = 10;
	
	console.log(a == 4); // false
	
	console.log("1" == 1); // true
	
	console.log(true == "1"); // true
	
	console.log(true == "hello"); // false，转为了number 0
	
	console.log(null == 0); // false，特殊情况，没转为number
	
	/*
		undefined衍生自null
		所以这两个值做判断时，会返回true
	*/
	console.log(undefined == null); // true
	
	/*
		NaN不和任何值相等，包括他本身
	*/
	console.log(NaN == undefined); // false
	
	console.log(NaN == NaN); // false
	
	var b == NaN;
	console.log(b == NaN); // false
	
	/*
		可以通过isNaN()函数来判断一个属是否是NaN
	*/	
	console.log(isNaN(b)); // true
	
	console.log(10 != 5); // true
	
	console.log("abcd" != "abcd"); // false
	
	console.log("1" != 1); // false
	
	console.log("123" === 123); // false
	
	console.log(null === undefined); // false
	
	console.log("1" !== 1); // true
</script>
<style>
</style>
</head>
<body>	
</body>
</html>

24 条件运算符

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		条件运算符也叫三元运算符
		语法：条件表达式? 语句1: 语句2
		执行的流程：条件运算符在执行时，首先对条件表达式进行求值
					如果该值为true，则执行语句1，并返回执行结果
					如果该值为false，则执行语句2，并返回执行结果
					如果条件的表达式的求值结果是一个非布尔值，会将其转换为布尔值，然后再运算
	*/
	
	true? alert("语句1"): alert("语句2"); // 弹出语句1
	
	false? alert("语句1"): alert("语句2"); // 弹出语句2
	
	var a = 10;
	var b = 20;
	var c = 50
	
	a > b? alert("a大"): alert("b大");
	
	// 获取a和b中的最大值
	var max = a > b ? a : b;
	
	// 获取a、b、c中的最大值
	max = max > c ? max : c;
	
	// 求最大值，这种写法不推荐，不方便阅读
	var max = a > b ? (a > c ? a : c) : (b > c ? b : c);
	
	"hello" ? alert("语句1"): alert("语句2"); // 1
	"" ? alert("语句1"): alert("语句2"); // 2
</script>
<style>
</style>
</head>
<body>
</body>
</html>

25 运算符优先级

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		,运算符：
			使用,可以分割多个语句，一般可以在声明多个变量时使用
	*/
	
	//使用,运算符同时声明多个变量
	var a, b, c;
	
	//可以同时额韩国匿名多个变量并赋值
	var a = 1, b = 2, c = 3;
	
	alert(b);
	
	/*
		运算符优先级
		就和数学中一样，在JS中运算符也有优先级
		比如：先乘除后加减
		
		在JS中有一个运算优先级的表，在表中位置越靠上，优先级越高，优先级高则优先计算
		如果优先级相同，则从左往右计算，这个表并不需要记忆，如果遇到优先级不清楚的，可以使用括号()改变优先级
	*/
	
	var res = 1 + 2 * 3;
	
	/*
		如果||的优先级高，或者两个一样高，则应该返回3
		如果&&的优先级高（返回3），则应该返回1
	*/
	var res = 1 || 2 && 3; // && > ||
	
	var res = (1 || 2) && 3; // 先算或（||）
</script>
<style>
</style>
</head>
<body>
</body>
</html>

子非鱼921

关注

40
点赞
踩
20

收藏

觉得还不错? 一键收藏
0
评论
【前端】JavaScript入门及实战21-25

如果优先级相同，则从左往右计算，这个表并不需要记忆，如果遇到优先级不清楚的，可以使用括号()改变优先级。==：不全等：用来判断两个值是否不全等，和不等类似，不同的是他不会做自动的类型转换。不相等：不相等用来判断两个值是否不相等，如果不相等返回true，否则返回false。===：全等：用来判断两个值是否全等，他和相等类似，不同的是他不会做自动的类型转换。如果关系成立，返回true，如果关系不成立则返回false。使用==来做相等运算：当使用==来比较两个值时，如果值的类型不同，
复制链接

扫一扫