(JS)JS基础概念

运行在浏览器的脚本语言，简称JS
JS是运行在浏览器上的脚本语言

HTML中嵌入JS语言的三种方式：
第一种，在标签属性后面加
第二种，在文件里加入js代码块
第三种：

JS的变量

<script type="text/javascript">
			/*
				JS中的变量：
					变量声明语句：
					var 变量名;
					变量赋值语句：
					变量名 = 值;
					 
				js是一种弱类型语言，没有编译阶段，可以给变量随意赋任何类型的值
			*/
			var i;
			alert("i" = i);  //不赋值会默认赋值undefined, undefined为一个值
			
			//一个变量没有声明直接用会报错
			alert(age);
			
			var a,b,c = 200;
			alert(c);
			
			a = "0";
			alert(a);
			a = 10;
			alert(a);
		</script>

JS中的函数

1.函数初步

/*
			JS中函数的语法格式
			第一种方式
				function 函数名(形式参数列表){
				函数体;
			}
			第二种方式
				函数名 = function(形式参数列表){
					函数体;
				}
				JS中的函数不需要指定返回值类型，返回什么类型都行
			*/
			function sum(a,b){
				//a和b都是局部变量,他们都是形式参数(a,b不需要指定变量类型)
				alert(a+b);	
			}
			sum(10,20);//函数必须调用时才能执行
		</script>
		
		<!--还可以这样调用函数-->
		<input type = "button" value = "30和40的求和" onclick="sum(30,40);">

2.函数进阶

<script type="text/javascript">
			/*
				JS中的方法 ，参数的变量类型，以及参数数量没有限制
			*/
			alert(2);
			function sum(a,b){
				return a+b;
			}
			var returnvalue = sum(1,2);
			alert(returnvlaue);
			
			returnvalue = sum(2);
			alert(returnvalue);//输出NAN,NAN是一个具体的值
						
			//可以连接两个字符串
			returnvalue = sum("wen");
			alert(returnvalue);//输出wenundefined
			
			//数字和字符串连接
			returnvalue = sum(1,"wen");
			alert(returnvalue);
			
			//字符串和数字连接
			returnvalue = sum("wen",1);
			alert(returnvalue);
			
			
			/*
				JS中两个同名函数出现，后面的会覆盖掉前面的
			*/
		   function test(username){
			   alert("test1");
		   }
		   function test(){
			   alert("test1test1");
		   }
		</script>

3.局部变量与全局变量

<script type="text/javascript">
			/*
			全局变量：
				在函数体之外生命的变量属于全局变量，全局变量的生命周期是：
					浏览器打开时声明，浏览器关闭时销毁，尽量少用。因为全局
					变量会一直在浏览器的内存中，耗费内存空间。能使用局部变量
					尽量使用局部变量
			局部变量：
				在函数体当中生命的变量，包括一个函数的形参都属于局部变量
				局部变量的生命周期是，函数开始执行时局部变量的内存空间开辟
				函数执行结束之后，局部变量的内存空间开始释放。局部变量生命
				周期较短
				
			*/
		  
		//全局变量
		var username = "zhangsnaa";
		
		function fun(){
			//局部变量
			var username = "lisi";
			//就近原则
			alert(username);
		}
		fun();
		
		alert(username);
		
		//以下语法很奇怪
		function myfun(){
			name = "wangwu";
		}
		myfun();
		alert(name); //这里会输出wangwu
		//通过以上注意,当一个变量在任何位置没有var声明时,他都是一个全局变量,即使是在函数体内声明的.
		</script>

JS的数据类型

1.typeof
动态获取数据类型

<script type = "text/javascript">
			/*
				1.JS中的数据类型：原始类型，引用类型
				原始类型：Undefined,Number,String,Boolean,Null
				引用类型:Object以及Object的子类 
				2.ES规范，在ES6之后，又基于以上6中数据类型之外添加了一种新的类型：Symbol
				
				3.JS中有一个运算符叫做typeof，这个运算符可以在程序的运行阶段动态的获取变量的数据类型
					语法格式：typeof 变量名
					typeof运算符的结果是以下6个字符串值以，注意字符串都是全部小写
						"undefined"
						"number"
						"string"
						"boolean"
						"object"
						"function"
				4.js中比较字符串是否相等，同'== '
			*/
			function sum(a,b){
				if(typeof a == "number"&&typeof b == "number"){
					return a+b;
				}
				alert("a和b必须为数字");
			}
			
			var returnvalue = sum(1,2);
				alert(returnvalue);
				returnvalue = sum("sd",2);
				alert(returnvalue);
		</script>

2.Undefined类型
Undefined类型只有一个值，这个值就是undefined
当一个变量没有手动赋值，系统默认赋值为undefined
或者也可以一个变量手动赋值undefined

<script type="text/javascript">
	var i ;
	var k = undefined;
	var s = "undefined";
	alert(i == k); //true
	alert(k == s); //false
</script>

