首页 > web前端 > js教程 > 正文

关于JavaScript基础的相关讲解

jacklove
发布: 2018-06-20 15:37:35
原创
2065人浏览过

JavaScript的变量及数据类型问题:

        关于JavaScript中的变量定义:

                var  变量名 = 值;

        注意:

                1> 在js中,var可以用来定义任何数据类型的变量,可以省略,但不建议省略;
                2> var可以重复定义变量(后面的值会被覆盖掉),是因为JavaScript弱类型语言,而Java是一种强类型语言;
                3> 如果一个变量,但是变量没有值(undefined),没有定义的变量不能直接使用;

        JavaScript的数据类型:
                1> 不管是整数还是小数都是number类型;
                2> 不管是整数还是小数都是number类型(小写);
                3> boolean类型;
                4> object:对象类型;

        举例:

<script type="text/javascript">
		
	//定义变量
	var a = 10 ;
	
	//重复定义
	//var a  ;
	
	var b = 12.34 ;
	var c = 'a' ;
	var d = "hello" ;
	var e = true ; 
	var f = new Object() ;
	
	//输出变量
	document.write("a的值是:"+a+",a的数据类型是:"+typeof(a)+"<br/>") ;
	document.write("b的值是:"+b+",b的数据类型是:"+typeof(b)+"<br/>") ;
	document.write("c的值是:"+c+",c的数据类型是:"+typeof(c)+"<br/>") ;
	document.write("d的值是:"+d+",d的数据类型是:"+typeof(d)+"<br/>") ;
	document.write("e的值是:"+e+",e的数据类型是:"+typeof(e)+"<br/>") ;
	document.write("f的值是:"+f+",f的数据类型是:"+typeof(f)+"<br/>") ;
</script>
登录后复制

数据转换函数:

        string----number类型的整数 parseInt(变量);

        stirng----number类型的小数 parseFloat(变量);

        举例:

<script type="text/javascript">
	//定义一个变量
	var a = "10" ; //string :里面的值10
	document.write("转换前a的数据类型是:"+typeof(a)+"<br/>") ;
	
	//转换
	a = parseInt(a) ;
	document.write("转换后a的数据类型是:"+typeof(a)+",值是:"+a) ;
	
	document.write("<hr/>") ;
	
	var b = "3.14" ;
	document.write("转换前b的数据类型是:"+typeof(b)+"<br/>");
		
	//转换
	b = parseFloat(b) ;
	document.write("转换后b的数据类型是:"+typeof(b)+",值是:"+b+"<br/") ;
	
</script>
登录后复制

JavaScript中的运算符:

        算术运算符:+(加),-(减),*(乘),/(除);
        比较运算符:>=, . . . ;
        逻辑运算符:&&(逻辑双与),||(逻辑双或),!(逻辑非);
        三元运算符:表达式?true的结果:false的结果;
                注意:JavaScript中true代表1,false代表0;

        举例:

<script type="text/javascript">
	var a = 10;
	var b = 20 ;
	document.write((a+true)+"<br/>") ;  //11
	document.write(a-b) ;  //-10
	
	var a = 10;
	var b = 20 ;
	document.write(a<=b) ;
	
	document.write((false && true)+"<br/>") ;
	document.write((ftrue && true+)"<br/>") ;
	
	document.write("<hr/>") ;

	var age = 12 ;
	document.write((age >= 18 ? "成年人": "未成年人")) ;
</script>
登录后复制

流程语句:

        if语句:
                格式:

                        if(表达式){
                                语句1;
                        } else {
                                语句2;
                        }
                表达式的类型:
                        1> 如果是numbler类型,(整数类型,小数),0表示条件不成立;
                        2> 如果是string类型,要么字符要么字符串,必须有数据,如果是空串,条件不成立;
                        3> 如果是boolean类型,true成立,false不成立;
                        4> 如果是object类型,必须有对象,才成立,为null不成立;

        switch语句:
                格式:
                        和Java相同;
                和Java的区别:
                        1> js中的case后面也可以跟常量,还可以跟变量,还可以跟表达式;
                        2> java中case后面只能跟常量;

                举例:

