Backbone.js

MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是将 M 和 V 的实现代码分离,从而使同一个程序可以使用不同的表现形式. 交互方式(所有通信都是单向的): View 传送指令到 Controller Controller 完成业务逻辑后,要求 Model 改变状态 Model 将新的数据发送到 View,用户得到反馈更详细的说明: 模型(Mod…

Backbone.js应用基础

前言: Backbone.js是一款JavaScript MVC应用框架,强制依赖于一个实用型js库underscore.js,非强制依赖于jquery:其主要组件有模型,视图,集合,路由:与后台的交互主要是通过Restful JSON 进行数据传输: 基础Backbone.js知识: 1.引入js文件:如果依赖于第三方类库如jquery,则最好先引入:之后引入underscore.js 这是必须引入且在引入backbone.js之前,其引入文档结构如下: <head> <meta ch…

我对Backbone.js的一些认识

backbone.js已经不是当前最流行的前端框架了,但是对于我而言,依然具有比较好的学习价值.虽然目前来说,react,vue等mvvm框架非常火热,但是感觉自身还不到去使用这种框架的层次.这些技术虽好,但是对个人的挑战也是比较大:首先是在编程基础这个部分,包括数据结构,算法,面向对象编程,设计模式,设计原则等等,我觉得在这些方面积累地还不够:其次是工作方法层面,对比angualr,react以及vue,跟传统的用原生js或者jquery写的代码,包括html,css和js三个方面,你会发现这…

Backbone.js学习之Backbone.View（视图）

Backbone.js为复杂WEB应用程序提供模型(models).集合(collections).视图(views)的结构.其中模型用于绑定键值数据和自定义事件:集合附有可枚举函数的丰富API: 视图可以声明事件处理函数,并通过RESRful JSON接口连接到应用程序. [介绍] 当我们开发含有大量Javascript的web应用程序时,首先你需要做的事情之一便是停止向DOM对象附加数据. 通过复杂多变的jQuery选择符和回调函数很容易创建Javascript应用程序,包括在HTML UI…

前端mvc框架backbone.js入门[转]

原文地址:http://www.cnblogs.com/zhjh256/p/6083618.html 关于backbone.js的优缺点,这里就不详谈了,网上关于这方面的讨论很多了,而且各种框架之所以长久生存,通常都是有其特定优势和擅长点的. 使用backbone.js作为前端框架的应用通常都是html和javascript分离的,也可参考requirejs的结构. 本文介绍backbone.js的入门教程,通过本篇,读者应该能够比官方API更快和更好的理解基于backbone.js的应用. 首…

Backbone.js是一套JavaScript框架與RESTful JSON的應用程式介面.也是一套大致上符合MVC架構的編程範型.Backbone.js以輕量為特色,只需依賴一套Javascript 函式庫即可運行[1].常被用來開發單頁的網際網路應用程式[2],以及用來維護網路應用程式的各種部份(例如多使用者與伺服器端)的同步[3].Backbone.js是由Jeremy Ashkenas所開發,他同時也是CoffeeScript的開發者[4]. http://backbonejs.org…

用Backbone.js教程系列的链接

整理了一下用Backbone.js系列教程链接. Backbone.js入门教程用Backbone.js创建一个联系人管理系统(一) 用Backbone.js创建一个联系人管理系统(二) 用Backbone.js创建一个联系人管理系统(三) 用Backbone.js创建一个联系人管理系统(四) 用Backbone.js创建一个联系人管理系统(五)…

用Backbone.js创建一个联系人管理系统(五)

原文: Build a Contacts Manager Using Backbone.js: Part 5 这是这系列教程最后一部分了. 之前所有的增删改都在前端完成. 这部分我们要把Contact的数据存储到数据库里. 开始准备在这里我们需要一个Web服务器,还有一个数据库. 可以是SQLServer.我们需要在数据库中创建一个表来存储Concat. 表还要有一个主键ID,最好这个ID是unique和自增长类型的. 虽然现在我们的Concat model里没有这个属性但是要把它存储到数…

用Backbone.js创建一个联系人管理系统(四)

原文: Build a Contacts Manager Using Backbone.js: Part 4 这一系列教程的第四部分,教我们如何完成对已经存在的Contacts进行编辑和保存. 本教程是基于这一系列的前三个教程. 有不清楚的请先阅读前三部分. 开始在Contact原模版里添加一个edit按钮. <button class="edit">Edit</button> 在原Contact显示模版下添加新的编辑模版 <script id=&quo…

用Backbone.js创建一个联系人管理系统(三)

原文: Build a Contacts Manager Using Backbone.js: Part 3 欢迎回到这系列的教程,关注使用Backbone.js构建应用程序. 如果你还没看过第一,二部分推荐你先看第一二部分~~~~ 剩下内容我简单翻译重要部分, 相同类似太多废话了就不说了. 添加model到collection 要添加单独的一个model到collection中. 首先我们要提供一个填写model信息的表.请把下面的html添加到ID为contacts的div中. <form…

前端mvc框架backbone.js入门

关于backbone.js的优缺点,这里就不详谈了,网上关于这方面的讨论很多了,而且各种框架之所以长久生存,通常都是有其特定优势和擅长点的. 使用backbone.js作为前端框架的应用通常都是html和javascript分离的,也可参考requirejs的结构. 本文介绍backbone.js的入门教程,通过本篇,读者应该能够比官方API更快和更好的理解基于backbone.js的应用. 首先,定义一个html宿主页面: <!DOCTYPE html> <html lang=&quo…

[转]backbone.js template()函数

本文转自:http://book.2cto.com/201406/43974.html 本文所属图书 > Backbone.js实战资深Web开发专家根据Backbone js最新版本撰写,对它的所有功能.特性.使用方法和开发技巧进行了全面而透彻的讲解,是系统学习的权威参考书.本书以一种开创性的写作方式,使理论与实践达到了极好的平衡.不仅对立即去当当网订购在Underscore库中,template()是一个十分重要的函数,这个轻量级的函数可以帮助开发人员有效地组织页面的结构和底层逻辑.…

[转]backbone.js 示例 todos

本文转自:http://www.css88.com/doc/backbone/examples/todos/index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Backbone.js Todos</title> <link rel="stylesheet" hr…

[转]backbone.js 初探

本文转自:http://weakfi.iteye.com/blog/1391990 什么是backbone backbone不是脊椎骨,而是帮助开发重量级的javascript应用的框架. 主要提供了3个东西:1.models(模型) 2.collections(集合) 3.views(视图) backbone.js文件本身很小,压缩后只有5.3KB,作为一个框架级别的核心JS文件,这个数字很可怕. 除此之外,这个JS还必须依赖于另一个JS文件:underscore.js(包含许多工具方法,集合…

Backbone.js源码分析(珍藏版)

源码分析珍藏,方便下次阅读! // Backbone.js 0.9.2 // (c) 2010-2012 Jeremy Ashkenas, DocumentCloud Inc. // Backbone may be freely distributed under the MIT license. // For all details and documentation: // http://backbonejs.org (function () { // 创建一个全局对象, 在浏览器中表示为w…

Backbone.js学习之二

经历一段自我修炼,终于领悟到Backbone.js的关键知识点,也发现了原来MVC可以在前端这样梦幻的发挥,Backbone.js确实是一个很有魅力的前端MVC框架. 练就一门技术,需要有扎实的功底,从这点,开始认真研究Backbone.js的一些最基本的操作,以便我日后学习能更上一层楼.那就切入主题: 什么是mvc? 简单的理解就是:模型(models),视图(views),控制器(collections).通过视图把浏览器的网址传给控制器,控制器对网址进行解析,然后去模型层获取数据,模型层将…

Backbone.js学习之一

昨天一个我崇拜的朋友,徐飞送我一本名为<Backbone.js实战>书,让我心中狂喜,于是带着这份浓厚的兴趣,开始研究Backbone.js之路. 打开这本书的第一句话就很有哲理,“授人以鱼,不如授之以渔.”,我花了一段时间仔细的看完了的第一章节,今天通过自己所理解的, 记录下我自学的第一步.其他不多说,进入主题: 首先在学习Backbone.js之前要了解Backbone.js是什么? 在我看来它是一个处理前端MVC很好的js框架,Backbone是一个非常轻量级的javascript库,自…

backbone.js学习笔记

之前只接触过jQuery,看来Backbone是除了jQuery的第二大JS框架... backbone到底是个啥? 其实刚开始我也不知道=_=,我是这周二才听说居然还有这么个框架...于是乎我的导师就让我看官方文档,官方文档真的是顾名思义,写的可是真官方...让我这个小老百姓感觉到诘屈聱牙...但是该理解还是得理解,不然怎么用呢?那么我是怎么理解的呢? Backbone.js是一个重量级js MVC 应用框架,也是js MVC框架的鼻祖.它通过Models数据模型进行键值绑定及custom事件…

Backbone.js入门教程

原文: Getting Started with Backbone.js 不像其它的Web开发语言,过去Javascript很少可用的架构.令人感到高兴的是,最近几年这种情况得到非常大的改善. 今天我要高兴的像你介绍backbont.js. 一个能够非常容易创建复杂的,交互式数据驱动应用但却非常小巧的框架.她提供了简单清楚的方法把数据从表现层中分离出来. Overview和FAQ我就不多翻译了. 开始了解Backbone.js Backbone.js由四个大类构成 Model Collect…

用Backbone.js创建一个联系人管理系统(一)

原文 Build a Contacts Manager Using Backbone.js: Part 1 在这个教程里我们将会使用Backbone.js,Underscore.js,JQuery创建一个完整的联系人管理应用. 我们会看到如何使用Underscore.js的一些基本组件方便的来展现出Backbone.js的方法. 这些库都是什么? Backbone.js是一个Javascript的前端的MVC架构 Underscore.js是一个工具集,他对Javascript功能进行了一些增强…

用Backbone.js创建一个联系人管理系统(二)

欢迎大家回来继续这一教程,第一部分我们学习了model,collection和view在Backbone中的基本用法,还有怎么样用主视图去绑定collection去渲染出每个Contact. 这部分我们学习怎么通过用户输入过滤视图中的数据还要怎么给我们的应用程序加入路由的功能. 响应用户输入从第一部分你可以发现每个model都有一个属性type,这个属性可以把model分成朋友,家人,同事等等. 让我们给主视图加入一个select控件来对models进行按type类型选择的操作. 我们当然可…

使用backbone.js、zepto.js和trigger.io开发HTML5 App

为了力求运行速度快.响应迅即,我们推荐使用backbone.js和zepto.js. 为了让这个过程更有意思,我们开发了一个小小的示例项目,使用CSS重置样式.Backbone.js和带转场效果的几个页面.我们的项目会显示Trigger推特更新内容和单个的推特消息.与往常一样,我们将使用同一个HTML5代码库创建安卓和iOS应用程序.在这个过程中,我们将介绍如何: 把你的JavaScript文件添加到应用程序中使用Backbone.js来显示响应迅即的界面使用CSS重置样式,减少跨平台出现的…

[backbone] Getting Started with Backbone.js

一.简介 Backbone 是一个 JavaScript MVC 框架,它属于轻量级框架,且易于学习掌握.模型.视图.集合和路由器从不同的层面划分了应用程序,并负责处理几种特定事件.处理 Ajax 应用程序或者 SPI 应用程序时,Backbone 可能是最好的解决方案. 二.详细介绍 Backbone的四大核心组件: Model Collection View Controller Modal Models are the heart of any JavaScript application…

使用Underscore.js的template将Backbone.js的js代码和html代码分离

这段时间在学习Require.js和Backbone.js的过程中,发现有些项目里的HTML代码都是写在View的js代码里面的,渲染的时候需要对Collection进行循环,再将HTML代码拼接上去,这似乎不是一件非常好的事情,因为将js代码和html代码融合到一起会增加代码的维护难度,而且这个过程中考虑到性能的因素,需要将HTML代码放到一个数组中,最后进行拼接,代码写起来比较麻烦.我看到他们的代码之后就在考虑是否有一种类似php模板引擎的东西可以将Collection传递进去然后渲染. 我…

Backbone.js学习之View

千呼万唤始出来,终于到最后一个要点View了.照旧,先来一睹官方文档: Backbone views are almost more convention than they are code - they don't determine anything about your HTML or CSS for you, and can be used with any JavaScript templating library. The general idea is to organize y…

Backbone.js学习之初识hello-world

说了好久好久要学习Backbone.js,现在终于下定决心开始学习了.然后呢,就根据我的学习进度在这里做个简单的记录,方便新人,也方便我自己以后回忆. 准备用bower下载这几个库或框架也是醉了...由于使用的红杏只能在浏览器上使用,所以在GFW的协同之下真是下载得相当龟速啊! jquery(或者zepto),underscore.js,backbone.js终于下载完成,成功引入之后.开始从网上扒helloworld了....不要吐槽我,我就喜欢在学习之前先来个整体的demo看看. 然后我就…

比較Backbone.js, Angular.js, Ember.js, Knockout.js 心得

還記得第一次寫網站的時候,我無意間寫成了 SPA(single page application),當時還沒有SPA這個詞,後來因為廣告主需要不同 url location 頁面的廣告展示,只好把部分網站改成一般網頁.但是一直以來我對於提高整體溝通效率以及使用端的回應效率抱持相同的想法,希望能夠把更多回應放到 client 處理,讓server 做好 api 提供者的角色,可以讓網站回應更即時而親切,這篇心得文不會詳細走訪每個技術層面,而是提供概括的入門使用情況. 現在client-side j…

Backbone.js developer 武汉年薪8w-10w

1. 精通Backbone.js 2. 熟练Ajax.NoSQL.RESTful APIs 3. 了解Pusher.com和 Parse.com 4. 具有良好的沟通能力,学习能力,敬业.有职业素养,责任心强,能承受工作压力 5. 公司会按国家规定提供相关保险福利待遇,并提供良好的发展空间 6. 相关工作经验两年以上工作地点:武汉…

理解 backbone.js 中的 bind 和 bindAll 方法，关于如何在方法中指定其中的 this，包含apply方法的说明[转载]

转载自:http://gxxsite.com/content/view/id/132.html 在backbone.js的学习过程中,被bind和bindAll弄得有点晕,这里包括underscore.js的bind和bindAll,以及JQuery提供的bind方法.在一篇En博客中学习,写下这篇笔记 1.首先说熟悉的JQuery的bind,引用api帮助文件的内容即可很清晰地理解其使用意义和方法: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19…

[Backbone.js]如何处理Model里面嵌入的Collection?

写了近半个月的backbone.js代码,从一开始的todo到现在做仿微信的网页聊天,其中最大的困惑就在于如何处理比较复杂的Model,其内嵌了一个或者多个Collections. 假设我们有一个Person的Model,一个Person会有多个工作,那么我们将jobs这个属性设置为一个Collection: 初始化代码如下: var Job = Backbone.Model.extend({ }); var Jobs = Backbone.Collection.extend({ model:J…

【Backbone.js】的更多相关文章