3.Number类型

<script type="text/javascript">
			/* 1.Number类型包括哪些值？
				整数,小数,正数,负数,不是数字(NAN),无穷大都属于Number类型(Infinity) */
				
			var i = 10;
			var j = "ds";
			k = i/j;
			alert(typeof k);
			alert(typeof i/j);
			//Infinity(当除数为0的时候，结果为无穷大)
			alert(typeof 10/0);
			
			//关于isNaN(数据),结果是true表示不是一个数字,结果是false表示是一个数字
			function sum(a,b){
				if(isNaN(a)||isNaN(b)){
					alert("参与运算的必须是数字");
					return;
				}
				return a+b;
			}
			
			
			/*
			parseInt();//可以将字符串自动转换为数字，并且取整数位
			parseFloat();//可以将字符串自动转换为数字
			Math.ceil();//向上取整
			*/
		   
		</script> 

4.布尔类型

<script type="text/javascript">
			/*
				1.JS中的布尔类型永远都只有：true和false
				2.在Boolean类型中有一个函数叫做：Boolean().
				语法格式：
					Boolean(数据);
				Boolean()函数的作用是将非布尔类型转换成布尔类型
					
			*/
		   
		   /*
				在if里面放入的数据会自动被转换为布尔类型
		   */
		  var name = "bob";
		  if(name){
			  alert("welcome"+name);
		  }else{
			  alert("输入不能为空");
		  }
		  
		  
		  /*
			观察以下数据被转换成true还是false
		  */
		  alert(Boolean(1));//true
		  alert(Boolean(0));//false
		  alert(Boolean(""));//false
		  alert(Boolean("abc"));//true 
		  alert(Boolean(null));//false
		  alert(Boolean(NaN));//false
		  alert(Boolean(undefined));//false
		  alert(Boolean(Infinity));//true
		  
		  
			
		</script>

String类型

/*
				1.字符串的创建：单引号双引号均可
					var s = 'wen';
					var s = "wen";
				2.JS中创建字符串类型的方法
					var s1 = "abc";  //小String,是String类型
					var s2 = new String("abc");//大String，是Object类型
					大小String类型的属性是通用的
					
				3.String类型下的常用函数
					indexOf(字符串) 	获取指定字符串在当前字符串中第一次出现处的索引
					length 		获取指定字符串在当前字符串中最后一次出现处的索引
					replace		替换
					substr		截取子字符串
					substring	截取子字符串
					toLowerCase	转换小写
					toUpperCase	转换大写
					split		拆分字符串
			*/
		   var name = "name%wen%sd%fs"
		   alert(name.replace("%","&"));  //只会替换一个,要想全部替换,要用到正则表达式
		   
		   //考点：substr和substring的区别
		   name = "abcdefg";
		   //substr(startIndex,length)
		   alter(name.substr(2,4));
		   //substring(startIndex,endIndex);要注意的是不包含endIndex
		   alter(name.substring(2,4));

Object类型

<script type="text/javascript">
			/*
				1.Object是所有类型的超类
				2.Object类包括哪些属性？
					prototype属性(常用的)，作用是给类动态的扩展属性和函数。
					constructor属性
				3.Object类包括哪些函数
					toString();
					valueOf();
					toLcoalString();
				4.在JS当中定义的类默认继承Object，会继承Object类中所有的属性以及函数
				换句话说，自己定义的类中也有prototype
				
				5.在JS中怎么定义，怎么new对象
				定义类的语法：
					第一种方式:
					function 类名(形参){
						
					}
					第二种方式：
					类名 = function(形参){
						
					}
				实例化类：
					new 类名();
					
				看起来和函数的定义很像，在调用的时候，使用了new就代表是实例化一个Object
			*/
		   function Student(){
			   alert("student...");
		   }
		   Student();
		   var j = new Student();
		   alert(j);
		   
		   //类的定义同时也是类构造器的定义
		   function User(no,name,age){
			   this.no = no;
			   this.name = name;
			   this.age = no,name,age;
		   }
		   
		   var u1 = new User(12,"wen",23);
		   alert(u1.age);
		   alert(u1["name"]);
		   
		  
		   //prototype的使用
		  Product = function(no,price){
			  this.no = no;
			  this.price = price;
			  
			 getPrice = function(){
				  return this.price;
			  }
		  }
		  alert(26);
		  var p1 = new Product(2,23);
		  //prototype可以动态的改变类的属性,可以给类添加函数
		  Product.prototype.getno = function(){
			  alert("介是嘛雅");
			  return this.no
		  }
		  p1.getno();
	
		  var pri = p1.getPrice();
		  alert(p1.price);
		  alert(27);
		  alert(pri);
		   
		</script>

NAN，null,undefined 三者有什么区别

1.三者数据类型不一样
2.null和undefined可以等同
3.'=='等同运算符，判断值是否相同      '==='全等运算符，不但要判断值是否相同，同时要判断数据类型是否相同