backbonephp

㈠ 前端工程師都需要學習什麼

隨著移動互聯網的發展，web前端逐漸受到企業的重視，前端開發人員的薪資也水漲船高，越來越多的人看好前端行業的發展，想要轉行加入。下面，給大家分享一份web前端學習路線圖，希望對初學者有所幫助。Web前端行業的發展，讓前端人員能完成比以前更多的職責范圍，所以未來前端可以寬口徑就業，前景非常好。

對於零基礎的人而言，要怎麼學習web前端呢?

1、 前端頁面重構。主要內容為PC端網站布局、Photoshop 工具及切圖、H5移動端網頁布局、HTML5+CSS3新特性與交互。學習目標是完成PC端網站布局，可實現響應式布局，一套代碼適配 PC 端、移動端、平板設備等。

2、 前後端網頁交互。主要內容為javaScript語法全面進階、ES6 到 ES10 新語法實踐、jQuery 應用及插件使用、設計模式及插件編寫、封裝JS工具庫及Web APIS、AJAX+php+MySQL前後端交互、前端工程化與模塊化應用以及PC 端全棧開發項目等。學習目標是可以掌握前端工程化工具，如 git、gulp、webpack 等，搭建項目及開發項目。

3、 Node.js + 前端框架。主要內容為Node.js 全面進階、Koa2+MongoDB搭建服務、Vue.js 框架、React.js 框架、小程序雲開發與小程序框架、原生APP與混合APP、數據可視化與桌面應用等。學習目標是掌握桌面應用及可視化大數據，實現復雜數據展示類項目，能夠獨立完成前後台相關功能，勝任HTML5全棧開發工程師職位。很多學習web前端的朋友都希望在學成後能找到一份滿意的工作，所以我們在學習過程中一定要注意實戰經驗的積累，如果你所學的東西對企業沒有用，那你所做的一切都是無用功

㈡ 關於七牛雲存儲自定義URL的問題

近段時間將使用七牛雲存儲來存放用戶上傳的數據，客戶端通過七牛的js-sdk與七牛交互，服務端C#實現了七牛相關的介面。在這過程中多多少少遇到點問題，在這里總結一下。原文： 使用七牛雲存儲的一些經驗總結
599錯誤處理
如果在與七牛的交互中出現http狀態碼為599的錯誤，一句話，不要猶豫，直接聯系七牛技術支持 。七牛的文檔也在很多地方提到這個錯誤，都是指導大家去聯系技術支持的。筆者是在分塊上傳後的 mkfile 調用時出現的，聯系技術支持後，說是調整了一下，讓我重試。後來就好了...
分塊上傳無法從回調中獲得文件的原始名
簡單上傳採用的是multipart/form-data方式上傳，七牛服務端能夠從請求中獲得文件的原始名，並支持使用魔法變數 $(fname) 回調業務伺服器。不過當使用分片上傳的時候情況有所不同。分片上傳需要在最後調用 mkfile ，來將分片拼接起來。但是， mkfile 介面支持普通的請求，並沒有附帶文件名，所以七牛也就無法獲得文件名，此時從 $(fname) 中是取不到文件名的。這個問題我也向七牛技術支持提交了問題，得到的結果是使用自定義變數 mkfile 支持將自定義變數放在url中，回調的時候自定義變數可以傳遞給業務伺服器。
慎用圖片預處理
七牛雲支持很多對文件的預處理，其中最常用的應該就是圖片預處理了，可以對圖片的大小做變換等。七牛推薦使用GET的方式直接指定圖片處理結果的url，像這樣：
http://qiniuphotos.qiniudn.com/gogopher.jpg?imageView2/1/w/200/h/200

