`
zqjshiyingxiong
  • 浏览: 439892 次
  • 性别: Icon_minigender_1
  • 来自: 无锡
社区版块
存档分类
最新评论

Five quick JavaScript tips

阅读更多
http://usabletype.com/

http://www.blueidea.com/

When we’re hiring JavaScript developers at Multimap we sometimes ask them to build a little application, or mash-up, with the Multimap API. It’s a pretty simple little task but it allows us to see how people approach building a web application.

This is a list of five things I often notice when looking at these little applications that could be improved. They may be obvious to some people, but certainly not to all. So, without more ado: five quick JavaScript tips to improve the quality of your code.

Use the submit event on forms
When attaching event handlers to forms, always use the submit event of the form and not the click event of the submit button.

If something is clickable, make sure it’s a link
Don’t attach click events to elements other than anchors. This is particularly important for users navigating the site with methods other than the mouse, where they may have difficulty getting focus on non-anchor elements.

Simple loop optimisation
There’s a very simple change you can make to a for loop to improve it’s performance.

for ( var i = 0; i < elements.length; ++i )
for ( var i = 0, j = elements.length; i < j; ++i )
In the second example the length of the elements array is stored in the j variable, so it’s not queried on every iteration of the loop.

Use anonymous functions for event handlers
Particularly with short functions like the below, it is far more readable to create an anonymous function than to reference another named function elsewhere. It also allows you to use closures of course.

anchor.onclick = function() {
    map.goToPosition( home );
    return false;
}
Use Array.join instead of concatenating strings
When working with long strings that need to be joined up, it is more readable and better for performance to place strings in an array and use the join method to return a string.

var text = 'There are' + elements.length + 'members in the elements array.';
var text = ['There are', elements.length, 'members in the elements array.'].join(' ');
Update

A number of people have mentioned to me that the Array.join technique for string concatenation is a bad one, particularly if you're only doing it with a small number of strings. Our benchmarks show it being faster for IE when you get to about 6/7 string concatenations, so it's been useful to us in some situations. But I'd agree with Stuart below that for the average situation it's not going to be worth it. However, I don't see using Array.join() for string concatenation as an abuse of JavaScript.

分享到:
评论

相关推荐

    lab-five-javascript2

    标题 "lab-five-javascript2" 暗示我们正在探讨一个与JavaScript编程相关的实验或学习项目,可能是某个课程或教程的第五部分。由于没有具体的描述,我们可以基于JavaScript的基础知识和常见概念来展开讨论。 ...

    Node.js-johnny-five-JavaScript机器人技术和物联网的编程框架

    "Node.js-johnny-five-JavaScript机器人技术和物联网的编程框架" 这个标题揭示了我们讨论的核心技术栈。Node.js是一个基于Chrome V8引擎的JavaScript运行环境,它允许开发者使用JavaScript进行服务器端编程。而...

    Arduino-johnny-five,javascript机器人技术和物联网编程框架,在bocoup开发。-鲁瓦尔德隆/约翰尼五世.zip

    **Arduino与Johnny-Five:开启JavaScript机器人编程之旅** 在当今的物联网(IoT)时代,Arduino已经成为硬件爱好者、工程师和编程新手的首选平台,用于构建各种互动式项目和物联网设备。Arduino以其开源软硬件特性,...

    Johnny-Five:JavaScript 机器人和物联网编程框架-开源

    Johnny-Five 是 JavaScript 机器人和物联网平台。 由 Bocoup 于 2012 年发布,Johnny-Five 由一群充满热情的软件开发人员和硬件工程师维护。 超过 75 名开发人员为构建强大、可扩展和可组合的生态系统做出了贡献。 ...

    Johnny-Five:JavaScript机器人技术和IoT编程框架-开源

    Johnny-Five是JavaScript机器人与物联网平台。 Johnny-Five由Bocoup于2012年发布,由热情的软件开发人员和硬件工程师组成的社区维护。 超过75位开发人员为构建健壮,可扩展和可组合的生态系统做出了贡献。 唯一一个...

    High Performance JavaScript

    Zakas and five other JavaScript experts — Ross Harmes, Julien Lecomte, Steven Levithan, Stoyan Stefanov, and Matt Sweeney — demonstrate optimal ways to load code onto a page, and offer programming ...

    cardfive 7.7中文版

    《深入解析CardFive 7.7中文版:专业制卡软件的全面指南》 在信息技术领域,高效、专业的软件工具对于提高工作效率至关重要。本文将深入探讨CardFive 7.7中文版,这是一款专为制卡设计的软件,广泛支持包括Zebra、...

    CardFive5.0中文注册版

    《CardFive5.0中文注册版》是一款专为中文用户设计的卡片管理软件,它集信息存储、组织和检索于一体,适用于个人、企业以及团队等多种场景。这款软件的强大之处在于其简洁易用的界面和全面的功能,使得用户可以高效...

    证卡打印机CardFive7.7中文.zip

    证卡打印机CardFive 7.7是一款专业的卡证制作与打印软件,专为需要制作个性化身份证、会员卡、员工卡等各类卡片的用户设计。这款软件以其稳定性和易用性在行业内享有较高声誉,是许多企业和个人的首选工具。本文将...

    CardFive7.7中文制卡软件

    《CardFive7.7中文制卡软件:安装与汉化详解》 CardFive7.7是一款专门用于制作卡片的专业软件,其7.7版本引入了更丰富的设计元素和功能优化,使得用户在创建个性化卡片时拥有更多的选择。本文将详细介绍如何安装这...

    CardFive7.7(制卡软件)

    《CardFive7.7:一款专业制卡软件的深度解析》 CardFive7.7是一款专为用户设计的高效制卡软件,它以其强大的功能、易用的操作界面和丰富的模板库,深受广大用户喜爱。这款软件的核心在于为用户提供便捷、个性化的...

    斑马卡机编辑软件cardfive

    斑马卡机编辑软件CardFive是一款专为斑马证卡打印机设计的强大编辑工具,它提供了丰富的功能,使得用户能够高效地创建、编辑和管理各种证卡打印任务。这款软件不仅适用于初学者,也满足了专业人士对个性化和专业设计...

    cardfive7.7

    Cardfive 使用简易说明 Cardfive 是一款功能强大的制卡软件,提供了多种功能,使用户可以轻松地设计和打印卡片。在本篇文章中,我们将对 Cardfive 的使用方法进行详细的介绍,从基本操作到高级功能,帮助用户快速...

    CardFive7.7中文.rar

    Card Five证卡打印机制卡软件Card Five 简体中文版CardFive7.7 ☆ 专业的证卡打印机编辑软件 ☆ 支持照片、条形码、图片、文字、印章 ☆ 支持数据库添加 ☆ 我公司有详细的使用教程和案例分享 ☆ 如有需要请来电咨询...

    CardFive7.7中文

    CardFive7.7中文证卡打印工具,硬盘安装版本。证卡打印得力助手

    CardFive5.1

    《斑马P310与CardFive5.1:打造高效智能制卡解决方案》 在IT行业中,数据安全和身份识别的重要性不言而喻。斑马P310是一款专业级的桌面式智能卡打印机,它以其高效、精确的打印效果和广泛的兼容性在制卡领域中备受...

    CardFive7.7.rar

    CARDFIVE是用于塑料照片身份证的设计和打印软件。将设计链接到数据库,对磁条进行编码,对智能卡进行处理,创建效果并管理覆盖图,全息图或临时色带。使用DCL(直接命令语言)在市场上最流行的证卡打印机上以及几乎...

Global site tag (gtag.js) - Google Analytics