JS实例教程:当心JavaScript代码陷阱
下面这段代码,你知道有哪些错误吗: var g_bar = "bar"; function foo(container, config) { var container = container || document, name = config.name || "无名氏", isLive = config.isLive || true; var g_bar = g_bar || ""; if(g_foo) { /* your code */ } } foo(document, {isLive: false}); 请仔细思考后再往下阅读。 —- 帮助你思考的刷屏线 结束 —- 1. isLive = config.isLive || true, 当传入的值有可能就是0, undefined, null, false, "", NaN这六个 falsy 值时,用 || 来设定默认值不妥当。更保险的做法是: isLive = "isLive" in config ? config.isLive : true; 如果是独立变量,可以采用: someVar = typeof someVar !== "undefined" ? someVar : defaultValue; 注意:大部分情况下,用 || 已经够用,比如: container = container || document name = config.name || "无名氏" 一切皆权衡。 2. var g_bar = g_bar || "", 原意是取全局变量 g_bar 的值给内部变量 g_bar, 默认为空字符串。然而,实际情况等价为: var g_bar; g_bar = g_bar || ""; 很明显,|| 号左边的 g_bar 也是内部变量,并且为 undefined, 因此var g_bar = g_bar || ""实际上是var g_bar = "", 没有满足代码的原始意图。 思考:代码中的var container = container || document有无问题?为什么? 3. if(g_foo) { /* code */ }, 这段代码在执行时会报错。我们都知道在 JS 里,变量不定义就可以用。但一定要清楚,未定义的变量,仅仅是可写,但不可读。比如: g_foo = 2; // 等价 window.g_foo = 2 var t = g_foo2; // 不等价为 var t = window.g_foo2, 会报错 具体原因可以参见 JavaScript 运行机制浅探: 未定义变量意味着在 scriptObject 的变量表中找不到,JS 引擎会沿着 scriptObject 的 upvalue 往上寻找,如果都没找到,对于写操作 i = 1; 最后就会等价为 window.i = 1; 给 window 对象新增了一个属性。对于读操作,如果一直追溯到全局执行环境的 scriptObject 上都找不到,就会产生运行期错误。 因此严谨的写法是: if(window.g_foo) { /* your code */ } 不要小看这些细微之处,有时会让人抓狂的。但这些细微之处又很容易被忽略或滥用。比如 YUI 2.8r4 里,有一个遗传了 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢! |