js--EcmaScript(一)

变量


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<!--js代码不能直接写,需要用script标签来包裹
			js是一种弱类型的脚本语言,即语法没有严格的要求和限制,任何类型的变量都是用var来声明,
			不同类型的变量可以用一个var来声明。
			
		-->
		<script>
			//声明变量
			 var age;
			 var name;
			//赋值
			age=18;
			name="张三";
			//声明和赋值一起
			var city="武汉",address="江夏区";
			console.log("变量age的类型:"+typeof(age));
			console.log("变量name的类型:"+typeof(name));
		</script>
	</body>
</html>

在这里插入图片描述

引用外部js文件


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
	<!--	引用外部js文件
		注意:如果script标签引用了外部js,那么就不要在script标签里面书写js脚本,因为里面的js脚本是不会执行的
	-->
		<script src="../js/index.js">
			 //不要在引用外部js文件的script标签里面写js脚本
			//  console.log("我能输出在控制台吗?");
		</script>
	</body>
</html>

基本数据类型


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<script>
			 /* js的基本数据类型
			  *   1.number:包含整型,浮点型,NaN,Infinity
			  *   2. boolean:包含true,false两个值
			  *   3.undefined:表示已声明但未赋值的变量的类型
			  *   4.string: 表示''或者""包裹的字符的集合
			  *   5.null:空值,如果一个变量值为null,它是空对象,null值本身的类型又是object
			  * */
			  
			 var age=18;
			 var score=65.5;
			 console.log("age的类型:"+typeof(age));  //number	 
			 console.log("score的类型:"+typeof score);//number	 
			   
			 var s=Number("a111"); //Number():将参数转换为数字,如果参数包含了不能转换为数字的字符,则转换失败
			   //,结果就是非数字(not a number)
			   
			 console.log(s);  //NaN
			 var s2=Number("111"); 
			 console.log(s2); //111
			 //isNaN():判断参数是不是NaN,如果是就返回true,否则返回false
			   var b=isNaN(s);
			 console.log(b);//false
			 var c=-10/0;
			 console.log(c+",type:"+typeof c); //Infinity:正无穷大,-Infinity:负无穷大
			 
			 var f=true;
			 console.log(typeof f);//boolean
			 
			 f=!f;
			 console.log(f+",type:"+typeof f);
			 var a;
			 console.log(a+"..."+typeof a);  //类型:undefined,值:undefined
			 
			 var str="hello";
			 var city='wuhan';
			 str=str+city;
			 console.log(str+".."+typeof str);//类型:string
			 var obj=null;
			 console.log(typeof obj);//object
			 
		</script>
		
	</body>
</html>

在这里插入图片描述

基本类型转换

<head>
	<meta charset="UTF-8">
	<title></title>
</head>

<body>
	<script>
		/*1.强制类型转换
		 *  3个转换函数
		 *   1)Number():把参数转换为数字,如果参数的某一部分不是数字,就转换失败,返回NaN
		 *   2)Boolean(value):把参数转换为boolean类型,
		 *   * 当value其值为 0、-0、null、""、false、undefined 或 NaN 时,
		 *   那么Boolean()转换成Boolean类型的值为 false。
		 *   3)String(value):把参数转换为字符串
		 *2.隐式类型转换
		 *   当两种不同数据类型的变量进行+连接的时候,浏览器的js引擎如何解释它?
		 *   浏览器的js引擎会隐式的调用强制转换函数,将其中的一个值转换为另一个值的类型
		 *   如果是String类型连接另一个类型,那么默认String类型优先,即另一个类会转换为String类型
		 * 
		 * 3.转换函数
		 *   parseInt():将参数转换为一个整数,只转换参数中的数字部分,非数字部分忽略,如果参数都不是数字那么返回NaN
		 *   parseFloat():将参数转换为一个浮点数,只转换参数中的数字部分
		 *    
		 * */

		var a = Number("111");
		console.log(a);
		a = Number("111sxt");
		console.log(a);
		var b = Boolean(null);
		console.log(b); //false
		b = Boolean("null");
		console.log(b); //true
		b = Boolean("undefined");
		console.log(b); //true

		var c; //值undefined
		var d = String(c);
		console.log(d + "..." + typeof d); //d:'undefined',类型:string
		var h = "hello" + 2019; //此时相当于"hello"+String(2019)
		console.log(h);
		d = "22" + true;
		console.log(d);
		var obj; //obj:undefined
		if(obj) { //此处会调用Boolean(obj),结果是false
			console.log('obj是一个对象,已赋值');
		} else {
			console.log('obj不是一个对象,未赋值');
		}
		var e = 11;
		var f = 22;
		console.log("e + f"); // 输出:e+f 数据类型:string
		console.log(e + "f"); // 输出:11f 数据类型:string
		console.log(e + f); // 输出:33数据类型:number
		
		var m="111sxt";
		m=parseInt(m);
		console.log(m+"...type:"+typeof m);//111
		m=parseInt("sxt222");
		console.log(m+"...type:"+typeof m);//NaN
		
		m="111.22sxt";
		m=parseFloat(m);
		console.log(m+"...type:"+typeof m);//111.22
	</script>

