zoukankan      html  css  js  c++  java
  • 小强的HTML5移动开发之路(28)—— JavaScript回顾3

    一、基本数据类型

    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类型请看下一篇
  • 相关阅读:
    2021.9.15 单一职责原则
    2021.9.21 Hive元数据
    2021.9.22 抽象工厂方法模式(人与肤色)
    2021.9.25 Hive安装
    1021每日博客
    1027每日博客
    1018每日博客
    1028每日博客
    1026每日博客
    1025每日博客
  • 原文地址:https://www.cnblogs.com/lanzhi/p/6469285.html
Copyright © 2011-2022 走看看