JS 架構學習
1. Underscore http://documentcloud.github.com/underscore/
==============================================================
Underscore is a utility-belt library for JavaScript that provides a lot of the
functional programming support that you would expect in Prototype.js (or Ruby),
but without extending any of the built-in JavaScript objects. It's the tie to
go along with jQuery's tux.
Table of Contents
-----------------
Object-Oriented and Functional Styles
Collections
-----------
each, map, reduce, reduceRight, detect, select, reject, all, any, include,
invoke, pluck, max, min, sortBy, groupBy, sortedIndex, toArray, size
Arrays
------
first, rest, last, compact, flatten, without, union, intersection, difference,
uniq, zip, indexOf, lastIndexOf, range
Functions
---------
bind, bindAll, memoize, delay, defer, throttle, debounce, once, after, wrap, compose
Objects
-------
keys, values, functions, extend, defaults, clone, tap, isEqual, isEmpty, isElement,
isArray, isArguments, isFunction, isString, isNumber, isBoolean, isDate, isRegExp
isNaN, isNull, isUndefined
Utility
-------
noConflict, identity, times, mixin, uniqueId, template
Chaining
--------
chain, value
簡單的來說,Underscore 就是一個基礎工具庫,對JavaScript 的一些函數,方法等進行了
封裝, 用來提供函數式編程的特性, 雖然有自己的template輕量級的渲染模板,但不是很好用。
2. mustache https://github.com/janl/mustache.js
==============================================================
Logic-less templates with JavaScript
Quik start:
->var view = {
-> title: "Joe",
-> calc: function() {
-> return 2 + 4;
-> }
->}
->var template = "{{title}} spends {{calc}}";
->var html = Mustache.to_html(template, view);
非常簡潔直觀的template模板渲染工具。功能強大文法簡潔。好的沒得說。
3. Prototype http://prototypejs.org/
===========================================
Prototype is a JavaScript framework that aims to ease development of dynamic web
applications. It offers a familiar class-style OO framework, extensive Ajax
support, higher-order programming constructs, and easy DOM manipulation.
這個主要包含了 Ajax相關的,擴充DOM 其中,擴充DOM是核心, 它使得DOM訪問更物件導向
話,也就是說,將物件導向的更多屬性集成到了js, 包括繼承等。
4. Backbone http://documentcloud.github.com/backbone/
============================================================
Backbone supplies structure to JavaScript-heavy applications by providing models
with key-value binding and custom events, collections with a rich API of enumerable
functions, views with declarative event handling, and connects it all to your
existing application over a RESTful JSON interface.
Events
– bind
– unbind
– trigger
Model
– extend
– constructor / initialize
– get
– set
– escape
– has
– unset
– clear
– id
– cid
– attributes
– defaults
- toJSON
– fetch
– save
– destroy
– validate
– url
– urlRoot
– parse
– clone
– isNew
– change
– hasChanged
– changedAttributes
– previous
– previousAttributes
Collection
– extend
– model
– constructor / initialize
– models
– toJSON
– Underscore Methods (26)
– add
– remove
– get
– getByCid
– at
– length
– comparator
– sort
– pluck
– url
– parse
– fetch
– reset
– create
Router
– extend
– routes
– constructor / initialize
– route
– navigate
History
– start
Sync
– Backbone.sync
– Backbone.emulateHTTP
– Backbone.emulateJSON
View
– extend
– constructor / initialize
– el
– $ (jQuery or Zepto)
– render
– remove
– make
– delegateEvents
Utility
– noConflict
簡單的說,就是backbone提供了一套比較完整的在JS裡邊使用MVC的架構。適合大型應用,例如
WEB2.0 網站。