JavaScript变量,数据类型,运算符

一.直接量和变量

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
			1.直接量:字面量
				数值  :1,2,3,4,5,1.1,1.11,1.356,-1,-2,-3
				字符串:由单双引号包裹起来的内容    'hello world'  "hello world"

				其他:布尔 true/false  null   

		直接量
		alert(111);
		alert(1.19);
		alert(-5);

		 alert('hello world');
		alert('3.14');字符串
		alert(3.14);数值

		alert(true);
		alert(false);

		
	</script>
</head>
<body>
	
</body>
</html>
<!DOCTYPE html>
<html>
<head>
	<title>变量</title>
	<script type="text/javascript">
		
			1.变量:变化的量
			2.定义变量:变量需要先定义在使用
				var 变量名;

				变量名的命名规则:
					1)变量名必须以字母、下划线、$开头
					2)变量名可以包含数字、字母、下划线、$
					3)变量名区分大小写
					4)不能使用关键字和保留字
			3.变量的赋值(变量的初始化):
				变量名=值;
			4.读取变量中的数据(变量的取值)
				变量名
			5.若变量只定义,未赋值    undefined
			6.定义变量的本质:在内存中开辟空间并且命名(变量名),将数据存入此空间(变量名所代表的空间)
			7.变量的赋值是一种值的传递(变量是独立的空间)
		
		变量的定义
		var a;定义一个变量,并且命名为a
		a=10;赋值   变量的初始化
		变量的取值
		console.log(a);在控制台中输出日志
	1.先定义一个变量,再初始化
		var a;定义一个变量
		变量初始化
		a=20;
	  取出变量的值
	 	console.log(a);

	 	2.var a=10,b=30,c=10;定义变量的同时即初始化
	 	console.log(a);
	 	console.log(b);
	 	console.log(c);

	 	3.多变量定义
	     var a,b,c;

	 	a=10;
	 	b=20;
	 	c=30;
	 	
	变量不可以重复定义
	var a=20;在内存中开辟空间命名为a,并且将20存入a这块空间中

	var a=30;

	console.log(a);
	</script>
</head>
<body>

</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
		
			JS是一门弱类型语言,在变量定义的时候,不需要指定数据类型
		
		var a='hello world';
		var b=123;
		console.log(a);
		console.log(b);
		var a=20;
		console.log(a);

		a=30;变量的重复赋值(覆盖)

		console.log(a);

		a='hello world';

		console.log(a);


	     var a=10;

		 var b=a;变量的赋值仅仅是一种值的传递


		 console.log(a);
		 console.log(b);

		 a=30;
		 b=20;
		 console.log(a);30
		 console.log(b);10    20
	</script>
</head>
<body>
	
</body>
</html>

二.数据类型

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
		
			数据类型:
				(1)基本数据类型(原始数据类型)
						数值类型(number) 			数字  1,2,3,10,1.1,2.1,1.222,-10
						字符串类型(string)          由""  ''   	 字符串内容会原样输出
						布尔类型(boolean)           false(假) true(真)
						undefined 				    变量定义但未初始化
						null                        空                 引用类型
				(2)引用类型
					Object  Array(数组)  Date(日期)  Function (函数)  RegExp(正则)

			检测变量数据类型
				typeof 变量名;

				注意:typeof表达式本身的结果是一个字符串类型
					"string"  "number"  "boolean"   "undefined"  "null"
		
		

	    var a=10;

		console.log(a);
		console.log(typeof a);number


		var a='hello';
		a='10';
		a='3.14';
		a="10+20";
        console.log(a);
		console.log(typeof a);string
		


		 var isBoy=false;

		 console.log(isBoy,typeof isBoy);


		 var a=10;
	     console.log(typeof a);
		 var b=typeof a;将a的数据类型保存在变量b中
		 console.log(b);"number"
		 console.log(typeof b);先运算在输出

		console.log(typeof typeof a);string


	

		变量的数据类型取决变量里保存的数据
		var a=10;number
		var b=20;

		console.log(typeof a,typeof b);

		a=true;boolean
		console.log(typeof a);

		a='hello';string
		console.log(typeof a);
	</script>
</head>
<body>
	
</body>
</html>

三.运算符

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
			运算符:
				运算符根据操作数的个数可以分为:一元(一目)运算符、二元运算符、三元运算符
				根据运算符的作用:
				(1)算术运算符:
					 +   -   *  /  %(取余)

					 一元运算符:
					 自增:++
					 自减:--

					 注意:未赋值时,前置和后置  无区别
					 		赋值时:
					 			1.后置:先赋值,后运算
					 			2.前置:先运算,后赋值

					 注意:+ 两边有一个为字符串类型时,则执行拼接操作,结果为字符串类型
				(2)赋值运算符
					= (赋值)   +=  -=  *=  /=  %=   先运算,再赋值

				(3)比较运算符
					运算结果为boolean类型
					>=   <=  >  <   ==(等于)    !=(不等于)   ===(全等)

					注意:
						==   只比较数值
						===  不仅比较数值,还比较数据类型
				(4)逻辑运算符
					一般情况下,运算结果为布尔类型
					&&(逻辑与) :   并且
									若运算符两边均为真(true),则结果为真(true),其它均为假
					||(逻辑或) :   或者
									运算符两边有一个为真,则为真;两边均为假,则为假
		
					!(逻辑非)  :    取反               一元
				
				(5)条件运算符  		三元运算符
					?:

		var a=10;
		var b=20;
		console.log(a+b);先运算、再输出

		十进制、二进制、八进制、十六进制
		JavaScript小数运算有问题:精度损失
		console.log(0.2*0.2);0.04000000000000001

		var a=0.2*0.2;
		var b=a.toFixed(2);保留小数点后两位数
		console.log(b);

		科学计数法
		var a1=0.000005;
		var a11=5e-6;
		var a2=300000000;
		var a3=3e8;
		console.log(a1);
		console.log(a11);
		console.log(a2);
		console.log(a3);
	</script>
</head>
<body>
	
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
        先赋值,后运算
         var a=10;
		 var b=a++;
		 var b=a--;

		console.log(a);
		console.log(b);


	1.	var a=5;
		var b=3;
        var c=a+b+(a++);5+3+5
		console.log(a,b,c);

	2.	var a1=a++;	
		var c=(a++)+(a+b)+(b--);5+9+3
		console.log(a,b,c);

	3.	var a=2;
		var b=4;
		var a1=a++;2
		var b1=b--;4
		var b2=b++;3
		var c=(a++)+(b--)+(a+b)+(b++);2+4+6+3
		console.log(a,b,c);a=3  b=4  c=15



         先运算,后赋值
		 var a=5;
		 var c=++a;
		 var b=--a;
		 console.log(c);6
		 console.log(b);5


	1.	var a=3;
		var b=5;
		var c=(++a)+a+b;4+4+5
        console.log(a,b,c);
		


		


	2.	var a=3;
		a+=2; a=a+2   
		a-=2; a=a-2
		a*=2;

		console.log(a+=2);5
		console.log(a*=2);10
		console.log(a/=2);5
		console.log(a%2);1

		 console.log(a);


	</script>
</head>
<body>
	
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
		var a=3;
		var b=5;
         同时成立则为true,有一项不成立则为false
	1.	 var c=a>b&&a<b;false
		 var c1=a<b&&a<=b;true
		 var c2=a<b&&a>b;false
		 var c3=a>b&&a>=b;false

         其中满足一项则为true
	2.	var c=a>b||a<b;true
		var c1=a<b||a<=b;true
		var c2=a<b||a>b;true
		var c3=a>b||a>=b;false

		console.log(c,c1,c3);


         式子c成立取第一项反之取第二项。
	3.	var a=10;
		var b=5;

		var c=a>b?100:50;

		console.log(c);

	</script>
</head>
<body>
	
</body>
</html>

四.运算符扩展

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script type="text/javascript">
	1.算术运算符
		

		数值类型
		var a=10;
		var b=5;
		console.log(a+b);

		字符串
		var a='hello';
		var b=' 哈哈';
		console.log(a+b);字符串拼接


		布尔类型
		var a=true;
		var b=false;


		不同类型之间进行算术运算

		 var a=10;
		 var b='hello';
		 var c='5';
		 var d=true;
		 var d1=false;

		 console.log(a+b);拼接操作
		 console.log(a+c);拼接
		数字型字符串与数值按照数值进行运算
		 console.log(a-c);按照数值运算
		 console.log(a*c);
		 console.log(a/c);

		布尔类型在参与数学运算时,true  1   false  0
		 console.log(a+d);11
		 console.log(a+d1);10

		 console.log(b+d);拼接操作
		 console.log(c+d);拼接
		 console.log(c-d);


	2.比较运算符扩展

		数值类型
		 console.log(3>5);
		 console.log(3==5);

		字符串类型          
		 console.log('19'>'5');false 比较首位
		 console.log(3==3);
		 console.log('hello '=='hello');

		var a=5;
	    var a1='hello';
		var b='10';
		var c='5';

		console.log(a>b);按照数值比较
		console.log(a==c);数值
		console.log(a===c);数值和类型



		3.逻辑运算符

		
			若逻辑运算符两边有操作数不为布尔类型,则运算结果不一定为布尔类型
			布尔类型扩展:0,'',undefined ,null均为假,其他都为真

			逻辑或:
				1.若第一个操作数为真,则第二个操作数不执行(结果为第一个操作数)
				2.若第一个操作数为假,则结果为第二个操作数
			逻辑与:
				1.若第一个操作数为假,则第二个操作数不执行
				2.若第一个操作数为真,则结果为第二个操作数
		
	1.	 console.log(true||false);
		 var a=5;
		 var b=4;

		 var c=a>=b||(a++)>b;
		 var c=a<=b||5;
		 var c=1||2;
		 var c=0||5;

		 console.log(c);
		 console.log(a,b,c);



	2.	var a=5;
		var b=4;

		 var c=a>=b&&(a--)>b;
		 var c1=a<=b&&(a--)>b;

		console.log(a,b,c);
		console.log(a,c1);

		console.log(a&&b);


		
	</script>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_44382073/article/details/86029693