<script type="text/javascript">
        //case后面跟表达式
        var age = 25 ;
        switch(true){
            case age >=18 :
                document.write("你是成年人...") ;
                break;
            case age<18 :
                document.write("你是未成年人呢...") ;
                break ;
        }

        document.write("<hr/>");

        var i = "b" ;  //和Java语言一样,case后面可以常量,
        var b = "b" ;
        switch(i){
            case "a" :
                document.write("a") ;
                break ;
            case b :
                document.write("b") ;
                break ;
            case "c" :
                document.write("c") ;
                break ;
            case "d":
                document.write("d") ;
                break ;
        }
</script>
登录后复制

JavaScript中的循环语句:

        如:do-while,for,while 循环语句与java中的循环语法结构相同;

        练习:

<script type="text/javascript">
	
	//显示"*"形,第一行有一个...
	for(var i = 0 ; i<5; i++){//外层循环控制行数
		for(var j= 0 ; j<=i; j ++){//内层循环控制列数
			document.write("* ") ; //  空格 转义字符
			
		}
		document.write("<br/>") ;
	}
	
	
	document.write("<hr/>") ;
	
	//table标签:  使用js里面嵌套表格标签
	//document.write("<table align='center'>") ;
	for(var i = 1 ; i <=9 ; i++){
		//
		for(var j = 1 ; j<=i ;j++){
			document.write(i+"*"+j+"="+(i*j)+" ") ;
		}
		document.write("<br/>") ;
	}
</script>
登录后复制

wIth语句:

        格式:
                with(document){
                        语句;

                }

        特点:将document对象当做witch语句参数,然后直接使用它里面的write();

        举例:

<script type="text/javascript">
	
	//with语句:格式 with(document){....}
	//将document对象当做witch语句参数,然后直接使用它里面的write() ;
	
	//with语句
	with(document){
		for(var i = 0 ; i < 5 ; i ++){
			for(var j = 0 ; j <=i ; j++){
				write("* ");
			}
			write("<br/>") ;
		}
		
		
		write("<hr/>") ;
		
		for(var i = 1 ; i <=9 ; i++){
			for(var j = 1 ; j <= i ;j++){
				write(i+"*"+j+"="+(i*j)+" ") ;
			}
			write("<br/>") ;
		}
	}
	
</script>
登录后复制

for-in语句:

        作用:针对数组或者对象进行遍历;
        格式:
                for(var 遍历的变量名 in 数组名称/对象名称){
                        输出变量名;
                }
        举例:

<script type="text/javascript">
    var arr = [10,20,30,40] ; //类似于Java中的静态初始化
	
	for(var i =0 ; i < arr.length; i++){
		document.write(arr[i] +" ") ;
	}
	
	document.write("<hr/>");
	
	//使用for-in语句
	for(var i in arr){
		document.write(arr[i] +" ") ;
	}
登录后复制
</script>
登录后复制

函数:

        格式:

                function 函数名称(形式参数列表){
                        语句;

                }

        函数调用:

                函数名称(实际参数列表);

        函数中注意的问题:
                1> 函数的形式参数不能有var关键字定义,否则报错;
                2> 在js中函数是可以有return语句的,直接return,但是没有返回值;
                3> 在js中,函数是不存在的重载概念,后面定义的函数回覆盖掉前面定义的函数;
                4> 当实际参数的数量小于形式参数的数量,就会出现一个值肯定是NaN;
                      如果实际参数大于形式参数,那么最终会计算前面的值,然后将后面的数据丢弃掉;

                5> 在js的每一个函数中,里面存在默认的数组:arguments,它的作用就是将实际参数从左到右依次赋值给形式参数(从左到右);

        举例:

开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号