A Few New Things Coming To JavaScript. I believe the day-to-day practice of writing JavaScript is going to change dramatically for the better when ECMAScript.next arrives. The coming year is going to be an exciting time for developers as features proposed or finalised for the next versions of the language start to become more widely available. In this post, I will review some of the features I'm personally looking forward to landing and being used in 2013 and beyond. ES.next implementation status Be sure to look at Juriy Zaytsev's ECMAScript 6 compatibility table, Mozilla's ES6 status page as well as the bleeding edge versions of modern browsers (e.g Chrome Canary, Firefox Aurora) to find out what ES.next features are available to play with right now.
In Canary, remember that to enable all of the latest JavaScript experiments you should navigate to chrome:flags and use the 'Enable Experimental JavaScript' option. Modules We're used to separating our code into manageable blocks of functionality. We can just import drive(): Maps Sets. FirstImpression.js: A micro-library for detecting new visitors. FirstImpression.js is a micro/nano-library (1 kb minified) that answers the simple question, “Has this user visited this site before?” The detection doesn’t require much logic, so the majority of the code is just a Plain JavaScript port of the popular jquery.cookie plugin.
Using it Writing and reading your own cookies is easy enough but if you want to operate at a slightly higher level firstImpression.js offers a simple API for detecting first-time visitors. // Basic usageif ( firstImpression() ) { console.log('New user');} // Specify cookie nameif ( firstImpression('foo') ) { console.log('New user');} // Specify cookie name and expiration in daysif ( firstImpression('foo', 365) ) { console.log('New user');} Some stuff: Deleting Cookies If you need to delete cookies you can do so via firstImpression.js like this: // Remove default cookie firstImpression(null); // Remove custom named cookie firstImpression('foo', null); Browser Support This should work in any browser that supports cookies. JavaScript Form Validation : quick and easy! Using client side JavaScript is an efficient way to validate the user input in web forms. When there are many fields in the form, the JavaScript validation becomes too complex.
The JavaScript class presented here makes the form validations many times easier. Contents How to add JavaScript Form Validation quickly First, download the JavaScript form validation script here. The script has a catalog of almost all the common validation types built-in. The idea is to create a set of “validation descriptors” associated with each element in a form. Each field in the form can have zero one or more validations. In other words, in order to validate a field, you just associate a set of validation descriptors for each input field in the form. Just Choose Validations! Simfatic Forms is a feature-rich web form maker. Using the form validation script Include gen_validatorv4.js in your html file just before closing the HEAD tag Now, add the validations required The format of the addValidation() function is: Timeline. Log your JavaScript errors. 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.