javascript if条件判断方法小结

条件语句用于基于不同的条件来执行不同的动作。

条件语句

通常在写代码时，您总是需要为不同的决定来执行不同的动作。您可以在代码中使用条件语句来完成该任务。

在 JavaScript 中，我们可使用以下条件语句：

•if 语句 - 只有当指定条件为 true 时，使用该语句来执行代码
•if...else 语句 - 当条件为 true 时执行代码，当条件为 false 时执行其他代码
•if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行
•switch 语句 - 使用该语句来选择多个代码块之一来执行

If 语句

只有当指定条件为 true 时，该语句才会执行代码。

语法

代码如下:

if (条件)
  {
  只有当条件为 true 时执行的代码
  }

注意：请使用小写的 if。使用大写字母（IF）会生成 JavaScript 错误！

实例
当时间小于 20:00 时，生成一个“Good day”问候：

代码如下:

if (time<20)
  {
  x="Good day";
  }

x 的结果是：

Good day

亲自试一试

请注意，在这个语法中，没有 ..else..。您已经告诉浏览器只有在指定条件为 true 时才执行代码。
If...else 语句
请使用 if....else 语句在条件为 true 时执行代码，在条件为 false 时执行其他代码。

语法

代码如下:

if (条件)
  {
  当条件为 true 时执行的代码
  }
else
  {
  当条件不为 true 时执行的代码
  }

实例
当时间小于 20:00 时，将得到问候 "Good day"，否则将得到问候 "Good evening"。

代码如下:

if (time<20)
  {
  x="Good day";
  }
else
  {
  x="Good evening";
  }

x 的结果是：

Good day

亲自试一试
If...else if...else 语句
使用 if....else if...else 语句来选择多个代码块之一来执行。

语法

代码如下:

if (条件 1)
  {
  当条件 1 为 true 时执行的代码
  }
else if (条件 2)
  {
  当条件 2 为 true 时执行的代码
  }
else
  {
  当条件 1 和 条件 2 都不为 true 时执行的代码
  }

实例
如果时间小于 10:00，则将发送问候 "Good morning"，否则如果时间小于 20:00，则发送问候 "Good day"，否则发送问候 "Good evening"：

代码如下:

if (time<10)
  {
  x="Good morning";
  }
else if (time<20)
  {
  x="Good day";
  }
else
  {
  x="Good evening";
  }

x 的结果是：

Good morning

在javascript中，哪些值能作为if的条件呢

1、布尔变量true/false
2、数字非0,非NaN/ （0 或NaN)

见下面的例子，莫以为负数就以为if语句为假了。

代码如下:

var i = -1;
if(i){
 alert('here');
}else{
 alert('test is ok!');
}

3、对象非null/（null或undefined)
4、字符串非空串（“”）/空串("")

综上所述，对于字符串，不用写一大堆if(str!=null && str!=undefined && str !=''), 只要用一句

代码如下:

if(!str){
    //do something
}

就可以了。

对于数字的非空判断，则要考虑使用isNaN()函数，NaN不和任何类型数据相等，包括它本身，只能用isNaN()判断。对于数字类型，if(a)语句中的a为0时if(a)为假，非0时if(a)为真

代码如下:

var b;
var a = 0;
a = a + b;
if(a){
 alert('1');
}else{
 alert('2');
}
if(isNaN(a)){
 alert('a is NaN');
}

javascript教程:关于if语句优化的方法 if简写

UglifyJS是一个对javascript进行压缩和美化的工具，在它的文档说明中，我看到了几种关于if语句优化的方法。尽管我还没使用它去做一些尝试性的测试，但从这里可以看到它的确对js作了美化的工作。也许有人认为if语句就那么简单，能优化到什么程度？但是看看以下的几种方式，你也许会改变看法。

一、使用常见的三元操作符

if (foo) bar(); else baz(); ==> foo?bar():baz();
if (!foo) bar(); else baz(); ==> foo?baz():bar();
if (foo) return bar(); else return baz(); ==> return foo?bar():baz();

对于以上使用三元操作符来优化if语句你肯定不会陌生，或许你经常使用它。

我们给出的例子：

代码如下:

<script>
var i=9
var ii=(i>8)?100:9;
alert(ii);
</script>

输出结果：

100

二、使用and(&&)和or(||)运算符

