小强的HTML5移动开发之路（28）—— JavaScript回顾3_H5之家

一、基本数据类型

number:数字类型

string:字符串 (注意s小写：string是基本类型)

boolean:布尔类型 //前三个都有对应的包装类

null：空类型

undefined:未定义类型

测试一：

<html>
	<!--基本类型测试-->
	<head>
		<script>
			function f1(){   //number类型
        /*有返回值时也不能function void f1(){}*/
				alert('hello');
	/*alert(); 弹出消息框*/
				alert('hehe');
				var i=100;
	//js当中字符串可用单引号也可用双引号
				i='hello';
        //typeof是一个运算符，可以返回变量实际存放的数据的类型
				alert(typeof i);
	/*js是弱类型语言 不能： number i=100; 不能在声明时指明其类型，在运行时才能确定*/
			}
			function f2(){   //string类型
				var str1='hello';
				var str2='hello';
				if(str1==str2){
					alert("str1==str2");
				}else{
					alert("str1!=str2");
				}
				var str3='100';
				var i=100;
				if(str3==i){ //两个＝号，进行类型转换
					alert("str3==i");
				}else{
					alert("str3!=i");
				}
				if(str3===i){ //三个=号，不进行类型转换
					alert("str3==i");
				}else{
					alert("str3!=i");
				}
			}
			function f3(){  //boolean类型
				//布尔类型只有两个值：true/false;
				var flag=true;
				alert(typeof flag);
			  //var str="abc";
				var str=new Object();//创建一个对象,对象会转换为true;
				var str=null; //转换为false;
				var str;  //undefined 转换为false;
				//强制转换，非空的字符串转换为true,非零的数字转换为true;
				if(str){
					alert('结果为真');
				}else{
					alert('结果为假');
				}
			}
			function f4(){  //null类型
				var obj=null;
			//null类型只有一个值——null;
			//输出的结果是Object
				alert(typeof obj);
			}
			function f5(){ //undefined类型
				var obj;
				alert(typeof obj);
			}
		</script>	
	</head>
	<body style="font-size:30px;">
		<input type="button" value="演示基本类型的使用"
		onclick="f1();"/>
	</body>
</html>

测试二：parseInt

<html>	
	<head>
		<script>
		/*number--->string
		  string---->number
		*/
			function f1(){  //字符串变数字
		//		var str1='fsfs';     读出NaN
		//              var str1="1234fsfs";  可以读出1234
		//              var str1="fsfs1234";   不可以读出
		//              var str1="22323.08";
				var str1='1234';
		//window.parseInt();  window可以省略
				var n1=parseInt(str1);
//js浮点运算会有误差，先放大x倍，再缩小x倍
 		//		var n2=parseFloat(str1);
		//undefined + 数字 ＝ NaN
				alert(n1+100);
			}
			function f2(){
				var n1=100;
		//number--->Number(对应的包装类型)  再调用toString();
				var s1=n1.toString();
			//      var s1=n1+'';
			}
		</script>
	</head>
	<body>
		<input type="button" value="演示基本数据类型" onclick="f1();"/>
	</body>
</html>

测试三：string的方法

length属性：返回字符串的长度

charAt(index):返回指定位置的字符

substring(from,to):返回子字符串

indexOf(str):返回字符串在原字符串中的位置

lastIndexOf(str):

match(regexp):返回符合正则表达式的一个数组

截取

	function f4(){ //string的方法
		var str1="abcdef";
		var str2=str1.substring(1,4);
		alert(str2);
	}

正则

	function f5(){
		var str="asdfas12323adfasf23423";
   //在js中用/reg/,在执行时，会将//内的内容转换成一个RegExp对象
		var reg=/[0-9]+/g;  
   //reg中是一个对象，不是字符串,注意加一个g搜索整个字符串，还有i忽略大小写。
		var arr=str.match(reg);
		alert(arr);
	}

查找

	function f6(){
		var str1="sdf1223asdfasf23423";
		var reg=/[0-9]+/;
		//alert(typeof reg);
		alert(reg instanceof RegExp);
		var index = str1.search(reg);
		alert(index);
	}

替换

	function f7(){
		var str1="sdf444asdfadf4423";
		var reg=/[0-9]+/g;
		var str2 = str1.replace(reg,'888');
		alert(str2);
	}

二、Object类型（数组、函数，其他的在下一篇中）

1、数组

js数组的长度可变

js数组元素是任意的(可以混合存放不同类型的数据)