處理後的圖片會自動緩存，用戶不用關心，只要每次訪問都用這個url就行了。然而，筆者在開始的時候，為了保持與其他文件形式統一的處理方法，對圖片使用了預處理（因為視頻什麼的只能預處理），即在token中指定了預處理。此時問題出現了，從後台的日誌看到，圖片的預處理通知回調竟然比正常的上傳成功回調還要快！這就導致預處理結果到來之前，我的業務伺服器的資料庫中還沒有這個圖片，無法保存預處理結果了。所以 推薦還是使用url直接處理，對圖片要慎用預處理
視頻文件無法快進播放
通常用戶在觀看視頻的時候都會根據自己的喜好，快速將視頻定位到指定的時間播放。實現這個功能，需要視頻本身有關鍵幀信息、服務端需要支持關鍵幀播放請求，在 這篇文章 中有詳細討論。
但是筆者發現，在使用七牛雲轉化後的視頻，這樣做是無效的。於是咨詢技術支持，得到的答案是：轉化的文件是具有關鍵幀的，但七牛使用CDN加速，所以關鍵幀請求需要CDN的支持，如果想要用這個功能的話，需要單獨聯系銷售或技術支持在CDN上配置，而且時間比較長。筆者聯系了銷售和技術支持，說是幫我配置，但到現在還沒有搞定，因為最近這個也不是特別重要，所以也沒有跟下去。
Callback校驗
這是可選的一個步驟。由於七牛雲會在上傳完成之後回調業務伺服器，所以理論上說業務伺服器需要校驗這個回調的合理性。原理在七牛的 文檔 中有，需要用到 HMAC-SHA1 簽名函數。但是七牛的sdk中沒有提供直接的方式來做校驗，在研讀文檔、多次失敗和查看sdk源碼後，筆者終於校驗成功了。關鍵的分歧在於，文檔中的這句話：

獲取明文：data = Request.URL.Path +」\n」 +Request.Body

這里的 Request.URL.Path 是否包含Querystring?答案是包含的!下面是筆者C#服務端的校驗代碼，使用的是ASP.NET Web Api：
```C#
byte[] key = System.Text.Encoding.UTF8.GetBytes(Qiniu.Conf.Config.SECRET_KEY);
using (HMACSHA1 hmac = new HMACSHA1(key))
{
var t = filterContext.Request.Content.ReadAsStringAsync();
t.Wait();
string rawbody = t.Result;
log.DebugFormat("request's rawbody : {0}", rawbody);
string text = filterContext.Request.RequestUri.PathAndQuery + "\n" + rawbody;
log.DebugFormat("PathAndQuery + \n + rawbody : {0}", text);
byte[] digest = hmac.ComputeHash(System.Text.Encoding.UTF8.GetBytes(text));
string computed = Qiniu.Util.Base64URLSafe.Encode(digest);
log.DebugFormat("Computed hash after base64 : {0}", computed);
IEnumerable<string> auths;
if (filterContext.Request.Headers.TryGetValues("Authorization", out auths) && auths.Count() == 1)
{
string auth = auths.First();
log.DebugFormat("Authorization in header : {0}", auth);
if (auth.StartsWith("QBox "))
{
var arr = auth.Substring(5).Split(':');
if (arr.Length == 2)
{
if (arr[1] != computed)
{
log.ErrorFormat("Authorization failed. Since auth from header {0} not equals computed {1}", arr[1], computed);
}
else
{
log.Debug("Authorization success.");
//only pass can be return
return;
}
}
else
{
log.Error("Callback Authorization's format is invalid, can not find two part after split by ':'.");
}
}
else
{
log.Error("Callback Authorization's format is invalid, missing leading 'QBox '.");
}
}
else
{
log.Error("The request from qiniu callback is missing 'Authorization'");
}

filterContext.Response = filterContext.Request.CreateResponse(System.Net.HttpStatusCode.Forbidden);

}

如下幾個注意點：

- 明文應當是請求的path+querystring部分和rawbody
- 對於.NET而言，明文和key都需要用UTF-8編碼變換成位元組才能進行簽名。而php中的hash_hmac函數完全不用這么復雜...
- 簽名的結果再用base64的url安全的方式編碼，再與請求的http頭部的Authorization比較

建議官方在文檔中加入一些相對底層一些的編程語言的實現，php太高端了...

## js-sdk實現略顯粗糙 ##

在使用過程中，我發現[官方的js-sdk](https://github.com/qiniupd/qiniu-js-sdk/)有幾個我覺得不好的地方：

**不能為每個文件獲取UpToken**

試想，在文件上傳過程中有獲取UpToken是必須的，而且UpToken又需要包含預處理指令，不同的文件顯然需要不同的UpToken，而在js-sdk的實現中，只在初始化這個上傳組件對象的時候請求一次上傳憑證，後面所有的上傳都需要使用這個預先得到的UpToken：

```javascript
uploader.bind('Init', function(up, params) {
getUpToken();
});

於是我修改了這部分，在 BeforeUpload 事件中請求UpToken。建議官方考慮更改這個地方
只能實現分片上傳，無法斷點續傳
js-sdk的實現在分片上傳的實現上，是很簡單的，不僅沒有使用分片，而是分塊（一塊4m，調用mkblk），而且沒有實現持久化ctx，或者類似的回調或介面。4m分塊這個問題還可以不追究，沒有實現持久化ctx就說不過去了，不持久化怎麼實現斷點續傳撒?!就算不實現，也應該給出回調的入口，讓調用者來實現持久化，而我實在無法找到這個'空子'可鑽，只能直接在源碼上改動了。
沒有復用流行類庫的東西
這個其實算不上問題，因為作為一個不依賴jquery的sdk，當然不能使用jquery現成的東西，比如ajax。不依賴jquery就算了，依賴plupload是幾個意思嘛，還依賴全局對象...於是最後，我乾脆自己將sdk改成了Backbone的類，將不要的東西統統去掉，使用jquery和underscore簡化代碼了...

㈢ 面試官問如何學習前端的怎麼回答

現在從事IT方向的人有很多。由於Web前端薪資水平高，職業前景廣闊，崗位缺口大，就業口徑寬，想通過學習Web前端開發從而進入到該行業工作的人越來越多。當然也有很多人在猶豫不知道web前端開發都學哪些內容？零基礎的可以學會嗎？好不好學.
前端涉及到的東西太多了，自己也很浮躁，看了挺多書，可是代碼缺敲得卻不多。技術菜，又什麼都想學，比如現在糾結要不要先學scss或者php或者angularjs,backbone等框架，還是深入學習html5+css3？

在我看來前端這20%的東西大概就是常用的html標簽，css的盒子模型，基本的原生js，以及熟練使用jquery，ajax，常見瀏覽器的兼容。拿下這些東西意義非凡，一方面證明你適合做前端這份工作，另一方面這些技能能讓你找到一份工作。讓你能夠從容地去學習剩下的80%。
總之就是專心對付最重要的東西，那些什麼less、sass、angular這類的東西，當你把我之前說的基礎打好之後，學習起來暢通無阻，隨學隨用。最後我覺得最難的就是實踐，只有實踐才能學到真正的技術，新人很難參與一些有價值有意義的項目，沒有這些項目又很難成長，所以自己有項目可參與應該珍惜，沒項目應該多造一些有價值的輪子。

㈣ Web前端的學習順序及內容是什麼

第一階段:

HTML CSS:HTML進階、CSS進階、div css布局、HTML css整站開發。

JavaScript基礎:Js基礎教程、js內置對象常用方法、常見DOM樹操作大全、ECMAscript、DOM、BOM、定時器和焦點圖。

JS基本特效:常見特效、例如:tab、導航、整頁滾動、輪播圖、JS製作幻燈片、彈出層、手風琴菜單、瀑布流布局、滾動事件、滾差視圖。

JS高級特徵:正則表達式、排序演算法、遞歸演算法、閉包、函數節流、作用域鏈、基於距離運動框架、面向對象基礎。

JQuery:基礎使用懸著器、DOM操作、特效和動畫、方法鏈、拖拽、變形、JQueryUI組件基本使用。

第二階段:

HTML5和移動Web開發

HTML5:HTML5新語義標簽、HTML5表單、音頻和視頻、離線和本地存儲、SVG、Web Socket、Canvas。

CSS3:CSS3新選擇器、偽元素、臉色表示法、邊框、陰影、background系列屬性改變、Transition、動畫、景深和深透、3D效果製作、Velocity.js框架、元素進場、出場策略、炫酷CSS3網頁製作。

Bootstrap:響應式概念、媒體查詢、響應式網站製作、刪格系統、刪格系統原理、Bootstrap常用模板、LESS和SASS。

移動Web開發:跨終端WEB和主流設備簡介、視口、流式布局、彈性盒子、rem、移動終端JavaScript事件、手機中常見JS效果製作、Zepto.js、手機聚劃算頁面、手機滾屏。

第三階段:

HTTP服務和AJAX編程

WEB伺服器基礎:伺服器基礎知識、Apache伺服器和其他WEB伺服器介紹、Apache伺服器搭建、HTTP介紹。

PHP基礎:PHP基礎語法、使用PHP處理簡單的GET或者POST請求。