if (foo) bar(); ==> foo&&bar();
if (!foo) bar(); ==> foo||bar();

老实说，我并没有这样去写过代码，这种写法我在学习《鸟哥的 Linux 私房菜》时看到过，但我并没想到在js中实现它。

三、省略大括号{}

if (foo) return bar(); else something(); ==> {if(foo)return bar();something()}

这种写法你我都很熟悉，但我建议在代码优化的时候这样做，或者交给UglifyJS帮你去解决。毕竟少一个大括号，代码的可阅读性并不高。

写到这里，我想到jQuery之父在《精通 JavaScript》中的一个获取HTML元素属性的方法。

function getAttr(el, attrName){
var attr = {'for':'htmlFor', 'class':'className'}[attrName] || attrName;
};

如果我们不这样写，可能我们需借助于两个if语句来进行处理，而上面的代码不仅简洁有效，而且可阅读性强。

仔细想想，好些时候我们都能找到解决问题的有效途径，但关键在于我们是否用心去寻找一种更好的途径。

【javascript技巧】if(x==null)简写

if(x==null)或if (typeof (x) == 'undefined')可以简写为if(!x)，未验证。

反之if(x)表示x非空

判断对象是否存在

代码如下:

if(document.form1.softurl9){
//判断是否存在softurl9，防止js出错
}

代码如下:

if(document.getElementById("softurl9")){
//判断是否存在softurl9，防止js出错
}

赞 (0)

