background preloader

Javascript Closures

Javascript Closures
Introduction Closure A "closure" is an expression (typically a function) that can have free variables together with an environment that binds those variables (that "closes" the expression). Closures are one of the most powerful features of ECMAScript (javascript) but they cannot be property exploited without understanding them. The simple explanation of a Closure is that ECMAScript allows inner functions; function definitions and function expressions that are inside the function bodes of other functions. Unfortunately, properly understanding closures requires an understanding of the mechanism behind them, and quite a bit of technical detail. The Resolution of Property Names on Objects ECMAScript recognises two categories of object, "Native Object" and "Host Object" with a sub-category of native objects called "Built-in Object" (ECMA 262 3rd Ed Section 4.3). Assignment of Values var objectRef = new Object(); A property with the name "testNumber" can be created as:- Reading of Values Finally:- Related:  JavaScript

Truth, Equality and JavaScript | JavaScript, JavaScript... You don’t have to be a JavaScript novice to get confused by this… or this… The good news is that there is a standard and all browsers follow it. Some authors will tell you to fear coercion and and code against it. I hope to persuade you that coercion is a feature to be leveraged (or at the very least understood), not avoided… Is x true? Does x equal y? Conditionals In JavaScript, all conditional statements and operators follow the same coercion paradigm. The construct if ( Expression ) Statement will coerce the result of evaluating the Expression to a boolean using the abstract method ToBoolean for which the ES5 spec defines the following algorithm: Now we can see why, in the introductory example, if ([0]) allows entry to the subsequent block: an array is an object and all objects coerce to true. Here’s a few more examples. The Equals Operator (==) The == version of equality is quite liberal. Anyway, rant over, lets take a look at the way ECMA defines how == works. [0] == true; Like this:

Maps Javascript API V3 Controls - Google Maps JavaScript API V3 - Google Code Controls Overview The maps displayed through the Maps JavaScript API contain UI elements to allow user interaction with the map. These elements are known as controls and you can include variations of these controls in your application. Alternatively, you can do nothing and let the Maps JavaScript API handle all control behavior. The following map shows the default set of controls displayed by the Maps JavaScript API: Below is a list of the full set of controls you can use in your maps: The Zoom control displays "+" and "-" buttons for changing the zoom level of the map. You don't access or modify these map controls directly. Not all of these controls are enabled by default. The Default UI By default, all the controls disappear if the map is too small (200x200px). The behavior and appearance of the controls is the same across mobile and desktop devices, except for the fullscreen control (see the behavior described in the list of controls). Disabling the Default UI TypeScript JavaScript

MSIE Javascript Annoyances: Using parameters in setTimeout() | Claws and Paws dot Com Today's programmatic venting is brought to you by Internet Explorer's implementation of the setTimeout() function under Javascript. What is setTimeout()? setTimeout() schedules an arbitrary function call for some point in future. This is useful when you have functions that do repetitive tasks some milliseconds apartment, but not constantly. The reason why this is used instead of a simply while (true) { ... } loop is because Javascript is a single-threaded language. So if you tie up the interpreter by executing one piece of code over and over, nothing else in the browser gets a chance to run. setTimeout() allows other pieces of Javascript (or browser events, such as clicking on a button) to run, while guaranteeing that your code will be executed at some point. Sounds cool. Simple, like this: setTimeout(function_name, msec); This will cause a function called function_name to execute a certain number of milliseconds in the future. setTimeout(function_name, msec, arg1); And this works great. f();

JavaScript Scoping and Hoisting Do you know what value will be alerted if the following is executed as a JavaScript program? var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); If it surprises you that the answer is “10”, then this one will probably really throw you for a loop: var a = 1; function b() { a = 10; return; function a() {} } b(); alert(a); Here, of course, the browser will alert “1”. Scoping in JavaScript One of the sources of most confusion for JavaScript beginners is scoping. #include <stdio.h> int main() { int x = 1; printf("%d, ", x); // 1 if (1) { int x = 2; printf("%d, ", x); // 2 } printf("%d\n", x); // 1 } The output from this program will be 1, 2, 1. var x = 1; console.log(x); // 1 if (true) { var x = 2; console.log(x); // 2 } console.log(x); // 2 In this case, Firebug will show 1, 2, 2. To a lot of programmers who are used to languages like C, C++, C#, or Java, this is unexpected and unwelcome. Declarations, Names, and Hoisting function foo() { bar(); var x = 1; }

Maps Javascript API V3 Reference - Google Maps JavaScript API V3 - Google Code Release Version Last updated Monday, February 17, 2014 This reference documents version 3.15 (the release version) of the Maps Javascript API released November 15, 2013. To consult the latest (experimental) version of the Maps Javascript API, see the Experimental Development Reference. Reference Table of Contents Map Controls Overlays Services Map Types Layers Street View Events Base Geometry Library AdSense Library Panoramio Library Places Library Drawing Library Weather Library Visualization Library google.maps.Map class This class extends MVCObject. Constructor Methods Properties Events google.maps.MapOptions object specification google.maps.MapTypeId class Identifiers for common MapTypes. Constant google.maps.MapTypeControlOptions object specification Options for the rendering of the map type control. google.maps.MapTypeControlStyle class Identifiers for common MapTypesControls. google.maps.OverviewMapControlOptions object specification Options for the rendering of the Overview Map control. google.maps.Marker class

Javascript Naming Conventions, Coding Guidelines and Best Practices | Live Free. Live Happy. While most of the popular languages (Java, .NET, C++) have elaborate documents on the naming conventions to follow, I couldn't find any such good document for javascript. All I could find was bits and pieces here and there. This is the main reason why I am creating this page listing the javascript naming conventions I follow. This may not be complete but I shall try to make it as comprehensive as possible. 1. All variables should be prefixed with a letter indicating the data type of the variable (Hungarian notation). s - String n - number b - boolean a - Array o - object (Native Objects, Host Objects and user-defined objects) Further, the first letter of each of the words should be capitalized. Ex: var sSampleText = "Hello"; 2. g - global m - All member variables (private and public) var gsSampleText = "Hello"; 3. function Person(_msFirstName, _msLastName) { this.msFirstName = _msFirstName; this.msLastName = _msLastName; } 4. function XmlParser() { // Do something } 5. 1. 2. 3. 4. 6. if (sAge !

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. In the case that it reaches the global scope and still has not found the requested name, it will raise a ReferenceError. 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 Local Variables var foo = 3; bar = 4;}test(10); Hoisting

Maps Javascript API V3 Events - Google Maps JavaScript API V3 - Google Code Overview JavaScript within the browser is event driven, meaning that JavaScript responds to interactions by generating events, and expects a program to listen to interesting events. There are two types of events: User events (such as "click" mouse events) are propagated from the DOM to the Google Maps API. These events are separate and distinct from standard DOM events. MVC state change notifications reflect changes in Maps API objects and are named using a property_changed convention. Each Maps API object exports a number of named events. For a complete list of events, consult the Maps API Reference. UI Events Some objects within the Maps API are designed to respond to user events such as mouse or keyboard events. 'click' 'dblclick' 'mouseup' 'mousedown' 'mouseover' 'mouseout' For the full list, see the Marker class. MVC State Changes MVC objects typically contain state. User events and MVC state changes may look similar, but you generally wish to treat them differently in your code.

JavaScriptMVC

Related: