background preloader

Google JavaScript Style Guide

Google JavaScript Style Guide
We follow the C++ formatting rules in spirit, with the following additional clarifications. Curly Braces Because of implicit semicolon insertion, always start your curly braces on the same line as whatever they're opening. For example: if (something) { // ... } else { // ... } Array and Object Initializers Single-line array and object initializers are allowed when they fit on a line: Multiline array initializers and object initializers are indented 2 spaces, with the braces on their own line, just like blocks. Long identifiers or values present problems for aligned initialization lists, so always prefer non-aligned initialization. Not like this: Function Arguments When possible, all function arguments should be listed on the same line. // Four-space, wrap at 80. When the function call is itself indented, you're free to start the 4-space indent relative to the beginning of the original statement or relative to the beginning of the current function call. Passing Anonymous Functions Blank lines Related:  javascript

RequireJS Usage§ 1 Load JavaScript Files§ 1.1 RequireJS takes a different approach to script loading than traditional <script> tags. While it can also run fast and optimize well, the primary goal is to encourage modular code. As part of that, it encourages using module IDs instead of URLs for script tags. RequireJS loads all code relative to a baseUrl. Or, baseUrl can be set manually via the RequireJS config. RequireJS also assumes by default that all dependencies are scripts, so it does not expect to see a trailing ".js" suffix on module IDs. There may be times when you do want to reference a script directly and not conform to the "baseUrl + paths" rules for finding it. Ends in ".js".Starts with a "/".Contains an URL protocol, like "http:" or "https:". In general though, it is best to use the baseUrl and "paths" config to set paths for module IDs. www/ index.html js/ app/ sub.js lib/ jquery.js canvas.js app.js require.js in index.html: and in app.js: data-main Entry Point§ 1.2 define([".

JavaScript JavaScript (JS) is a lightweight interpreted or JIT-compiled programming language with first-class functions. While it is most well-known as the scripting language for Web pages, many non-browser environments also use it, such as Node.js, Apache CouchDB and Adobe Acrobat. JavaScript is a prototype-based, multi-paradigm, dynamic language, supporting object-oriented, imperative, and declarative (e.g. functional programming) styles. Read more about JavaScript. This section is dedicated to the JavaScript language itself, and not the parts that are specific to Web pages or other host environments. The standard for JavaScript is ECMAScript. Tutorials Learn how to program in JavaScript with guides and tutorials. For complete beginners Head over to our Learning Area JavaScript topic if you want to learn JavaScript but have no previous experience of JavaScript or programming. JavaScript first steps Answers some fundamental questions such as "what is JavaScript?" JavaScript building blocks Closures

JavaScript Allongé A Pull of the Lever: Prefaces “Café Allongé, also called Espresso Lungo, is a drink midway between an Espresso and Americano in strength. There are two different ways to make it. Foreword by Michael Fogus As a life-long bibliophile and long-time follower of Reg’s online work, I was excited when he started writing books. The act of writing is an iterative process with (very often) tight revision loops. In the case of JavaScript Allongé, you’ll find the Leanpub model a shining example of effectiveness. As a staunch advocate of functional programming, much of what Reg has written rings true to me. Enjoy. – Fogus, Foreword by Matthew Knox A different kind of language requires a different kind of book. JavaScript holds surprising depths–its scoping rules are neither strictly lexical nor strictly dynamic, and it supports procedural, object-oriented (in several flavors!) –Matthew Knox, Why JavaScript Allongé? how the book is organized A Personal Word About The Recipes Instead of:

JS: The Right Way Dojo Style Guide Contents: This document follows the basic outline of the Java Programming Conventions Guide, a copy of which may be found at Widget authors are expected to adhere to this style guide and also to the Dojo Accessibility Design Requirements guidelines. General Any violation to this guide is allowed if it enhances readability. Guidelines in this document are informed by discussions carried out among the Dojo core developers. Quick Reference Table of core API naming constructs: Table of constructs that are not visible in the API, and therefore carry less weight of enforcement. Naming Conventions When constructing string IDs or ID prefixes in the code, do not use "dojo", "dijit" or "dojox" in the names. Specific Naming Conventions The terms get/set SHOULD NOT used where a field is accessed, unless the variable being accessed is lexically private. Files Class or object-per-file guidelines are not yet determined. Variables Layout Documentation Markup Guidelines Tags ?

Basic JavaScript Part 12: Function Hoisting Here are the links to the previous installments: In a previous post I already discussed the phenomenon of hoisting in JavaScript. In that post I showed the effects of variable hoisting and why it’s important to declare all variables at the top of a function body. For this post I want to briefly focus on function hoisting. functionExpression(); // undefined functionDeclaration(); // "Function declaration called." var functionExpression = function() { console.log('Function expression called.'); }; functionExpression(); // "Function expression called." functionDeclaration(); // "Function declaration called." function functionDeclaration() { console.log('Function declaration called.'); } functionExpression(); // "Function expression called." functionDeclaration(); // "Function declaration called." In order to understand what’s going on here, we first need to understand the distinction between a function expression and a function declaration. Until next time. Jan Van Ryswyck

Introduction | Human JavaScript Code is as much about people as it is about computers. Sure, it's run by computers, but it's written by, maintained by, and ultimately created for people. People are not computers. We are not robots. You can read about JavaScript, the language, elsewhere. &yet, the team I'm humbled to be a part of, is a small (~40 person) bootstrapped consulting and product company focused heavily on realtime single page web applications. As we've gone along, we've done our best to extract reusable tools out of them. Speaking of humans, this book would not exist if not for a giant list of people who helped make it a reality. They helped with technical review, code, editorial feedback, design, writing/producing the promotional video and loads of encouragement. Let's talk about this whole "app" thing for a bit and get on the same page in terms of terminology. Rather than pontificate on the meaning of this for three chapters, I'll explain the distinction as I see it for the purposes of this book.

JavaScript Enlightenment | by Cody Lindley | 1st Edition | ECMA-262, Edition 3 An Introduction To Full-Stack JavaScript Nowadays, with any Web app you build, you have dozens of architectural decisions to make. And you want to make the right ones: You want to use technologies that allow for rapid development, constant iteration, maximal efficiency, speed, robustness and more. You want to be lean and you want to be agile. You want to use technologies that will help you succeed in the short and long term. In my experience, full-stack JavaScript1 hits all the marks. To give you a quick preview: 2(Large view3) I’ll introduce these components piece by piece. Why I Use JavaScript Link I’ve been a Web developer since 1998. In the early era of PHP and ASP, when template engines were just an idea, developers embedded application code in their HTML. <script><? Or, even worse: <script> var users_deleted = []; <? For starters, there were the typical errors and confusing statements between languages, such as for and foreach. The answer was simple: Put JavaScript on the server. Functional Programming Link Node.js Link (al, ea)

translations/de_DE at master · rwaldron/idiomatic.js JavaScript Programming Patterns JavaScript is meant to be used to add behaviour to a website, might it be for form validation or for more complex operations like drag & drop functionality or performing asynchronous requests to the webserver (aka Ajax). During the past few years, JavaScript libraries became increasingly popular. One of the reasons is definitely that websites are getting more and more complex and reinventing the wheel each time is not acceptable if you are working on a tight schedule. But letting aside libraries and focusing on the “bare” syntax of JavaScript, it is very valuable to know what kind of options you have in terms of programming patterns when writing JavaScript. In this article I am trying to present some of the techniques out there that I have discovered. The patterns I would like to mention are the following: The way I decided to present and compare these different patterns is by solving the same given task with every pattern. The Old-School Way Please proceed to the working example.

Mastering The Developer Tools Console The developer tools console is one of the most powerful tools available to you when it comes to debugging your front-end web applications. The console has an API that provides a number of methods that make debugging easier. It’s not uncommon to see developers using console.log() or console.dir() to investigate problems; but the developer tools console has a lot more to offer. In this blog post you’re going to learn how to debug your web applications using the methods provided by the console API. Some browsers support more functionality than others so I’ll be pointing out any compatibility issues as we go. Lets get started! Using the Developer Tools Console If you haven’t used the developer tools console before, don’t worry. There are a number of different ways that you can open your browser’s developer tools. You can also launch the developer tools using a keyboard shortcut. The developer tools console in Chrome. The ‘Elements’ tab with a console pane at the bottom. Great! console.clear()

JavaScript Garden Although JavaScript deals fine with the syntax of two matching curly braces for blocks, it does not support block scope; hence, all that is left in the language is function scope. function test() { // a scope for(var i = 0; i < 10; i++) { // not a scope // count } console.log(i); // 10} There are also no distinct namespaces in JavaScript, which means that everything gets defined in one globally shared namespace. Each time a variable is referenced, JavaScript will traverse upwards through all the scopes until it finds it. The Bane of Global Variables // script Afoo = '42'; // script Bvar foo = '42' The above two scripts do not have the same effect. Again, that is not at all the same effect: not using var can have major implications. // global scopevar foo = 42;function test() { // local scope foo = 21;}test();foo; // 21 Leaving out the var statement inside the function test will override the value of foo. // global scopevar items = [/* some list */];for(var i = 0; i < 10; i++) { subLoop();}

You Might Not Need jQuery

Related:  Best Practiceweb-dev