[译]Javascript风格要素(二)

作者:秦歌 来源:随网之舞 时间:2008-02-29 12:51:00 

阅读上一篇:[译]Javascript风格要素(一)

我们使用习惯用法可以使我们的意图更加的清晰和简洁。

使用==时,当心强制转换

考虑下面函数:

function gw(f) {
    if (d.w.sv.checked == true) {
        zv = 'on';
    } else {
        zv = 'off';
    }
    procframe.location.replace("http://b.www.yahoo.com/module/wtr_tr.php?p=" +
        escape(f.p.value) + "&sv=" + zv);
    return false;
}


==运算符不应该被用着和true比较值,因为它要执行强制转换。如果我们想确定d.w.sv.checked是否是布尔值

true,我们必须用===运算符。如果我们仅在意一个值是真实存在的不是假的,最好不要用相等运算符。

例如,由于强制转换:1 == true是真,1 === true是假。==运算符隐藏了类型错误。

使用?:运算符选择两值之一

if语句通常被用来从两个值中选择一个。这应该是三元操作符?:最适合的。

zv = d.w.sv.checked ? 'on' : 'off';

绝不使用隐含的全局变量

变量zv不是作为一个var或函数参数来声明的,所以它是一个隐式的全局变量。如果这个页面的另一个函数使用了同样名字的全局变量,则可能得到一个失败的结果。这样的臭虫(bug)是非常难以发现,却很容易避免。这个例子中,我们既可以声明zv为一个var,也可以发现它仅仅被使用过一次而整个去掉它。

function gw(f) {
    procframe.location.replace("http://b.www.yahoo.com/module/wtr_tr.php?p=" +
        escape(f.p.value) + "&sv=" + d.w.sv.checked ? 'on' : 'off');
    return false;
}

绝不使用?:运算符选择两种行为之一

我们常质疑那些返回一个常量的函数,但这有时是在浏览器环境下所必需的。

下面我们看一个不正确使用?:运算符的例子。它常被用于在两个任务间选择。

function u(o, z) {
    var em = o.id.substring(1);
    var p = d.getElementById('e' + em);
    if (p) {
        (z == 0) ? p.style.backgroundColor = '#fff' :
                   p.style.backgroundColor = '#989898';
    }
    p = d.getElementById('e' + (em - 1));
    if (p) {
        (z == 0) ? p.style.backgroundColor = '#fff' :
                   p.style.backgroundColor = '#989898';
    }
}

Z的判断是模糊不清的。Z正好等于0时我们选择#fff颜色,那么,Z不等于时?如上所述似乎指明的是前者,但它实际上是后者。在这个例子中幸运的是,我们大概想要的就是后者,所以它不是技术上错误(这次)。但是在文体上只糟糕的。

我们可以用if代替?:,但碰巧的是这些值对应的是同一个左值(lvalue),所以我们无需if就可以改正这个错误。

function u(o, z) {
    var em = o.id.substring(1),
        p = d.getElementById('e' + em);
    if (p) {
        p.style.backgroundColor = z ? '#fff' : '#989898';
    }
    p = d.getElementById('e' + (em - 1));
    if (p) {
        p.style.backgroundColor = z ? '#fff' : '#989898';
    }
}

标签:风格,运算符,javascript
0
投稿

猜你喜欢

  • Python语言描述机器学习之Logistic回归算法

    2023-08-31 01:14:35
  • 趁热打铁!HTTPGet与HTTPPost的区别详解

    2022-07-15 02:46:00
  • Python实现将图片转换为ASCII字符画

    2023-08-12 08:42:42
  • vue中导出Excel表格的实现代码

    2024-06-05 09:14:06
  • 超详细的Python安装第三方库常用方法汇总

    2023-08-26 08:54:47
  • ECharts框架分段视觉映射在移动端适配

    2024-04-28 09:53:49
  • go build失败报方法undefined的解决过程

    2023-06-18 15:07:36
  • 个人网站与动网整合非官方方法

    2009-07-05 18:42:00
  • python机器人行走步数问题的解决

    2023-12-24 23:26:05
  • Django中更改默认数据库为mysql的方法示例

    2024-01-23 03:19:56
  • Goland 2020或2019软件版本去掉a...或fmt...提示的方法

    2024-04-25 15:06:44
  • 基于Python实现网页文章转PDF文档

    2022-08-23 08:50:17
  • Python @property及getter setter原理详解

    2022-04-25 18:15:09
  • Vue.js自定义事件的表单输入组件方法

    2024-05-05 09:12:24
  • 比较不错的函数式JavaScript编程指南教程

    2023-08-25 08:24:41
  • Python实现链表反转的方法分析【迭代法与递归法】

    2021-07-07 17:56:37
  • Python正则表达式教程之一:基础篇

    2023-11-13 19:46:02
  • 关于对Java正则表达式"\\\\"的理解

    2023-06-24 07:23:02
  • 浅析MySQL - MVCC

    2024-01-24 14:29:22
  • 如何取得刚添加的记录自动增加的ID?

    2010-01-18 20:55:00
  • asp之家 网络编程 m.aspxhome.com