前端入门——JavaScript 语句

大家好，欢迎来到IT知识分享网。

在编程语言中语句通常使用一个或多个关键字来完成特定的任务。比如定义变量、赋值、条件判断、循环等语句。下面我们将介绍JavaScript中大部分常用的语句，主要分以下几类：

• 声明和赋值语句
• 条件语句
• 循环语句
• 其它语句

声明和赋值语句

这类语句是最基本的，比如声明一个变量且给变量赋值，如下示例：

var myName,otherName; // 声明变量语句 myName = "hello world"; // 赋值语句 otherName = "你好"; // 赋值语句

可以使用var 、let 及 const 关键字声明一个变量，使用“=”等号给变量进行赋值。

条件语句

条件语句主要用来处理逻辑判断，在编程中经常使用，随时都要用到条件语句进行逻辑选择，其有以下几种：

• if 语句 （如果…）

if (条件表达式) { // 代码块...... }

if…else 语句 （如果… 否则…）

if (条件表达式) { // 代码块...... }else{ // 代码块...... }

if…else if… else（如果… 或如果… 否则…）

if (条件表达式) { // 代码块...... } else if(条件表达式){ // 代码块...... }else{ // 代码块...... }

switch 语句 (类似if…else if…else)

switch(表达式){ case value: // 代码块.... break; case value: // 代码块.... break; case value: // 代码块.... break; default: // 代码块.... }

我们通过几个示例看看如何使用条件语句，如下示例：

let a = 1,b=5; // if 语句，当条件表达式 a < b 结果为true 时执行对应{}中的代码 if(a < b){ alert("a 小于 b") } // 使用 else ，当 a < b 结果为false时执行else对应{}中的代码 if(a < b){ alert("a 小于 b") }else{ alert("a 大于 b") }

当你要判断的条件可能性比较多时就需要使用 if ... else if ... else 了，如下示例：

let a = 1, b=5,c=10; if(a 
  

上面的语句也可以使用 switch 语句，如下示例：

let a = 1, b=5,c=10; switch(true) { case a 
  

关于条件语句，需要注意几点：

• 条件表达式可以是任何表达式，JavaScript会自动将其结果转化成Boolean类型值。
• else if 可以有很多个，根据实际逻辑判断而定。
• if 语句对应{}中的代码如果只有一行时，可以省略{}，但是建议不要这样做，最好都带上{}。
• switch 语句中的break 也是一个语句，它不是必需的，其含义是指当前case 对应的表达式求值完后不再继续向下求值，如下示例：

switch(a){ case 0: alert("如果a等于0时"); case 10: alert("如果a等于10时"); break; case 15: alert("如果等于15时"); break; default: alert("其它"); }

上面当case 0 时，switch 语句不会停止，而是继续向下执行case 10，直到case 10 中的break语句才结束。也就是说 a 和 0 比较后，继续和 10 做比较，这样就可以实现和多个条件比较，相当于 if( a ==0 || a == 10) {}。

循环语句

此类语句也是经常使用到的，在编程中经常需要重复计算一些东西，这时就需要循环语句。循环语句，都会有一个条件表达式如同if语句一样，这里含义是指当条件表达式值为true时结束循环。

JavaScript中有以下几种：

do - while 语句

这是一种后测试循环语句，通俗讲就是先执行循环体中的代码，再判断循环中的条件表达式，也就是在条件表达式求值前，至少循环体内的代码执行了一次，语法如下：

do { // 代码块 } while (条件表达式)

示例如下：

var i = 0; do{ i += 2; } while ( i < 10 )

while 语句

这个语句和 do-while 语句正好相反，是前测试循环语句，就是先求表达式的值，然后再去执行循环体中的代码，因此如果表达式值为false，其循环体就不会执行，while语句有可能永远都不会执行。

语法如下：

while (条件表达式){ // 代码块 }

示例如下：

var i = 0; while ( i < 10){ i + = 2; }

for 语句

for 语句也是一种前测试循环语句，它不同之处是可以再执行循环体之前定义并初始化变量和定义循环后要执行的代码，语法如下：

for( 初始变量; 条件表达式; 循环后执行的表达式;){ // 代码块 }

for 循环中括号里面，条件表达式是必需的，其它2个表达式可以没有。且初始化部分的变量可以是一个外部变量。

示例1：

// 循环打印出1 到 100 for( var i =0; i<100: i++){ console.log(i+1); // 因为初始是0，所以这里加1，当然你也可以把i的初始值设置为1 }

示例2：

// 只有条件表达式,这个类似于while语句了，一般不建议这样写 var count = 10; var i = 0; for( ; i 
  

示例3：

// 无限循环,这种情况没有任何意义，不建议使用 for( ; ; ){ console.log(''); }

for 循环语句是平时使用较多的语句，像do-while 和 while 都很少使用，因为 for 语句更加灵活，建议使用。

for in 语句

这是一种精准的迭代语句，和for 语句不同之处是它往往用来迭代一个对象中的属性，对于由键值对组成的对象类型而言使用for语句就显得不适用了，for in 语句语法如下：

for (key in object) { // 代码块 }

如上key 值对象中的属性名称，object 就是一个对象，这个对象可以是JavaScript中的object类型或者dom 节点等。

示例如下：

var obj = { a: 0, b: 1, c: 2, d: 3 } // 迭代obj对象 for (key in obj) { console.log(key); // 输出属性名称 console.log(obj[key]); // 输出对应的属性值 } // 结果如下 // a、b、c、d // 0、1、2、3

注意 for in 中的对象不能是 null 或 undefined,否则会抛出错误。虽然在 ECMAScript 5 中不会抛出错误，只是不执行循环体而已，所以在写代码之前，判断迭代的对象是否是null或undefined。

break 和 continue 语句

这2个语句，通常配合循环语句使用。break 是指立即结束当前循环，退出循环体，continue 指不执行本次循环体直接跳过，继续执行下次循环。

示例如下：

// 使用break var num = 0; for( var i=0; i< 10; i++){ // 当i==5 时 立即结束循环 if( i % 5 == 0) { break; } num ++ ; } alert(num); // 结果是 4

// 使用 continue var num = 0; for( var i=0; i< 10; i++){ // 当i==5 时 跳过本次循环,继续下次循环 if( i % 5 == 0) { continue ; } num ++ ; } alert(num); // 结果是 8

with 语句

这个语句不经常使用，它的作用是将代码的作用域设置到一个特定的对象中。语法如下：

with (表达式) { // 代码 }

我们通过一个示例，看看它到底是干什么的：

var gs = location.search.substring(1); var hostname = location.hostname; var url = location.href;

上面的代码是一段用来获取浏览器信息的，分别获取了3个对象，我们下面使用with语句简化这段代码：

with(location){ var gs = search.substring(1); var hostname = hostname; var url = href; }

是不是方便了很多，with 将其作用于设置为location对象，这样就不必每次使用location对象取值。

但是在实际使用中，不建议使用with语句，因为它会导致性能下降，同时不易阅读和调试。

结语

本节学习了JavaScript中语句的使用，主要分条件、循环、定义赋值等语句。语句是编程语言中重要的组成部分，相当于你要写一篇作文，没有语句是不行的，不然整篇作文将无法阅读，计算机语言也是如此。

到此，已经学习了JavaScript中的大部分内容，现在你可以写一些简单的脚本了，快试试吧。