【前端】JavaScript入门及实战11-15

最新推荐文章于 2024-07-20 18:16:53 发布

子非鱼921

最新推荐文章于 2024-07-20 18:16:53 发布

阅读量869

点赞数 6

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

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

版权

前端-JavaScript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

文章目录

11 转换为Number
12 其他进制的数字
13 转换为Boolean
14 运算符
15 一元运算符

11 转换为Number

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		将其他的数据类型转换为Number
			1. 使用Number()函数
			   字符串->数字
					(1) 如果是纯数字的字符串，则直接将其转换为数字
					(2) 如果字符串中有非数字的内容，则转换为NaN
					(3) 如果字符串是一个空串，或者是一个全是空格的字符串，转换为0
				布尔->数字
					(1) true->1
					(2) false->0
				null->数字：0
				undefined->数字：NaN
			2. 这种方式专门用来对付字符串
				parseInt() 把一个字符串转换为一个整数
				parseFloat() 把一个字符串转换为一个浮点数
	*/

	var a = "123";
	
	// 调用Number()函数来讲a转换为Number类型
	a = Number(a);
	
	var b = "abc";
	b = Number(b); // NaN
	
	var b = "";
	b = Number(b); // 0
	
	c = true;
	c = Number(c); // 1
	
	c = false;
	c = Number(c); // 0
	
	c = null;
	c = Number(c); // 0
	
	c = undefined;
	c = Number(c); // NaN
	
	e = "123px"; // css样式，想要+10
	e = Number(e); // NaN
	
	// 调用parseInt()函数转换为Number
	// parseInt()可以将一个字符串中的有效整数内容取出来，然后转换为Number
	e = "123px";
	e = parseInt(e); // 123
	
	e = "123a456px"
	e = parseInt(e); // 123
	
	e = "b123a456"
	e = parseInt(e); // NaN
	
	e = "123.456";
	e = parseInt(e); // 123
	
	// parseFloat()作用和parseInt()类似，不同的是他可以获得有效的小数
	f = "123.456";
	f = parseFloat(f); // 123.456
	
	f = "123.456.789px";
	f = parseFloat(f); // 123.456
	
	// 如果对非String使用parseInt()或parseFloat()，他会先将其转换为String，然后再操作
	g = true;
	g = parseInt(g); // "true" -> NaN
</script>
<style>
</style>
</head>
<body>
</body>
</html>

12 其他进制的数字

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		在js中，如果需要表示16进制的数字，则需要以0x开头
				如果需要表示8进制的数字，则需要以0开头
				如果需要表示2进制的数字，则需要以0b开头，但不是所有浏览器都支持
	*/
	
	// 十六进制数字
	a = 0x10; // 16
	a = 0xff; // 255
	a = 0xcafe; // 51966
	
	// 八进制数字
	b = 070; // 56
	
	// 二进制数字
	c = 0b10; // 2
	
	// 像"070"这种字符串，有些浏览器会当成八进制解析，有些会当成十进制解析
	d = "070";
	d = parseInt(d); // 70 / 56
	// 可以在parseInt()中传递第二个参数，来指定数字的进制
	d = parseInt(d, 10); // 70	
</script>
<style>
</style>
</head>
<body>
</body>
</html>

13 转换为Boolean

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		将其他的数据类型转换为Boolean
			使用Boolean()函数
				1. 数字->布尔
					除了0和NaN，都是true
				2. 字符串->布尔
					除了空串，都是true
				3. null和undefined都是false
				4. 对象也会转换为true
	*/

	var a = 123;
	a = Boolean(a); // true

	a = -123;
	a = Boolean(a); // true
	
	a = 0;
	a = Boolean(a); // false

	a = Infinity;
	a = Boolean(a); // true

	a = NaN;
	a = Boolean(a); // false
	
	b = "hello";
	b = Boolean(b); // true
	
	b = "true";
	b = Boolean(b); // true
	
	b = "false";
	b = Boolean(b); // true
	
	b = "";
	b = Boolean(b); // false
	
	b = "  ";
	b = Boolean(b); // true
	
	c = null;
	c = Boolean(c); // false
	
	c = undefined;
	c = Boolean(c); // false
</script>
<style>
</style>
</head>
<body>
</body>
</html>

