Young - Building A JavaScript Framework
Here you can read online Young - Building A JavaScript Framework full text of the book (entire story) in english for free. Download pdf and epub, get meaning, cover and reviews about this ebook. genre: Computer. Description of the work, (preface) as well as reviews are available. Best literature library LitArk.com created for fans of good reading and offers a wide selection of genres:
Romance novel
Science fiction
Adventure
Detective
Science
History
Home and family
Prose
Art
Politics
Computer
Non-fiction
Religion
Business
Children
Humor
Choose a favorite category and find really read worthwhile books. Enjoy immersion in the world of imagination, feel the emotions of the characters or learn something new for yourself, make an fascinating discovery.
Building A JavaScript Framework: summary, description and annotation
We offer to read an annotation, description, summary or preface (depends on what the author of the book "Building A JavaScript Framework" wrote himself). If you haven't found the necessary information about the book — write in the comments, we will try to find it.
Building A JavaScript Framework — read online for free the complete book (whole text) full work
Below is the text of the book, divided by pages. System saving the place of the last page read, allows you to conveniently read the book "Building A JavaScript Framework" online for free, without having to search again every time where you left off. Put a bookmark, and you can go to the page where you finished reading at any time.
Font size:
Interval:
Bookmark:
This book is a guide to building a JavaScript framework. Itll teach you how to build a framework and draw on real-world code from projects like jQuery
Along the way well explore some fundamental parts of modern JavaScript:
- Browser capability detection
- Clean, reusable API design
- Benchmarking and performance
- Writing minifier-friendly JavaScript
- Using GitHub!
The framework well build is called Turing and is available on GitHub: turing.js.
If you embark on an involved open source or private project, youre likely to work with other people. Its important to be upfront about the goals of the project and the style of development.
These are the practices I will use to develop this framework:
- Verbose: Variable and method names should be verbose so things are easy to find and understand
- Portable: Browsers and console should be catered for
- Explicit: Code should be quick to understand
- Comments: Lets keep comment noise down. Comments should be succinct. TODO and FIXME are acceptable.
- Simple: Keep code simple. Lets not bore readers!
- Indentation: Two spaces
- Semicolons: People might want to minify this library lets keep simicolons!
- Quality: JsLint and reader comments!
- Testing: Test first development for both browsers and console
- Versioning: GitHub to the rescue
The first question to ask about a JavaScript frameworks structure is: how self-contained is it? In 2005 we were blown away by Ajax and the yellow fade technique, so people flocked to libraries that made those techniques easy. Now in 2010 were writing server-side JavaScript and creating sophisticated front-end behaviour. We can no-longer afford to use frameworks that arent careful about their namespacing.
Take a look at the current stable prototype.js. It modifies the prototypes of a lot of native objects. It also provides a lot of top-level objects. The BBC specifically designed Glow to avoid this, and literally everything is namespaced. This feels strange if youre used to Prototype, because Prototype attempts to simplify browser-based JavaScript. Prototype makes complex Array manipulation much easier cross-browser, but with Glow you need to remember to use glow.lang.toArray
and other utility methods.
The lesson here is that you trade off usability to play nice with other frameworks. Due to the way JavaScript works though, its possible to use both approaches our library could have configuration options to extend native objects.
This framework will be more like Glow this will remove a lot of hidden magic when using it. People using it to learn JavaScript should be able to see the difference between what browsers and CommonJS provide.
Another interesting point about Prototype is it quickly defines high-level structural code which it reuses internally. It defines Object.extend
and Class
, then reuses these to build fundamental features:
var Hash = Class . create ( Enumerable , ( function () { function initialize ( object ) { this . _object = Object . isHash ( object ) ? object . toObject () : Object . clone ( object ); }
MooTools, jQuery and Prototype all define helpers to reduce the effort required to call commonly used functions:
// Prototype function $H ( object ) { return new Hash ( object ); }; // MooTools function $H ( object ){ return new Hash ( object ); };
It would be nice to include quick access to helper methods, but as I said previously where turing.js
begins and ends needs to be clear to the newcomer. Therefore, if these are to be used they should be succinct but clear.
If you taught someone JavaScript with jQuery, would they even realise browsers dont have $()
?
Most frameworks have wrappers for initialisation and metadata about the library. MooTools and Prototype use one broadly similar approach, then jQuery and Glow use another.
var MooTools = { 'version' : '1.2.5dev' , 'build' : '%build%' }; var Prototype = { Version : '' , ... } ( function ( window , undefined ) { var jQuery = function ( selector , context ) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery . fn . init ( selector , context ); } , ... jquery : "@VERSION" , ... } // Expose jQuery to the global object window . jQuery = window . $ = jQuery ; })( window );
Glow and jQuery both use an anonymous function, then expose themselves by writing an attribute to window
. This is the approach Ill use for turing.js.
jQuery, MooTools and Glow have tried hard to be modular. Lets use a similar approach, with a file naming scheme like this:
- turing.core.js
- turing.functional.js
After creating a turing
variable that will be exposed to the global scope, we can define our modules on it as functions or objects.
Im going to use my riot.js library to write unit tests, because its a simple unit testing library that is pure JavaScript.
You might think that testing a library framework stub is pointless, but we still need to make sure it sets things up properly in browsers and in the console. Im going to run my tests in Rhino and Firefox.
The core test should check the following:
turing
is instantiatedturing
has properties we can read lets set a version number
The test code looks like this:
Riot . context ( 'turing.core.js' , function () { given ( 'the turing object' , function () { should ( 'be global and accessible' , turing ). isNotNull (); should ( 'return a VERSION' , turing . VERSION ). isNotNull (); should ( 'be turing complete' , true ). isTrue (); }); });
Putting this together, we get:
( function ( global ) { var turing = { VERSION : '0.0.1' , lesson : 'Part 1: Library Architecture' }; if ( global . turing ) { throw new Error ( 'turing has already been defined' ); } else { global . turing = turing ; } })( typeof window === 'undefined' ? this : window );
Heres how it looks in Rhino:
js > load ( 'turing.core.js' ); js > print ( turing . VERSION ); 0.0 . js > print ( turing . lesson ); Part : Library Architecture
And in a browser:
>>> turing Object { VERSION = "0.0.1" , more ...}
Not all JavaScript frameworks provide classes. Douglas Crockford discusses the classical object model in Classical Inheritance in JavaScript. Its an excellent discussion of ways to implement inheritance in JavaScript. Later, he wrote Prototypal Inheritance in JavaScript in which he basically concludes prototypal inheritance is a strong enough approach without the classical object model.
So why do JavaScript libraries provide tools for OO programming? The reasons vary depending on the author. Some people like to ape an object model from their favourite language. Prototype is heavily Ruby inspired, and provides Class which can be useful for organising your own code. In fact, Prototype uses Class
internally.
In this chapter Im going to explain prototypal inheritance and OO, and start to create a class for OO in JavaScript. This will be used by our framework, turing.js.
Font size:
Interval:
Bookmark:
Similar books «Building A JavaScript Framework»
Look at similar books to Building A JavaScript Framework. We have selected literature similar in name and meaning in the hope of providing readers with more options to find new, interesting, not yet read works.
Discussion, reviews of the book Building A JavaScript Framework and just readers' own opinions. Leave your comments, write what you think about the work, its meaning or the main characters. Specify what exactly you liked and what you didn't like, and why you think so.