二、JavaScript的语法

目录：

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

2、数据类型

3、string数据类型

4、number数据类型

5、boolean数据类型

6、数据类型的隐式转换

6、数据类型转换函数

7、特殊类型

8、算术运算

9、关系运算

10、逻辑运算

11、条件运算符

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

1）变量声明：使用关键字var声明变量，如var x,y;

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

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

例如：

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

2）变量初始化：使用等号赋值

如：var count = 0;

u  注意事项：没有初始化的变量则自动取值为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世界\"";

u  注意事项：可用在正则表达式，只允许录入汉字[^\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）转换方式：

①隐式转换：直接转，默认的规则

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

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

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）用于判断数据之间的大小关系：“>”、“<”、“>=”、“<=”、“==”、“!=”

u  注意事项：“= =“比较的是值（忽略类型）。

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表达式

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

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。

　　注：break可以省略，如果没有break,switch将继续忽略case执行下一条语句块，直到遇到break或者switch的结束"}"。

　　例如：

switch (parseInt(score/10)){
    case 0:
    case 1:
    case 2:
    case 3:
    case 4:
    case 5:score = "差";break;
    case 6:
    case 7:score = "中";break;
    case 8:score = "良";break;
    case 9:
    case 10:score = "优";break;
    default:score = "你输入的成绩有误，请重新输入！";break;
}

4、  default：可以写在switch结构的任何位置 ，一般放在最后，default在js中可省略。

 注意：switch语句需要满足值和类型都相同，等同于“===”。

3）for语句：

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

         语句;

}

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

4）while语句

while(条件){

         语句1;

}

特点：先判断，后执行

5）while语句

         do{

                   语句1

}while(条件)

                  特点：先执行，后判断

u  注：可使用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
如有疑问请与原作者联系

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有