AJAX上篇:Ajax簡介和非同步的概念、Ajax框架的封裝、XMLHttpRequest對象詳細介紹方法、兼容性處理方法、Ajax框架的封裝、Ajax中緩存問題、XML介紹和使用。

AJAX下篇:JSON和JSON解析、數據綁定和模板技術、JSONP、跨域技術、圖片預讀取和lazy-load技術、JQuery框架中的AjaxAPI、使用Ajax實現爆布流案例額。

第四階段:

面向對象進階

面向對象終極篇:從內存角度到理解JS面向對象、基本類型、復雜類型、原型鏈、ES6中的面向對象、屬性讀寫許可權、設置器、訪問器。

面向對象三大特徵:繼承性、多態性、封裝性、介面。

設計模式:面向對象編程思維、單例模式、工廠模式、策略模式、觀察者模式、模板方法模式、代理模式、裝飾者模式、適配器模式、面向切面編程。

第五階段:

封裝一個屬於自己的框架

框架封裝基礎:事件流、冒泡、捕獲、事件對象、事件框架、選擇框架。

框架封裝中級:運動原理、單物體運動框架、多物體運動框架、運動框架面向對象封裝。

框架封裝高級和補充:JQuery框架雛形、可擴展性、模塊化、封裝屬於傳智自己的框架。

第六階段:

模塊化組件開發

面向組件編程:面向組件編程的方式、面向組件編程的實現原理、面向組件編程實戰、基於組件化思想開發網站應用程序。

面向模塊編程:AMD設計規范、CMD設計規范、RequireJS，LoadJS、淘寶的SeaJS。

第七階段:

主流的流行框架

Web開發工作流:GIT/SVN、Yeoman腳手架、NPMer依賴管理工具、Grunt/Gulp/Webpack。

MVC/MVVM/MVW框架:Angular.js、Backbone.js、Knockout/Ember。

常用庫:React.js、Vue.js、Zepto.js。

第八階段:

HTML5原生移動應用開發

Cordova:WebApp/NativeApp/HybirdApp簡介、Cordova簡介、與PhoneGap之間的關系、開發環境搭建、Cordova實戰(創建項目，配置，編譯，調試，部署發布)。

Ionic:Ionic簡介和同類對比、模板項目解析、常見組件及使用、結合Angular構建APP、常見效果(下拉刷新，上拉載入，側滑導航，選項卡)。

React Native:React Native簡介、React Native環境配置、創建項目，配置，編譯，調試，部署發布、原生模塊和UI組件、原生常用API。

HTML5 :HTML5 中國產業聯盟、HTML5 Plus Runtime環境、HBuilder開發工具、MUI框架、H5 開發和部署。

第九階段:

Node.js全棧開發

快速入門:Node.js發展、生態圈、Io.js、Linux/Windows/OS X環境配置、REPL環境和控制台程序、非同步編程，非阻塞I/O、模塊概念，模塊管理工具、開發流程，調試，測試。

核心模塊和對象:全局對象global，process，console，util、事件驅動，事件發射器、加密解密，路徑操做。

祝你學有所成！

如果大家對於學習前端有任何不懂的可以隨時來問我，我給你提供一個非常不錯的前端交流學習qun：前面是一一四，中間是一八八，後面是四九三一。有問題就在裡面問我，這樣你可以少走很多彎路，做起來有效率，記得多跟有經驗的人交流，別閉門造車。如果沒有比較好的教程，也可以管我要。

㈤ web前端都要學習什麼課程

WEB前端學習應該要學習那些課程？

在這里我們把前端學習分為9個階段，進行學習：

第一階段：

HTML+CSS:

HTML進階、CSS進階、div+css布局、HTML+css整站開發、

JavaScript基礎：

Js基礎教程、js內置對象常用方法、常見DOM樹操作大全、ECMAscript、DOM、BOM、定時器和焦點圖。

JS基本特效：

常見特效、例如：tab、導航、整頁滾動、輪播圖、JS製作幻燈片、彈出層、手風琴菜單、瀑布流布局、滾動事件、滾差視圖。

JS高級特徵：

正則表達式、排序演算法、遞歸演算法、閉包、函數節流、作用域鏈、基於距離運動框架、面向對象基礎、

JQuery：基礎使用

懸著器、DOM操作、特效和動畫、方法鏈、拖拽、變形、JQueryUI組件基本使用。