14 运算符

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		运算符也叫操作符
			通过运算符可以对一个或多个值进行运算，并获取运算结果
			比如：typeof就是运算符，可以来获得一个值的类型
				  它会将该值的类型以字符串的形式返回
				  number string boolean undefined object
				  
			算术运算符
				当对非Number类型的值进行运算时，会转换为Number然后再运算
				任何值和NaN做运算都得NaN
				1. +：可以对两个值进行加法运算，并将结果返回
					  如果对两个字符串进行加法运算，会做拼串操作，将两个字符串拼接为一个字符串并返回
					  任何的值和字符串做加法运算，都会先转换为字符串，然后再和字符串做拼串的操作
				2. -：可以对两个值进行减法运算，并将结果返回
				3. *：乘法
				4. /：除法
				5. %：取模运算（取余数）

	*/

	var a = 123;
	var result = typeof a; // number
	
	result = a + 1;
	console.log(result); // 124
	
	result = true + 1; // 2
	
	result = true + false; // 0
	
	result = null + 2; // 2
	
	result = NaN + 2; // NaN
	
	result = "123" + "456"; // "123456"，string类型
	
	result = "你好" + "JavaScript"; // “你好JavaScript”
	
	var str = "锄禾日当午
						"; // 错误，双引号必须在同一行
	var str = "锄禾日当午，" + 
			  "汗滴禾下土，" + 
			  "谁知盘中餐，" + 
			  "粒粒皆辛苦";
			  
	result = 123 + "1"; // "1231"
	
	result = true + "hello"; // "truehello"
	
	// 任何值和字符串相加都会转换为字符串，并作拼串操作
	/* 
		可以利用这一特点，将一个任意的数据类型转换为String
		我们只需要为任意的数据类型 + 一个""即可将其转换为String
		这是一种隐式的类型转换，由浏览器自动完成，实际上他也是调用String()函数
	*/
	
	var c = 123;
	c = c + "变成字符串";
	c = c + ""; // string："123"
	c = String(c); // 本质上一样
	
	c = null;
	c = c + ""; // string："null"
	
	console.log("c = " + c); // c = 123
	
	result = 1 + 2 + "3"; // "33"
	result = "1" + 2 + 3; // "123"
	console.log("result = " + result);
	
	re = 100 - 2; // 98
	
	re = 100 - true; // 99
	
	re = 100 - "1"; // 99，"1"转换为Number，除了加法拼接字符串外，其余都转换为Number
	
	re = 2 * 2; // 4
	
	re = 2 * "8"; // 16
	
	re = 2 * undefined; // NaN
	
	re = 2 * null; // 0
	
	re = 4 / 2; // 2
	
	re = 3 / 2; // 1.5
	
	/*
		任何值做- * /运算时，都会自动转换为Number
		可以利用这一特点做隐式类型转换
		可以通过为一个值-0、*1、/1来将其转换为Number
		原理和Number()函数一样，使用起来更简单
	*/
	
	var d = "123";
	
	d = d - 1; // number：122
	
	console.log(d);
	
	res = 9 % 3; // 余数0
	res = 9 % 4; // 1
	res = 9 % 5; // 4
</script>
<style>
</style>
</head>
<body>
</body>
</html>

15 一元运算符

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		一元运算符，只需要一个操作数
		+ 正号：正号不会对数字产生任何影响 1 = +1
		- 负号：负号可以对数字进行符号的取反
			    对于非Number的值，会先转换成Number然后再运算
				可以对一个其他的数据类型使用+，来将其转换为Nunber
				原理和Number()一样
		
	*/

	var a = 123;
	a = +a;
	a = -a;
	
	a = true; // boolean
	a = -a; // -1 number
	
	a = "18"; // string
	a = -a; // -18 number
	a = +a; // 18
	
	var res = 1 + "2" + 3; // "123"
	res = 1 + +"2" + 3; // 1 + 2 + 3 = 6, +"2" -> 2
</script>
<style>
</style>
</head>
<body>
</body>
</html>

子非鱼921

关注

6
点赞
踩
12

收藏

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

/ 如果对非String使用parseInt()或parseFloat()，他会先将其转换为String，然后再操作。// parseInt()可以将一个字符串中的有效整数内容取出来，然后转换为Number。任何的值和字符串做加法运算，都会先转换为字符串，然后再和字符串做拼串的操作。// 99，"1"转换为Number，除了加法拼接字符串外，其余都转换为Number。(3) 如果字符串是一个空串，或者是一个全是空格的字符串，转换为0。(1) 如果是纯数字的字符串，则直接将其转换为数字。
复制链接

扫一扫