<html>
	<head>
		<script>
			function f1(){  //创建数组的第一种方式
				var arr=new Array();  //()可以省略不写
				arr[0]=1;
				arr[3]=2;
				arr[5]='abc';
				alert(arr.length);
				alert(arr[1]);
				alert(arr[3]);		
			}
			function f2(){ //第二种方式
				var arr=[];
				arr[0]=1;
				arr[3]=22;
				var arr=[1,2,3,4,5,6];
				arr[7]=11;
				alert(arr.length);
			}
			function f3(){ //多维数组的创建
				var arr = new Array();
				arr[0]=[1,2,3,4,5];
				arr[1]=[6,7,8,9,10,11,12,13];
				arr[2]=[14,15,16,17,18,19];
				for(var i=0;i<arr.length;i++){
					for(j=0;j<arr[i].length;j++){
						alert(arr[i][j]);
					}
				}
			}
			function f4(){ //数组常用的属性和方法
				var arr=[11,22,33,44];
				arr.length=2;  //数组的长度可以写,后面的被砍掉
				alert(arr);
				alert(typeof abc);
			}
		</script>
	</head>
	<body>
		<input type="button" value="数组的使用" onclick="f4()"/>
	</body>
</html>

数组中的一些函数

<html>
	<head>
		<script>
			function f1(){
				var a1 = [1, 2, 3];
				var str = a1.join(|);
				alert(str);
			}
			function f2(){
				var a1 = [1, 2, 3];
				 var a2 = [4, 5, 6];
				 var a3 = a1.concat(a2); //数组连接
				 alert(a3);
			}
			function f4(){
				var a1 = [1, 2, 3];
				var a2 = a1.reverse(); //是对原有数组翻转
				alert(a2);
				alert(a1);  //原数组变了
			}
			function f5(){
				var a1 = [1, 2, 3, 4, 5, 6];
				var a2 = a1.slice(2,4); //对数组截取
				alert(a2);
				alert(a1); //原数组没有变化
			}
			function f6(){
				var a1 = [5, 1, 7, 2, 8];
				var a2 = a1.sort(); //从小到大
				alert(a2);
			}
			function f7(){
				var a1 = [15, 111, 7, 22, 88];
				var a2 = a1.sort(); //默认按照字典顺序排序
				alert(a2); 
			}
			function f8(){
				var a1 = [15, 111, 7, 22, 88];
				var a2 = a1.sort(function(t1, t2){
					return t2-t1;
				}); 
				alert(a2); 
			}
			function f9(){  //按照字符串长度排序
				var a1 = ['abc', 'bb', 'casd', 'a'];
				var a2 = a1.sort(function(t3, t4){
					return t4.length-t3.length;
				}); 
				alert(a2); 
			}
		</script>
	</head>
	<body>
		<input type="button" value="click me" onclick="f9()"/>
	</body>
</html>

2、函数

定义一个函数

function 函数名(参数){

函数体

}

要注意的几个问题

a.不能有返回类型的声明，但是可以有返回值。

b.函数其本质是一个对象，是Function类型的实例，函数名是一个变量，存放了这个对象的地址(函数名是一个变量)

c.在函数内部，可以使用arguments对象访问参数

d.函数不能重载

<html>
	<!--函数的使用-->
	<head>
		<script>
			function add(a1, a2){
				return a1+a2;
			}
			function test(){
				var sum = add(1, 1);
				alert(sum);
			}
			function test2(){
			//	alert(typeof add);
				alert(add instanceof Function);  //函数是Function类型的实例
				var f2 = add; 			//存放的是对象的地址
				add = null; 			 //add指向空
				var sum = f2(1, 1); 		//等价于 add(1, 1);
				alert(sum);
			}
			function add2(arg1, arg2){
				//return  arg1 + arg2;
				return arguments[0]+arguments[1];
			}
			function add3(arg1, arg2){  //首先指向一个对象
				return arg1+arg2+100;
			}
			function add3(){	//指向了另一个对象
				return arguments[0]+arguments[1];
			}
			function test3(){
				//var sum = add2(1);         //结果为NaN,因为arg2是undifined
				//var sum(1, 1, 1);    //结果为2
				//var sum=add(1, 1);
				//var sum = add2(1, 1, 1);
				var sum = add3(1, 1);
				alert(sum);
			}
		</script>
	</head>
	<body>
		<input type="button" value="click me" onclick="test3()"/>
	</body>
</html>

其他Object类型请看下一篇