二、JavaScript的语法

发布时间:2019-06-28 06:00:07发布者:Mr.Zhang阅读(439)

目录:

1、变量:存储数据的容器

2、数据类型

3、string数据类型

4、number数据类型

5、boolean数据类型

6、数据类型的隐式转换

6、数据类型转换函数

7、特殊类型

8、算术运算

9、关系运算

10、逻辑运算

11、条件运算符


 

 

1、变量:存储数据的容器

1)变量声明:使用关键字var声明变量,如var x,y;

变量命名常用于表示函数、变量等的名称。

 

注意事项:以var关键字声明,声明的时候不确定类型,变量的类型以赋值为准。

例如:

var x,y,z;         
    x = 10;        
    y = "mary";        
    z = true;

 

2)变量初始化:使用等号赋值

如:var count = 0;

注意事项:没有初始化的变量则自动取值为undefined

1)    变量命名规则:

1、不以数字开头的字母、数字、下划线、$。

2、不能和保留关键字重复,如var、function、number、string、break、if等。

3、  变量名有含义(见名知意)

4、  多个单词时,首字母小写,其余单词首字母大写。

5、  不要随意缩写命名,除公认的缩写外。

注:在JS中变量名是区分大小写的

2)    变量的分类

变量具有作用域:变量的有效范围

1、公共变量:定义在所有函数外,所有函数都可以使用。

2、局部变量:定义在函数内部的,仅函数中可以使用。

2、数据类型

1)基本类型:number数字、string字符串、boolean布尔

2)特殊类型:null空、undefined未定义

3)复杂类型:array数组、object对象

3、string数据类型

1)表示文本:由Unicode字符、数字、标点符号组成的序列。

2)首尾由单引号或双引号括起来。(只要引号括起来的都是字符串)

3)特殊字符需要转义,用转义符\,如:\n,\\,\',\“

例如:

var a = "欢迎来到\"JavaScript世界\"";

注意事项:可用在正则表达式,只允许录入汉字[^\u4e00-\u9fa5$],每个汉字都有转义符。

4、number数据类型

1)不区分整型数值和浮点型数值:所有数字都采用64位浮点格式存储,类似于double格式。

2)整数:

3)浮点数:使用小数点记录数据。

5、boolean数据类型

1)仅有两个值:true和false;实际运算中true=1,false=0

2)多用于结构控制语句。

 

6、数据类型的隐式转换

1)JavaScript属于松散类型的程序语言

①变量在声明时不需要指定数据类型。

②变量由赋值操作确定数据类型。

2)不同类型数据在计算过程中会自动进行转换

①数字+字符串:数字转换为字符串

②数字+布尔值:true转换为1,false转换为0

③字符串+布尔值:布尔值转换为字符串true或false

④布尔值+布尔值:布尔值转换为数值1或0

 var s="a";        
 var n=1;            
 var b1=true;              
 var b2=false;
 alert(s + n);//a1        
 alert(s + b1);//atrue                  
 alert(n + b1);//2       
 alert(b1 + b2);//1

 

6、数据类型转换函数

1)转换方式:

①隐式转换:直接转,默认的规则

②显式转换:利用转换的方法

注意事项:不建议用隐式转换。

2)显式转换

①toString:转成字符串,所有数据类型均可转换为string类型。

②parseInt:强制转换成整数,如果不能转换,则返回NaN。

例如:parseInt("6.12")=6(无四舍五入)

③parseFloat:牵制转换成浮点数,如果不能转换,则返回NaN。

例如:parseFloat("6.12")=6.12

④typeof:查询数值当前类型,返回string/number/boolean/object。

例如:typeof(“test”+3)="string"

3)NaN:not a number,非常特殊,它不是数字,所以任何数跟它都不相等,甚至NaN本身也不等于NaN

4)isNaN(str): is not a number,判断文本是否为数值,false为数值,true为非数值

5)案例

eg1:转换函数:得到录入数值的整数部分

<!--  html代码:   -->
<input type="text" id="txtData" />
<input type="button" value="得到录入数据的整数部分"  onclick="getInt();" />
//js代码:
<script type="text/javascript">
    function getInt() {   
        var str = document.getElementById("txtData").value;
        if (isNaN(str)) { 
            alert("请录入数值");
        }else {  
            var data = parseInt(str);
            alert("整数部分为:" + data);               
         }          
     }          