第二階段：

HTML5和移動Web開發

HTML5：

HTML5新語義標簽、HTML5表單、音頻和視頻、離線和本地存儲、SVG、WebSocket、Canvas.

CSS3:

CSS3新選擇器、偽元素、臉色表示法、邊框、陰影、background系列屬性改變、Transition、動畫、景深和深透、3D效果製作、Velocity.js框架、元素進場、出場策略、炫酷CSS3網頁製作。

Bootstrap:

響應式概念、媒體查詢、響應式網站製作、刪格系統、刪格系統原理、Bootstrap常用模板、LESS和SASS。

移動Web開發：

跨終端WEB和主流設備簡介、視口、流式布局、彈性盒子、rem、移動終端JavaScript事件、手機中常見JS效果製作、Zepto.js、手機聚劃算頁面、手機滾屏。

第三階段：

HTTP服務和AJAX編程

WEB伺服器基礎：

伺服器基礎知識、Apache伺服器和其他WEB伺服器介紹、Apache伺服器搭建、HTTP介紹。

PHP基礎：

PHP基礎語法、使用PHP處理簡單的GET或者POST請求、

AJAX上篇：

Ajax簡介和非同步的概念、Ajax框架的封裝、XMLHttpRequest對象詳細介紹方法、兼容性處理方法、Ajax框架的封裝、Ajax中緩存問題、XML介紹和使用。

AJAX下篇：

JSON和JSON解析、數據綁定和模板技術、JSONP、跨域技術、圖片預讀取和lazy-load技術、JQuery框架中的AjaxAPI、使用Ajax實現爆布流案例額。

第四階段：

面向對象進階

面向對象終極篇：

從內存角度到理解JS面向對象、基本類型、復雜類型、原型鏈、ES6中的面向對象、屬性讀寫許可權、設置器、訪問器。

面向對象三大特徵：

繼承性、多態性、封裝性、介面。

設計模式：

面向對象編程思維、單例模式、工廠模式、策略模式、觀察者模式、模板方法模式、代理模式、裝飾者模式、適配器模式、面向切面編程。

第五階段：

封裝一個屬於自己的框架

框架封裝基礎：

事件流、冒泡、捕獲、事件對象、事件框架、選擇框架。

框架封裝中級：

運動原理、單物體運動框架、多物體運動框架、運動框架面向對象封裝。

框架封裝高級和補充：

JQuery框架雛形、可擴展性、模塊化、封裝屬於傳智自己的框架。

第六階段：

模塊化組件開發

面向組件編程：

面向組件編程的方式、面向組件編程的實現原理、面向組件編程實戰、基於組件化思想開發網站應用程序。

面向模塊編程：

AMD設計規范、CMD設計規范、RequireJS，LoadJS、淘寶的SeaJS。

第七階段：

主流的流行框架

Web開發工作流：

GIT/SVN、Yeoman腳手架、NPM/Bower依賴管理工具、Grunt/Gulp/Webpack。

MVC/MVVM/MVW框架：

Angular.js、Backbone.js、Knockout/Ember。

常用庫：

React.js、Vue.js、Zepto.js。

第八階段：

HTML5原生移動應用開發

Cordova：

WebApp/NativeApp/HybirdApp簡介、Cordova簡介、與PhoneGap之間的關系、開發環境搭建、Cordova實戰(創建項目，配置，編譯，調試，部署發布)。

Ionic：

Ionic簡介和同類對比、模板項目解析、常見組件及使用、結合Angular構建APP、常見效果(下拉刷新，上拉載入，側滑導航，選項卡)。

ReactNative：

ReactNative簡介、ReactNative環境配置、創建項目，配置，編譯，調試，部署發布、原生模塊和UI組件、原生常用API。

HTML5+：

HTML5+中國產業聯盟、HTML5PlusRuntime環境、HBuilder開發工具、MUI框架、H5+開發和部署。

第九階段：

Node.js全棧開發：

快速入門：

Node.js發展、生態圈、Io.js、Linux/Windows/OSX環境配置、REPL環境和控制台程序、非同步編程，非阻塞I/O、模塊概念，模塊管理工具、開發流程，調試，測試。

核心模塊和對象：

全局對象global，process，console，util、事件驅動，事件發射器、加密解密，路徑操作，序列化和反序列化、文件流操作、HTTP服務端與客戶端。

