渣渣想请教下有关backbone的一点入门理解问题

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

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.

这是一个创建于 4315 天前的主题，其中的信息可能已经有所发展或是发生改变。

前几天去面试实习，无奈问道了前端的mvc，顿时表示不知道，然后回来看了下，看别人推荐，选了backbone这个，然后大概粗略的看了下官网的文档，然后在csnd啥的看了几个例子，有点不解，就是，我看里面有的什么model，view，colletion，这些我感觉理解起来有点困难。

说了那么说的话，其实问题就一个，就是好难体会他这种mvc的思想，之前写的时候都是一条龙的页面html再加上需要绑定的事件的jquery。就是理解不了这个思想，新手问了一个比较2的问题，请轻拍，希望过来人能给一些文章或者是资料什么的好参考下，特此感谢了~~

MVC

Backbone

理解

11 条回复 2016-07-25 01:27:55 +08:00

refresh

2013-12-17 11:35:21 +08:00

backbone的教程已经很多了，model是数据层，view负责数据呈现，collection负责控制。
楼主看这个：http://todomvc.com/，非常全的各种mvc例子。

meteor

2013-12-17 11:39:17 +08:00

我是喜欢看视频的.
https://www.codeschool.com/courses/anatomy-of-backbonejs
虽然买不起, 但是提供免费看的也不错.
如果时间多的话,可以看下书.
http://addyosmani.github.io/backbone-fundamentals/
不知道有没有中文的.

FrankFang128

2013-12-17 12:32:49 +08:00 via Android

你用就Query的时候也用了MVC思想，只是你不知道

Tankpt

2013-12-17 12:34:58 +08:00

@FrankFang128 嗯。。应该是的。。感觉都没深入了解。很有欠缺。。

Tankpt

2013-12-17 12:36:20 +08:00

@refresh 很感谢你的回复。。。这个网站真好

Tankpt

2013-12-17 12:36:44 +08:00

@meteor 恩恩。。我看了点。不错。正好练听力。。谢谢先

zztczcx

2013-12-17 17:34:59 +08:00

其实就是换了一种组织代码的方式。

Tankpt

2013-12-17 20:35:47 +08:00

@zztczcx 能否再详细说一下呢。。

FrankFang128

2014-01-23 23:59:32 +08:00

MVC 对于 JS 来说，是舶来品，同时是必需品。
先说为什么是舶来品。因为 MVC 前几年和 JS 一点关系也没有。MVC 常用在后台程序里，PHP 的 MVC 框架多了去了。我就大概的介绍下，我写后台也没写多久。
一般来说 MVC 都有一个 R（Router，即路由），不懂这个概念没关系，先来看看程序员怎么用 Router。
假设我们用 PHP 实现一个 MVC 的 Todo 网站，那么一个熟悉 MVC 的后台开发人员首先要「设计 URL」
http://example.com/todo/list 这个页面用来展示 todo list
http://example.com/todo/add 用于添加 todo
暂且就要这两个URL吧。Router 的作用就是根据 url，找相应的代码来负责响应（Router 本身不负责响应）。

Router 的实现

if url is /todo/list
> then call somebody to show the list page
if url is /todo/add
> then call somebody to show the adding page
if url is /todo/remove

那么谁来当这个 somebody 呢？它就是 Todo 类，这个类有 list 和 add 两个方法。看上去很完美的样子。为什么 Router 不直接做出响应，非要 Todo 类响应呢？分工明确嘛。

这个 Todo 类，被命名为控制器C（为什么叫控制器？因为待会它要控制 Model 和 View）

Todo 的实现

function list
> get all the todo MODELs
> generate a VIEW with the MODELs
> RESPONSE the user with the VIEW

RESPONSE 就是向浏览器发送页面的意思，而 VIEW 差不多就是页面的意思，MODEL 呢？当然是数据。
数据可以是从数据库里得到的。这里你就看到 Controller 是如何在操纵 View 和 Model 了。

function add
> if METHOD == get
> > RESPONSE with the adding VIEW
> if METHOD == post
> > get todo name from the post params
> > generate a MODEL with the todo name
> > save the MODEL (to mysql)
> > RESPONSE with the success VIEW

add 方法首先判断 METHOD 是 get 还是 post。如果是 get（当你在浏览器里输入一个网址时，就是在 get 该网址），就展示添加页面，这个页面可能是一个表单，几个输入框，一个提交按钮。当用户点击提交时，就是 post 了一个请求。如果 METHOD 是 post，就新建一个 model，存到 mysql，然后向用户返回一个成功页面（success VIEW）

MVC 的流程基本就是这样了。
为什么是 MVC？因为通用。哪个网站没有 Model（数据），除非你是全静态网站；哪个网站没有 View（页面HTML）。而 Controller，是为了解藕，Model 现在只负责数据了，View 只负责页面 HTML，那么其他的脏活累活谁做？Controller。 Router 是来干什么的呢？活太多了，需要多个 Controller 来做，是不是需要一个监工/指挥/经理呢？比如现在这个 Todo 网站允许用户注册了，是不是需要一个 User 类来负责登录、注册呢？Router 就是给他们俩指派任务的人。

我理解的后台 MVC 就是这样了。
晚了，前端的 MVC 下次再讲。

TomIsion

2016-07-22 17:37:11 +08:00

@FrankFang128 可以抽时间讲讲前端的 MVC 么讲的很通俗易懂~

FrankFang128

2016-07-25 01:27:55 +08:00

@TomIsion 这是我 2014 年挖的坑……