相关推荐

  • Javascript条件判断使用小技巧总结

    考虑下面的代码 if (node.nextSibling.className == ...) { ... } 在 node 或者 node.nextSibling 为空(null)的情况下,会返回错误(error).所以,通常情况下的解决方案的代码为 if ((node) && (next = node.nextSibling) && ... ) { ... } 那么,当条件判断一多的情况下,代码会形成下面的情况 if ( (node) && (node.n

  • JavaScript条件判断_动力节点Java学院整理

    JavaScript使用if () { ... } else { ... }来进行条件判断.例如,根据年龄显示不同内容,可以用if语句实现如下: var age = 20; if (age >= 18) { // 如果age >= 18为true,则执行if语句块 alert('adult'); } else { // 否则执行else语句块 alert('teenager'); } 其中else语句是可选的.如果语句块只包含一条语句,那么可以省略{}: var age = 20; if (a

  • js利用与或运算符优先级实现if else条件判断表达式

    复制代码 代码如下: <script type="text/javascript"> /******************************************************************* 利用运算符优先级实现ifelse表达式 result = expression1 && expression2 当且仅当两个表达式的值都等于 True 时, result 才是 True. 如果任一表达式的值等于 False, 则 res

  • Javascript 篱式条件判断

    考虑下面的代码 if (node.nextSibling.className == ...) { ... } 在 node 或者 node.nextSibling 为空(null)的情况下,会返回错误(error).所以,通常情况下的解决方案的代码为 if ((node) && (next = node.nextSibling) && ... ) { ... } 那么,当条件判断一多的情况下,代码会形成下面的情况 if ( (node) && (node.n

  • javascript里的条件判断

    JavaScript 是一种可以在浏览器中运行的脚本语言,是一种弱语言(相对于C,C#,JAVA而言),只要是计算机语言就会使用到条件判断式,而JavaScript作为一种"弱"语言,它的条件判断常常令人困惑不解,特别是有其它强语言编程经历的人来说,更是不可理喻!高手和无惑的人别取笑,我自己也曾经有一段时间郁闷过.先写一个例子吧: var s = "meizz"; if (s && s==true) {     alert("Is true

  • JavaScript中的条件判断语句使用详解

    在写一个程序,可能有一种情况,当你需要采用一个路径出给定两个路径.所以,需要使用条件语句,让程序来做出正确的决策和执行正确的行动. JavaScript支持其用于执行根据不同的条件不同的操作条件语句.在这里,我们将解释if..else语句. JavaScript支持if..else语句的形式如下: if 语句 if...else 语句 if...else if... 语句. if 语句: if语句是基本的控制语句,它允许JavaScript来作出决定,有条件地执行语句. 语法: if (expr

  • javascript if条件判断方法小结

    条件语句用于基于不同的条件来执行不同的动作. 条件语句 通常在写代码时,您总是需要为不同的决定来执行不同的动作.您可以在代码中使用条件语句来完成该任务. 在 JavaScript 中,我们可使用以下条件语句: •if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码•if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码•if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行•switch 语句 - 使用

  • JavaScript多种页面刷新方法小结

    1,reload 方法 该方法强迫浏览器刷新当前页面. 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页.true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新") 2,replace 方法 方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过"前进"和"后退"来访问已

  • 详解JavaScript数据类型和判断方法

    详解JavaScript数据类型和判断方法

    前言 JavaScript 中目前有 7 种基本(原始primitives)数据类型 Undefined, Null,Boolean, Number, String,BigInt,Symbol,以及一种引用类型 Object,Object 中又包括 Function,Date,JSON,RegExp等,除了 7 种原始类型,其他的所有能够用 new 实例化的内置类型都是 Object 构造的. 数据类型 对于数据了类型我们可以通过 typeof 运算符来判断,具体结果看下图. 原始类型中两个比较

  • ASP.NET调用javascript脚本的常见方法小结

    1.直接在前台调用 javascript 函数 很简单,在 head 元素之间加入 script 元素,将 type 元素设置为 " text/javascript " 如: 复制代码 代码如下: <head runat="server"> <script type="text/javascript" > function ShowName(str) { alert("您的名字为:("+str+&quo

  • C#后台调用前台javascript的五种方法小结

    在网上找了找,发现有三种方法可以访问到前台代码: 第一种,OnClientClick (vs2003不支持这个方法) <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="client_click()" OnClick="Button1_Click" /> client_click() 就是javascript的

  • JavaScript操纵窗口的方法小结

    在前面的介绍中,我们讨论过close()方法: 复制代码 代码如下: win = window.open("http://www.jb51.net/", "js"): win.close(): JavaScript提供了许多方法与属性,我们可以使用它们来控制窗口. 移动.滚动.改变大小 下面的方法(N4+,IE4+)负责个定窗口的移动.滚动以及大小改变操作: 复制代码 代码如下: // 移动窗口的屏幕位置到指定的偏移x .y(绝对移动) window.moveTo(

  • JavaScript面向对象的实现方法小结

    本文实例总结了JavaScript面向对象的实现方法.分享给大家供大家参考.具体分析如下: 方法1: var person = { name: 'hello world', age: 22, sayHello:function(){ alert('I\'m 'this.name ',and I\'m ' this.age 'years old'); } }; person.sayHello();//I'm hello world, and I'm 22 years old 方法2: window

  • 让浏览器非阻塞加载javascript的几种方法小结

    浏览器为了确保正确执行脚本和呈现布局在浏览器加载和执行完成它之前会完全阻塞页面后续内容的呈现和其他资源的加载. 在页面的加载过程中如果可以做到内容的逐步呈现,对于良好的用户体验来说是非常重要的.通常我们也会在wondow对象的onload事件处理函数中做一些事情,但由于脚本阻塞加载和呈现的特性这一方面增加了页面载入时间推迟了onload事件的触发,另一方面也延迟了用户所期待的反馈.这就需要我们使用一些方法来让浏览器以非阻塞的方式加载外部脚本. 一  使用XMLHttpRequest对象异步方式

  • JavaScript类的继承方法小结【组合继承分析】

    本文实例讲述了JavaScript类的继承方法.分享给大家供大家参考,具体如下: 在JavaScript 里,被继承的函数称为超类型(父类,基类也行,其他语言叫法),继承的函数称为子类型(子类,派生类).继承也有之前问题,比如字面量重写原型会中断关系,使用引用类型的原型,并且子类型还无法给超类型传递参数. 为了解决引用共享和超类型无法传参的问题,我们采用一种叫借用构造函数的技术,或者成为对象冒充(伪造对象.经典继承)的技术来解决这两种问题. function aObj(){ this.name

  • JavaScript数组去重实现方法小结

    本文实例讲述了JavaScript数组去重实现方法.分享给大家供大家参考,具体如下: 一.ES3方法: var arr = ['a', 'a', 'b', 'b', 'b', 'c', 'e', 'f', 1, 2, 2, 3, 3, 3]; 创建一个空数组与原来数组进行比较 //与前面的数组进行比较(不会改变原数组) function deleteRepeat() { var result = []; label: for(var i=0; i<arr.length; i++) { for(v

随机推荐