Web開發基礎：

HTTP協議，請求響應處理過程、關系型資料庫操作和數據訪問、非關系型資料庫操作和數據訪問、原生的Node.js開發Web應用程序、Web開發工作流、Node.js開發Blog案例。

快速開發框架：

Express簡介+MVC簡介、Express常用API、Express路由模塊、Jade/Ejs模板引擎、使用Express重構Blog案例、Koa等其他常見MVC框架。

最後學習計劃有啦，那就趕快開始學習吧！

㈥ Java和PHP哪個比較好

以前對這兩種語言我都有進行過較長時間研究，當然，現在這兩個我都已經不弄了，換node了（這是在後端方面哈，另一部分工作是web前端），我不說哪個好，我只說說個人感覺吧，我先假設你是想要做後台開發的，而不是要做安卓，不然這沒法比呀，php和java都蠻成熟的，所以學哪個你都不吃虧，但是實事求是的講，在實際工作中php沒java那麼多麻煩事，雖然經過測試比java慢點，但是現在都什麼時代了，這點性能真的已經不是問題了，要是真的那麼追求速度的話你就直接拿C寫咯，go語言也不錯，php讓你能更快速地完成一個東西，而且php7不是也出來了嗎，速度也快得很呀。
你現在問這個問題，搞java的猴子肯定說java好，搞PHP的猴子肯定說PHP好，要不然怎麼體現這幫猴子的價值呢，都是有私心的。客官，來來來，這邊還有一幫node猴子要讓你加入呢，哈哈。

說正經的，其實要是多學幾門語言之後，你真的會發現，什麼語言並不重要，你的思維，你的經驗才是最珍貴的，要知道答案，你就得自己親自去搗鼓這兩種語言，搗鼓完了，你就有了你自己的答案了。
你信不信一個php猴子比一個web前端的猴子能更快地轉型成為一node猴子呢，雖然web前端和node語法都是javascript。
你信不信前端寫起來其實比後端更麻煩、後期更難，但是做後端的猴子往往喜歡鄙視做前端的猴子。
你信不信函數式其實挺好的，但是在三年前寫個東西沒有繼承多態和抽象都不好意思拿出手，覺得函數式好的猴子往往被鄙視。
你信不信其實jquery挺穩妥挺成熟挺方便的挺兼容的，但是有好多vue\react\angular猴子都鄙視那些用jquery的猴子,還好backbone猴子沒有這樣。
是的，我的很多想法跟主流都不太一樣，也許之後還會變，但是現在這是我搗鼓完之後屬於自己的答案，你管得著嗎，一幫死猴子。

㈦ backbone，collection中刪除一個model實例，怎樣做

假設我們有一個Person的Model，一個Person會有多個工作，那麼我們將jobs這個屬性設置為一個Collection:

初始化代碼如下：

復制代碼
var Job = Backbone.Model.extend({

});

var Jobs = Backbone.Collection.extend({
model:Job,
});

var Person = Backbone.Model.extend({

});
復制代碼
下一步，給Person設置jobs的屬性：

var Person = Backbone.Model.extend({
initialize:function(options){
this.set('jobs',options.jobs);
}
});
然後創建jobs的collection以及person object,將jobs賦值給person.jobs屬性：

var jobs = new Jobs([{name:'PHP工程師'},{name:'設計師'},{name:'測試人員'}]);
var jimmy = new Person({jobs:jobs});
通過chrome的console看到值：

我們添加一些view，因為在backbone.js里view才是MVC里的Controller:

復制代碼
var PersonView = Backbone.View.extend({
tagName:'ul',

initialize:function(){
this.render();

this.model.get('jobs').on('add',this.addFirst,this);
},

addFirst:function(job){
var jobView = new JobView({model:job});
this.$el.prepend(jobView.render().el);
},

renderOne:function(job){
var jobView = new JobView({model:job});
this.$el.append(jobView.render().el);
},

render:function(){
var jobs = this.model.get('jobs');

jobs.each(function(job){
this.renderOne(job);
},this);

$(document.body).append(this.el);
}
});

var JobView = Backbone.View.extend({
tagName:'li',

template:'',

initialize:function(){
this.model.on('change',this.render,this);
},

render:function(){
var template = _.template(this.template,this.model.toJSON());
this.$el.html(template);
return this;
},
});
復制代碼
這里要為Job單獨設置一個view是因為一個model對應一個view的'BB原則'，方便在model改變的時候，view改變。