</script>

 

 

eg2:转换函数:计算录入数值的平方

<!--  html代码:   -->
<input type="text" id="txtData" />
<input type="button" value="计算平方" onclick="getSquare();" />
//js代码:
<script type="text/javascript">
    function getSquare() {      
        var str = document.getElementById("txtData").value;
        if (isNaN(str)){
            alert("请录入数值"); 
        }else {  
            var data = parseFloat(str);
            var result = data * data;    
            alert(result);       
        }     
    }    
</script>

7、特殊类型

1)null:null在程序中代表“无值”或者“无对象”。可以通过给一个变量赋值null来清除变量的内容。

2)undefined:声明了变量但从未赋值或这对象属性不存在。

8、算术运算

1)加(+)减(-)乘(*)除(/)余数(%)

         +=、-=、*=、/=、%=

         例如:i+=1等价于i=i+1

①“-”:可以表示减号,也可以表示负号。

②“+”:可以表示加法,也可以用于字符串的连接。

2)递增(++)递减(--)

i++等价于i=i+1,i--等价于i=i-1

9、关系运算

1)用于判断数据之间的大小关系:“>”、“<”、“>=”、“<=”、“==”、“!=”

注意事项:“= =“比较的是值(忽略类型)。

2)关系表达式的值为boolean类型(“true”或“false”)

3)严格相等:“===”类型、数值都相同。

4)非严格相等:!==

例如:

var a = "10";         
var b = 10;        
if(a == b) alert("equal"); 
if(a === b) alert("same");

 

10、逻辑运算

1)逻辑非(!)、逻辑(&&)、逻辑或(||)

2)逻辑运算的操作数均为boolean表达式

 

 

b1

b2

b1&&b2  

b1||b2

!b1

true

true

true

true

true

false

true

false

true

true

false

false

true

false

false

false

false

false

注:与:一假则假 、或:一真则真

11、条件运算符

1)if语句、if-else语句、if-else if-else语句、swich语句(流程控制语句)

2)语法:

表达式?代码块1: 代码块2

如:a>b?a比b大:b比a大;

if(表达式1){语句块1}else if(表达式2){语句块2}else{语句块3}

如:

当条件为true时,执行代码块1,否则执行代码块2

eg:猜数字

<!--  html代码:   -->
<input type="text" id="txtData" />
<input type="text" onblur="guessNumber(this.value);" />
<!--this代表当前对象-->

//js代码:
<script type="text/javascript">
function guessNumber(str) {//内置结果         
    var result = 10;
    if (isNaN(str)){
        alert("请录入数值");
    }else {         
        var data = parseFloat(str);
        var info = data > result ? "大了" : "小了";      
        alert(info);        
    }        
}    
</script>

 

程序默认情况下顺序执行,改变或者控制执行顺序。

1) if语句:①if(表达式){语句块1}else{语句块2}

               ②if(表达式1){语句块1}else if(表达式2){语句块2}else{语句块3}

     2)switch-case语句:

switch(表达式){

         case 值1:语句1;break;

         case 值2:语句2;break;         

         default:语句3;

}

注意事项:

1、  switch语句中包含:switch、case、break、default关键字。

2、  每个case后面仅带有一个值,并且相互之间不能相同。

3、  break:写在每个case或者defautl后面,表示关闭switch。

4、  default:可以写在switch结构的任何位置

 

3)for语句:

for(初始化;条件;增量){

         语句;

}

注意事项:初始化中的局部变量用var声明。

4)while语句

while(条件){

         语句1;

}

特点:先判断,后执行

5)while语句

         do{

                   语句1

}while(条件)

                  特点:先执行,后判断

注:可使用break或者continue中止循环

                       break:使用在switch表示跳出switch

                                 使用在循环中表示跳出循环

                       continue:使用在循环中,表示路过本次循环,进入下一次循环

 

 

案例:阶乘计算

<!--  html代码:   -->
<input type="button" value="求10的阶乘" onclick="getFac();" />

//js代码:
<script type="text/javascript">
function getFac() {     
    var result = 1;
    for (var i = 1; i <= 10; i++) {   
        result *= i;    
    }

    alert("10的阶乘为:" + result);                    
}        
</script>

ps:如果有什么错误,欢迎大家指出了,一起交流学习。






本文转自博客园,原文地址:https://www.cnblogs.com/LuMingfei/p/11100031.html