background preloader

JavaScript

Facebook Twitter

Blackhole - Minimalistic but powerful SASS / CSS Framework. Eloquent JavaScript. Eloquent JavaScript. Understanding JavaScript Function Invocation and “this” Over the years, I've seen a lot of confusion about JavaScript function invocation. In particular, a lot of people have complained that the semantics of this in function invocations is confusing. In my opinion, a lot of this confusion is cleared up by understanding the core function invocation primitive, and then looking at all other ways of invoking a function as sugar on top of that primitive. In fact, this is exactly how the ECMAScript spec thinks about it. In some areas, this post is a simplification of the spec, but the basic idea is the same. First, let's look at the core function invocation primitive, a Function's call method[1]. Make an argument list (argList) out of parameters 1 through the end The first parameter is thisValue Invoke the function with this set to thisValue and the argList as its argument list For example: function hello(thing) { console.log(this + " says hello " + thing); } hello.call("Yehuda", "world") //=> Yehuda says hello world [2] Actually, I lied a bit.

JavaScript Madness: Keyboard Events. Javascript Madness Intro Jan Wolter 1. Introduction This document summarizes the results of some browser tests done while attempting to implement key stroke handling code in JavaScript. It documents inconsistancies in the way different browsers implement keyboard events.

The tests were originally done with the intention of learning just enough to write the code I needed to write. This data is based on tests of many, many browsers over many, many years, but is not comprehensive. The script used to collect the test results reported here is available at This document will usually refer to "Gecko" instead of "Firefox" and to "WebKit" instead of "Safari" or "Chrome".

Previous versions of this document included coverage of the iCab 3 browser, but iCab has switched to using the WebKit rendering engine, and so presumably behaves exactly like Safari. 2. The keydown event occurs when the key is pressed, followed immediately by the keypress event. 2.1. 2.2. 2.3. Keyboard Event Properties. JavaScript Kit- Your comprehensive JavaScript, DHTML, CSS, and Ajax stop. 7 JavaScript Libraries for Specific Visualizations. Apart from the usual charts and graphs libraries used to create interactive data visualizations already covered here, which can present a steep learning curve as a price for their powerful versatility, there are many less known JavaScript libraries that specifically address a visualization type. They come very handy when you deal with illustrating content from data journalism with an interactive experience.

Here are a few of them to start with. JSPlumb JSPlumb helps you visually connect elements: flowcharts, kitchen sinks, state machines, and hierarchical charts. It uses SVG where available and VML on IE8 and below, as it is compatible down to IE6. Its four main concepts are anchors (specific location), endpoints (visual representation of connections ends, attached to anchors), connectors (visual representation of the line that connects two elements), and overlays (connector decoration, like an arrow or a label).

JS Sequence Diagrams Timeline Smallworld GitHub source JointJS Heatmap Tangle. Minigrid: minimal 2kb cascading grid layout | by @healves82. JavaScript Tutorial. JavaScript Best Practices Part 1 | Thinkful Programming Guides. Javascript Best Practices, Part 1 Make it Understandable Choose easy to understand and short names for variables and functions. Bad variable names: Also bad variable names: incrementerForMainLoopWhichSpansFromTenToTwenty } createNewMemberIfAgeOverTwentyOneAndMoonIsFull Avoid describing a value with your variable or function name.

Might not make sense in some countries: Works everywhere: Your code is a story - make your storyline easy to follow! Stick to a Strict Coding Style Browsers are very forgiving JavaScript parsers. Validate your code: Use Shortcut Notations Shortcut notations keep your code snappy and easier to read once you get used to it. This code var lunch = new Array(); lunch[0]='Dosa'; lunch[1]='Roti'; lunch[2]='Rice'; lunch[3]='what the heck is this? ' Is the same as... var lunch = [ 'Dosa', 'Roti', 'Rice', 'what the heck is this? ' if(v){ var x = v; } else { var x =10; } var direction; if(x > 100){ direction = 1; } else { direction = -1; } var direction = (x > 100) ?

JS: The Right Way. Sample Diagrams for HTML by Northwoods Software® JavaScript: The Good Parts: Douglas Crockford: 9780596517748: Amazon.com: Books. GreenSock | Homepage. JavaScript - Tuts+ Code Category. IntroToJavaScript_and_ModernWebDevelopment.pdf. JavaScript is Sexy | Learn modern web application development with JavaScript. Ericelliott/essential-javascript-links. JSLint:The JavaScript Code Quality Tool. JavaScript Break and Continue. JavaScript reference. This part of the JavaScript section on MDN serves as a repository of facts about the JavaScript language. Read more about this reference. Global objects This chapter documents all the JavaScript standard built-in objects, along with their methods and properties. Value properties These global properties return a simple value.

Function properties These global functions—functions which are called globally, rather than on an object—directly return their results to the caller. Fundamental objects These are the fundamental, basic objects upon which all other objects are based. Numbers and dates These are the base objects representing numbers, dates, and mathematical calculations. Text processing These objects represent strings and support manipulating them. Indexed collections These objects represent collections of data which are ordered by an index value. Keyed collections Structured data Control abstraction objects Reflection Internationalization WebAssembly Other arguments Statements Control flow Block break var. 3.0 and jQuery Compat 3.0 Alpha Versions Released. It’s been a long time since we did a major release, and you certainly deserve one.

So we’re glad to announce the first alpha of jQuery 3.0! Despite the 3.0 version number, we anticipate that these releases shouldn’t be too much trouble when it comes to upgrading existing code. Yes, there are a few breaking changes that justified the major version bump, but we’re hopeful these breakages don’t actually affect that many people. The jQuery Migrate plugin can help you to identify compatibility issues in your code as well.

There are actually two releases here. You can also get the alpha versions from npm: npm install jquery@3.0.0-alpha1 npm install jquery-compat@3.0.0-alpha1 Major changes Below are just the highlights of the major new features, improvements, and bug fixes in these releases. Simplified .show() and .hide() methods Well, no. Special case with .data() names Error cases don’t silently fail. QuirksMode - for all your browser quirks. Safari Developer Library. Douglas Crockford's Javascript.