javascipt 基础

JavaScript简介
由浏览器解释执行的基于对象的脚本语言
用于表单验证和炫酷的特效制作
1995年更名成JavaScript，但是与java没有任何关系

特点：简单，安全，跨平台
组成：DOM（document object model）文档对象模型 --访问和操作HTML元素
BOM （blower object model）浏览器对象模型 --访问浏览器和操作浏览器
ECMAscript是js的扩展

三种引入方式：
（1）在元素中书写简单脚本程序
(2)

  <link rel="stylesheet" href="css文件路劲">实现HTML结构与css样式分离
  <script src="js文件路劲"></script> 实现HTML结构与js脚本分离。

1.JavaScript基本语法
区分大小写，变量不需要指定类型（弱变量），注释： //单行 /多行/
解释执行（逐行解释，该行出错，后面的不在运行）
2.JavaScript数据类型
关键字var 声明变量

五种原始类型（简单类型）
（1）Undefined-未定义类型未被赋值的变量，值为undefined
（2）Null-空类型-值为null，尚不存在的对象
（3）Boolean-布尔类型 值为true/false
（4）Number-数字类型，任何数字，包括整数和小数（NaN也是number类型，表示“非数”）
（5）String-字符串类型，值用引号（单引号或者双引号）括起来

   var x=10;//number
		x=3.14;  //number
		x=true; //boolean
		x=null; //object
		x=undefined;//undefined
		x='asasasas';
		x="hello";// String
		//在页面中显示(重构页面，同一行显示)
		document.write(x,typeof x)
		//在浏览器的控制台显示
		console.log(x)
		
		【注意】js变量是弱变量类型，对象和基本数据类型能够直接计算，会转化成string类型
		        防止脏数据  

数据类型相互转换：
     number()  转成数
     toString()转成字符串
     
     parseInt()转成整数
     parseFloat()转成小数
     
    //将字符串转换成数字
		var str="3.14";
		var x=Number(str); //1
		console.log(x,typeof x) //number
		
		x=parseInt(str)//2
		console.log(x,typeof x) //number
		
		x=parseFloat(str)//3
		console.log(x,typeof x)//number
		
		//数字转换成字符串
		var y=3.14
		var s2=y.toString()
		console.log(s2,typeof s2)

3.JavaScript流程控制

（1）选择结构
		//获取当前时间，时间0-12 上午好，12-18下午好  其他显示晚上好
			var date=new Date();
			document.write("日期"+date)
			//时间
			var hour=date.getHours();
			document.write("当前时间"+hour)
			
			//条件语句
			if(hour>0&&hour<12){
				document.write("上午好")
			}else if(hour>0&&hour<18){
				document.write("下午好")
			}else{
				document.write("晚上好")
			}
			
			//条件语句switch 等值匹配
			//星期一：上班第一天，心情一般般，  。。。。
		   var week=date.getDay(); //星期， getDate()日
		   switch(week){
		   	  case 1: document.write("今天是星期一，心情一般般");break;
		   	  case 2: document.write("今天是星期2，心情变好很多");break;
		   	  case 3: document.write("今天是星期3，心情棒棒的");break;
		   	  case 4: document.write("今天是星期4，心情美美的");break;
		   	  case 5: document.write("今天是星期5，心情非常好");break;
		   	  default: document.write("今天是休息日，心情好到爆！");break;
		   }
		   
		   //switch也可以区间判断，取代if-else-if -else
		   switch(true){
		   	  case hour>0&&hour<12: document.write("上午好");break;
		   	  case hour>0&&hour<18: document.write("上午好");break;
		   	  default: document.write("晚上好");break;
		   }
		   
  （2）循环结构

函数：
提高代码复用性
定义
（1）function 函数名(参数列表){
函数体
[return 返回值]
}
调用
函数名()
【注意】js没有函数重载一说:在同一个文件中，方法名相同不管参数列表是否相同，都会认为是同一个函数，后面的同名函数会覆盖前面的同名的函数
//即 相当于只定义了一个方法
js调用函数时，实参有没有都不会报错

（2） 使用变量方式定义
var 函数名=new Function(参数列表字符串，函数体字符串)

		var sum=new Function("x","y","document.write('hello');return x+y;");
		//调用
		var r=sum(12,34);
		alert(r)

arguments关键字
目的：操作参数，弥补函数重载

function sum(){
			var len=arguments.length
			//没有参数：参数个数为0
			if(len==0){
				alert("参数个数为0")
			}
			//有1个，参数个数为0 返回该数
			if(len==1){
				alert(arguments[0])
			}
			//2，参数个数为2，返回这两个数的和
			if(len==2){
				var r=arguments[0]+arguments[1]
				alert(arguments[0]+"和"+arguments[1]+"的和是"+r)
			}else{
				alert("调用有误！")
			}

		}
		
		sum(10,20,23,34);

课后作业提示
（1）可输入的弹出框 prompt()
(2)获取元素的值
div span p h1文本 document.getElemntById(“元素的id名”).innerText
input值 document.getElemntById(“元素的id名”).value

数组：
  （1）可以存放不同的数据类型，长度可以动态扩充
  （2）定义数组new Array() ,[元素]
  （3）遍历 for循环  for(var i in 数组名){数组名[i]}  //i为下标

//1.Array对象定义数组
var arr=new Array(“山西”,“贵州”,“内蒙古”,“新疆”)
arr[10]=undefined;
arr[40]=“黑龙江” //自动扩容
console.log(“数组长度”,arr.length)//41
//遍历：对于未定义的值undefined
for(var i=0;i<arr.length;i++){
document.write(arr[i]+"
")
}
//遍历方式2(会过滤掉未赋值的undefined项，推荐)
for(var x in arr){
document.write(“下标”+x+"，值"+arr[x]+"
")

		//2.直接定义数组
		var arr2=["山西","贵州","内蒙古","新疆",3.14,true,10,new Date(),null]
		for(var x in arr2){
			document.write("下标"+x+"，值"+arr2[x]+"<br>")
		}         
		   
//练习：输入英雄个数，并输入英雄名，将英雄存放在一个数组中，
        点击“显示”按钮，将所有英雄显示在ul列表中