最後new PersonView:

var jimmyView = new PersonView({model:jimmy});
-

㈧ Node.js代碼轉php

如果你們開發團隊正在使用PHP，並考慮遷移到Node.js，這篇文章很適合你。本文並不探討從PHP移植到Node.js的細節，以及Node.js的基礎知識。而是涵蓋：決策制定、著手點的描述、編寫 Node.js 伺服器的深層次注意事項、以及部署策略。

為什麼遷移？

1stdibs 決定從 Apache/PHP 遷移到 Node.js+Express 有五個理由：

代碼更少
全棧式JS
開發人員幸福度更高
投入回報率
未來的優化
代碼更少

1stdibs基於面向服務體系架構（SAO），前端調用後台的Java服務。這意味著需要同時維護前端模型，以及服務端PHP和客戶端JS模板。試想一下，如果可以擺脫PHP，就能夠統一前端展現與後台模型於一種語言：JavaScript（同時可以合並一些模板）。從維護的角度來看，這么做代碼更簡潔，並且沒有重復邏輯。

同構JavaScript萬歲!

全棧式JS（及其優點）

整個開發棧使用一種語言很簡便。對開發者來說，較少的環境切換使他們開心和高效。額外的好處是工具使用更簡單。相比之前使用Composer和npm兩個包管理器，現在只需要一個。盡管Composer很出色，由於nbp負責工具和客戶端管理，nbp總是必要的。一旦去掉所有的PHP代碼，nbp將成為僅有的包管理器。

開發人員樂意

我們要保證開發人員的技能集得到擴展、職業生涯不斷發展，這一點很重要。對於JavaScript工程師而言，Node.js極具吸引力。能夠在服務端使用與客戶端相同的工具、風格和模式，是非常順手和高效的。此外，Node.js相當流行，在企業級開發上也得到了長足發展。Node.js是JavaScript工程師的必備技能。

投入回報率

我們在招聘優秀的JS工程師和培訓初級JS工程師方面花了大價錢。由於客戶端棧很復雜，我們需要高級JavaScript工程師。我們不再僱用PHP工程師，僅僅僱用了JavaScript工程師。我們的觀點是，為什麼不培養他們在服務端的技能呢？

未來的優化

長遠而言，我們打算把兩個龐大的應用分割成一系列獨立部署的小應用。這很容易通過Node.js、Express和nbp實現。理論上，PHP（比如使用Slim）可以做同樣的事。但我們非但得不到上述好處，還會搞得一團糟：在Apache/PHP上進行操作會更加復雜，基礎設施也會變得有些奇怪。

選擇框架

那個最終被我們用Node.js替換掉的PHP應用，主要有如下職責：

登錄和授權
路由選擇和服務端模板引擎（服務HTML）
引導前端應用
代理服務（為了迴避CORS）
服務靜態資源（js，css，images）
這些就是我們需要替換掉的基本功能。

我們嘗試過不少框架，Express令人嘆為觀止（試一下我們評估過的spreadsheet）。任何未基於Express 的框架看起來都不靠譜。Express通俗易懂，並有良好的文檔。另外，可以招聘到正經培訓過Express的人。

我們添加了一些kraken的核心模塊（express-enrouten用於路由選擇、lusca負責安全）；此外，i18n-node提供國際化支持，模板引擎使用Swig（我們後來放棄了Swig。呵呵，開源軟體還是有風險的）。

我們考慮過全盤使用kraken，但是從原來的服務端php模板引擎Twig切換到Swig直截了當，還很快捷。此外，kraken裡面的Dust和i18n也不討人喜歡。

編寫伺服器

選好了框架，下一步該寫伺服器了。

使用Apache+PHP時，你不需要再寫一個伺服器。Apache本身就是伺服器，PHP是應用。如果使用Node.js，伺服器和應用是同一個。從Apache/PHP轉到PHP，你需要處理一些之前自然而然使用的功能，這一點很重要。使用Apache，你（或者系統管理員）配置伺服器，在PHP應用里完全不用關心Apache為你處理的那些事。Node.js卻以一種不同的方式來工作。

提供靜態文件服務

毋庸置疑，提供靜態文件服務是Apache的核心功能。Node.js與此不同，你要在應用中配置靜態文件服務。幸運的是這很簡單，有良好的文檔說明，並且是在Express中實現的。

日誌

很多基本的Apache配置為你提供訪問日誌和錯誤日誌。使用Node.js時，估計你也猜到了，同樣需要在應用中配置。所幸很多優秀的開源軟體包使之變得很簡單。Morgan是一個基本的請求日誌記錄器，它配置簡單，允許你把日誌寫到輸出流（標准輸出設備或文件）。如果你需要把日誌寫到資料庫，或者有別的（更高級的）日誌需求，那就試一下winston吧。

代理

我們有一個基本需求：能夠代理傳輸客戶端ajax請求到後台服務。相比於處理CORS頭，代理所有來自相同域的請求要簡單得多。但你要想通過代理使用webpack-dev-server（正如我們所做的），就必須在Node.js應用中處理這一問題。http-proxy是一個簡單可靠的解決方案。

剩下的工作

除了上面提到的，還有一些列別的工作需要完成。我們從一個MVC應用談起，該應用基於 CodeIgniter(CI)框架，為一系列單頁應用提供服務。大部分工作就是移植：

CI控制器移植到Express路由選擇器和中間件（包括登錄和認證）
Twig模板引擎移植到Swig（這一步比較瑣碎）
Service層數據訪問（以便正常啟動客戶端單頁應用）
上面並未列出CodeIgniter模型這一關鍵組件。事實上根本不用重寫PHP模型！太給力了！我們的客戶端應用使用Backbone模型。當然這要擴展Backbone.Model.sync，從而使之全局地工作在伺服器和客戶端。

部署

如果你的app規模較大，不應該一次性全部上線。可以通過漸進式部署的方式逐步上線。我們因此花費了好幾周。

漸進式部署的優點：

最小化bug范圍
每次在發布一部分路由及功能的同時，其他工程師可以正常進行開發
對正在進行的功能開發和改進影響最小 — 新功能可以繼續發布（這可能導致重復的工作）
如果操作得當，可以快速回滾到之前的服務
NGINX很不錯

該如何逐步上線呢？我們在眾多的伺服器中挑選了Nginx。

1
2
3
4
5

+----------+

http | |--->
Apache/PHP

request---->| Nginx
|

| |--->
Node.js

+----------+

Nginx允許你一次只「打開」一個路由（如果發現情況不妙就關掉 — 正如我們多次遇到的），這給了你很大的自由度。我們也發現打開路由的時候不用部署代碼，這很有幫助。這在一周一次的發布計劃里，為我們提供了一些迴旋空間。

不過有一個缺點，你需要確保客戶端代碼同時接受舊的Apache/PHP伺服器和新的Node.js伺服器提供的服務。這並不可怕，不過你要把舊伺服器上未優化的功能移植到新的伺服器。屏住呼吸去做吧（記得寫一個便利貼去清理你的技術債）。

總結

從頭到尾，整個移植工作大概花費了一年。這聽起來可能有點荒謬，不過這個時間表包括決策過程（比較匆忙）、基於Express寫一個滿足需求的核心框架、移植所有功能、逐步漸進式上線。此外，請記住，我們始終只有一兩個開發者為之工作 — 並且是兼職。

如果你想嘗試一下，請慎重考慮。你的團隊能否受益？你的整個組織能否受益？如果你來自商業組織，請記住商業需要持續運轉。你需要在商業目標和工程目標之間找到良好的平衡。

㈨ 同作為JavaScript MVC框架，Backbone和AngularJS各有什麼優缺點

backbone更輕巧一些，如果再配合require.js使用的話做出來的東西比Angular.js要小巧的多，但是backbone的一些底層抽象不如Angular.js做的好，也就是說，Angular.js更好的封裝了一些底層的東西，讓使用者用起來更順手，也更方便。
其次，backbone和Angular在編寫上也是很大不同的，backbone更側重於JS的編寫，就像開發PHP程序那樣調用前端的DOM數據而Angular則是通過注入來擴展HMLT標簽的屬性，它們在編寫思想上是不同的。
最後要說的很重要的一點就是，backbone有中文的API而Angular不用說中文API就連官網都被封了，所以你只能看別人寫的東西了至於API差不差的到查不查的全就看你自己了，反正我是不打算學Angular了~