[转] Try to use one var statement per scope in JavaScript
Posted on 2011-03-10 11:47 |orz 阅读(902) 评论(0) 编辑 收藏 举报JavaScript’s var
statement declares and optionally initializes one or more variables in the scope of the current function (or as global variables when used outside a function). Since var
accepts multiple declarations, separated by commas, there’s usually no reason to use it more than once per function; it’s just a waste of bytes and—especially if you redeclare variables inside a loop—CPU cycles.
Overuse of var
statements is one of the most common problems I see in JavaScript code. I was guilty of it myself for quite a while and it took me a long time to break the habit.
Bad:
function getElementsByClassName(className, tagName, root) { var elements = []; var root = root || document; var tagName = tagName || '*'; var haystack = root.getElementsByTagName(tagName); var regex = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)'); for (var i = 0, length = haystack.length; i < length; ++i) { var el = haystack[i]; if (el.className && regex.test(el.className)) { elements.push(el); } } return elements; }
There are several things wrong with the example above.
The most obvious problem is that I’ve used the var
statement no less than seven times. Somewhat less obvious, but far worse: I’ve used it inside a loop, which means that I’m unnecessarily redeclaring a variable on each iteration. I’ve also unnecessarily redeclared two variables that were passed in as function arguments.
Naturally, there’s a much better way to do this.
Good:
function getElementsByClassName(className, tagName, root) { root = root || document; tagName = tagName || '*'; var elements = [], haystack = root.getElementsByTagName(tagName), length = haystack.length, regex = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)'), el, i; for (i = 0; i < length; ++i) { el = haystack[i]; if (el.className && regex.test(el.className)) { elements.push(el); } } return elements; }
There are circumstances in which it is actually necessary to redeclare a variable within a single scope, but they’re very rare, and are more often than not a warning sign that you need to rethink the code you’re writing.
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步