</body>

在这里插入图片描述

弹出框


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<script>
		/*	弹出框
		 * 1.alert():普通的弹出框,纯提示作用
		 * 2.prompt():弹出一个带有输入框的弹出框,可以让用户输入信息
		 *   参数1:对话框上的提示文本   参数2:输入框里的默认value
		 *  返回值是用户输入的值
		 * 3.cofirm():弹出一个带有确定和取消按钮的弹出框,用于提示用户是否要进行某个操作
		 *   返回值是true或false,如果用户点击了确定按钮,就返回true,否则返回false
		 * */
		
		alert('hello world!');
		
		var age=prompt('请输入您的年龄',20);
		console.log('您输入的年龄:'+age);
		  //confirm()在我们后面的web项目开发中用来提示用户是否要删除数据
		 var flag= confirm('是否真的要删除该数据');
		  if(flag){
		  	   console.log("您点击了确定按钮");   
		  }else{
		  	console.log("您点击了取消按钮"); 
		  }
		</script>
	</body>
</html>

在这里插入图片描述

循环结构


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		 <script>
		 	 // 输出1-20之间的偶数的和,输出在网页上
		 	 var sum=0;
		 	 for(var i=1;i<=20;i++ ){
		 	 	   if(i%2==0){
		 	 	   	 sum+=i;
		 	 	   }
		 	 }
		 	 document.write("1到20的偶数和:"+sum);
		 	 
		 </script>
	</body>
</html>

在这里插入图片描述

运算符


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
	<!--	===:全等于,比较的两个操作数的数据类型和值都相同时,才返回true,否则返回false
		    ==:等于,只 比较内容(值),不比较类型,只要内容相同,就返回true
		    ||:或,如果两个操作数都是boolean,, 如果第一个参数为true,则直接返回第一个数.
		     如果第一个参数为false,则直接返回第2个数;
		     如果两个操作数都不是boolean,此时js引擎会将第1个参数隐式转换为boolean类型返回true或false,
		     如果第1个数转换后结果是true,就直接返回第1个数;如果第1个数转换后是false,就返回第2个数
		     
		     
	-->
	 <script>
	 	var a=12;
	 	var b="12";
	 	console.log(a===b);//false
	 	console.log(a==b);//true
	 	
	 	a=true,b=false;
	 	 var c=a||b;
	 	 console.log(c);
	 	 
	 	 a="111",b="222";
	 	 c=a||b;
	 	 console.log(c); //111
	 	 a=undefined;  
	 	 c=a||b;//调用Boolean(a)得到false, false||b
	 		 console.log(c); //222
	 		 //三目运算符: 表达式?e1:e2,如果表达式成立,就执行e1,否则执行e2
	 		 //任意2个数,返回其中较大的那个数
	 	 var m=9,n=12;
	 	 var max= m>n?m:n;
	 	 console.log("较大的数:"+max);
	 </script>
	</body>
</html>

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值