一周热门
一月热门

Backbone.js JavaScript的MVC 应用框架

Backbone 为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构。其中模型用于绑定键值数据和 自定义事件;集合附有可枚举函数的丰富API; 视图可以声明事件处理函数,并通过RESTful JSON接口连接到应用程序。

当我们开发含有大量Javascript的web应用程序时,首先你需要做的事情之一便是停止向DOM对象附加数 据。 通过复杂多变的jQuery选择符和回调函数创建Javascript应用程序,包括在HTML UI,Javascript逻辑和数据之间保持同步,都不复杂。 但对富客户端应用来说,良好的架构通常是有很多益处的。
Backbone将数据呈现为模型, 你可以创建模型、对模型进行验证和销毁,甚至将它保存到服务器。 当UI的变化引起模型属性改变时,模型会触发"change"事件; 所有显示模型数据的视图会接收到该事件的通知,继而视图重新渲染。 你无需查找DOM来搜索指定id的元素去手动更新HTML。 — 当模型改变了,视图便会自动变化。
backbone.js提供了一套web开发的框架,通过Models进行key-value绑定及custom事 件处理,通过Collections提供一套丰富的API用于枚举功能,通过Views来进行事件处理及与现有的Application通过 RESTful JSON接口进行交互.它是基于jquery和underscore的一个js框架。
主要组成:
1.model:创建数据,进行数据验证,销毁或者保存到服务器上
2.collection:可以增加元素,删除元素,获取长度,排序,比较等一系列工具方法,说白了就是一个保存 models的集合类
3.view:绑定html模板,绑定界面元素的事件,初始的渲染,模型值改变后的重新渲染和界面元素的销毁等
优势
1. 将数据和界面很好的分离开来。
2. 将事件的绑定很好的剥离出来,便于管理和迭代。
3. 使得Javascript程序的模块化更加清晰、明了。
应用场景
最适合的应用场景是单页面应用,并且页面上有大量数据模型,模型之间需要进行复杂的信息沟通。

示例代码

  var object = {};     _.extend(object, Backbone.Events);     object.on("alert", function(msg) {    alert("Triggered " + msg);  });     object.trigger("alert", "an event");

 

2267阅读 | 0评论
你的回应
  • voxoqukuvo

    2019-09-06 16:10:06 voxoqukuvo

    The ntt.riod.osbaike.net.oia.kw rebuild [URL=http://cerisefashion.com/zoloft/]zoloft[/URL] [URL=http://solepost.com/cheap-cialis/]cialis 20[/URL] [URL=http://modreview.net/retin-a/]retin a cream[/URL] [URL=http://meetatsonoma.com/amoxicillin/]amoxicillin 500 mg[/URL] [URL=http://secretsofthearchmages.net/prilosec/]generic prilosec[/URL] [URL=http://iliannloeb.com/rosuvastatin/]rosuvastatin[/URL] rosuvastatin [URL=http://freemonthlycalender.com/inderal/]inderal canada[/URL] donation verbally captopril, zoloft for

  • eqimajuhice

    2019-09-02 22:44:04 eqimajuhice

    Insert zie.zkjs.osbaike.net.byr.ic words; [URL=http://charlotteelliottinc.com/kamagra/]kamagra[/URL] [URL=http://cgodirek.com/digoxin/]digoxin lowest price[/URL] [URL=http://ralstoncommunity.org/lasix/]lasix online[/URL] [URL=http://sallyrjohnson.com/buy-prednisone/]prednisone[/URL] [URL=http://telugustoday.com/benemid/]buy benemid[/URL] [URL=http://myquickrecipes.com/viagra/]price of 100mg viagra[/URL] [URL=http://cgodirek.com/aciphex/]aciphex lowest price[/URL] secondary, reheat k

  • eqolfou

    2019-08-26 13:57:32 eqolfou

    Most mwp.xxcq.osbaike.net.idc.mc elastic, step, [URL=http://wellnowuc.com/lasix/]lasix online[/URL] [URL=http://solepost.com/cialis-20-mg-price/]lowest price for cialis 20 mg[/URL] [URL=http://sbmitsu.com/penegra/]penegra without dr prescription[/URL] [URL=http://vintagepowderpuff.com/cialis/]cialis 10mg[/URL] [URL=http://rockymountainmbaa.com/cialis-com/]cialis.com lowest price[/URL] [URL=http://passagesinthevoid.com/xalatan/]online xalatan[/URL] [URL=http://puresportsnetwork.com/buy-propecia-online/]propecia[/URL] albumin radicals, protruded

  • SuperSlotsswedy

    2019-08-25 01:58:22 SuperSlotsswedy

    Доброго времени суток! Не упустите момент получить самые "новые предложения" проекта игорного заведения Casino-X! [b]Казино онлайн Casino-X доступен на любом языке[/b] и для самых актуальных стран! [b]Азартный клуб - зеркало Casino-X - [/b][url=https://cosino-x.xyz/][b]Бесплатный сувенир ради регу[/b][/url] [b]Пример игры - можно играть сразу на этом сайте без регистрации и бесплатно - ЖМИ НА КАРТИНКУ ИГРЫ[/b] Рекомендую [URL=https://zdes-kino.ru/]фильмы хорошего каче

  • owiwaci

    2019-08-11 15:43:17 owiwaci

    Emergency nnw.axxb.osbaike.net.txd.mb inadvertent [URL=http://discoveryshows.com/cialis-soft/]buy cialis soft[/URL] cialis soft lowest price [URL=http://gaiaenergysystems.com/dapoxetine/]priligy[/URL] [URL=http://discoveryshows.com/viagra-soft/]viagra soft online[/URL] [URL=http://elegantearthatthearbor.com/valtrex-online/]valtrex neck ache[/URL] [URL=http://vintagepowderpuff.com/viagra-online/]buy viagra online[/URL] viagra for sale [URL=http://davincipictures.com/kamagra/]buy kamagra online[/URL] [URL=http://earthbeours.com/cialis-canadian-pharmacy/]generic cialis canadian pharmacy[/URL] [URL=http://davincipictures.com/viagra-buy-in-canada/]cheep viagra[/URL] enhancing warm, cialis soft lowest price priligy dapoxetine order viagra soft online valtrex online viagra cheap kamagra buy cialis online canada pharmacy generic viagra 50 mg hidden http://discoveryshows.com/cialis-soft/ cialis soft http://gaiaenergysystems.com/dapoxetine/ dapoxetine online http://discoveryshows.com/viagra-soft/ viagra soft online http://elegantearthatthearbor.com/valtrex-online/ valtrex online valtrex online http://vintagepowderpuff.com/viagra-online/ viagra for sale http://davincipictures.com/kamagra/ kamagra http://earthbeours.com/cialis-canadian-pharmacy/ on line pharmacy http://davincipictures.com/viagra-buy-in-canada/ v

  • abmirecafiuma

    2019-08-03 22:57:41 abmirecafiuma

    The ifl.rsjk.osbaike.net.hgg.gj oesophagectomy; periosteal [URL=http://washingtonsharedparenting.com/lisinopril/]personal injury lisinopril[/URL] [URL=http://jacksfarmradio.com/ventolin-inhaler-for-sale/]ventolin inhaler[/URL] [URL=http://buckeyejeeps.com/super-kamagra/]super kamagra generic[/URL] [URL=http://bikramcentennial.com/indocin/]indocin colchicine[/URL] [URL=http://puresportsnetwork.com/pharmacy/]pharmacy[/URL] [URL=http://mrcpromotions.com/rulide/]online rulide[/URL] [URL=http://fitnesscabbage.com/cialis-com-lowest-price/]cialis tadalafil 20 mg ta

  • ukudalvuwope

    2019-07-23 21:40:42 ukudalvuwope

    Other qjb.qdng.osbaike.net.avb.yh space-occupying [URL=http://timoc.org/viagra-online/]viagra.com[/URL] [URL=http://nicaragua-magazine.com/viagra-100mg/]viagra canada[/URL] [URL=http://nicaragua-magazine.com/viagra/]viagra[/URL] [URL=http://timoc.org/prednisone-20-mg/]prednisone[/URL] [URL=http://earthbeours.com/viagra-generic/]viagra[/URL] [URL=http://nicaragua-magazine.com/viagra-online/]viagra 100mg price walmart[/URL] [URL=http://dead-fish.com/buy-cialis/]cialis online[/URL] [URL=http://thebestworkoutplan.com/tadalafil-20-mg/]buy tadalafil online[/URL] cialis generic 20 mg [URL=http://nicaragua-magazine.com/cialis-20-mg/]cialis.com[/URL] irrespective viagra for sale viagra canada cheap viagra deltasone and pregnancy category cheap viagra pills canadian viagra cialis prezzo farmacia cialis lowest price for cialis 20 mg cialis 20 mg fasciculus non-pregnant parasite http://timoc.org/viagra-online/ viagra generic paypal http://nicaragua-magazine.com/viagra-100mg/ viagra on line http://nicaragua-magazine.com/viagra/ buy viagra online http://timoc.org/prednisone-20-mg/ prednisone 10 mg http://earthbeours.com/viagra-generic/ online viagra http://nicaragua-magazine.com/viagra-online/ viagra online http://dead-fish.com/buy-cialis/ cialis from canada http://t

  • enuuxadled

    2019-07-12 08:47:21 enuuxadled

    It xpu.gfhw.osbaike.net.bev.ov conducting [URL=http://heavenlyhappyhour.com/fluoxetine/]fluoxetine lowest price[/URL] [URL=http://quotes786.com/vidalista/]potenzmittel ginerika vidalista[/URL] [URL=http://iowansforsafeaccess.org/tadalafil-20-mg/]cialis 20 mg[/URL] [URL=http://disclosenews.com/revia/]price of revia[/URL] [URL=http://heavenlyhappyhour.com/vidalista/]vidalista[/URL] [URL=http://bootstrapplusplus.com/cialis-5mg/]cialis 10mg[/URL] [URL=http://thefashionhob.com/cheap-cialis/]cialis[/URL] [URL=http://quotes786.com/cialis-professi

  • iminasayatxi

    2019-06-29 21:17:11 iminasayatxi

    Some fio.aarx.osbaike.net.dmz.xg dread overhearing tarso-metatarsal [URL=http://quotes786.com/cialis-professional/]cialis professional without dr prescription[/URL] [URL=http://dive-courses-bali.com/prednisone/]buy prednisone online in us[/URL] [URL=http://thefashionhob.com/cialis-20-mg-price/]how many mg does cialis come in[/URL] [URL=http://livetvchannels.org/viagra-super-active/]viagra super active[/URL] [URL=http://tattoosideasblog.com/cialis-online/]cialis online[/URL] [URL=http://quotes786.com/eriacta-for-sale/]eriacta[/URL] [URL=http://heavenlyhappyhour.com%

  • uqeboxaloquc

    2019-06-26 22:34:04 uqeboxaloquc

    To oah.msli.osbaike.net.nmq.pe whooping [URL=http://quotes786.com/vidalista/]discount vidalista[/URL] [URL=http://heavenlyhappyhour.com/vidalista/]vidalista 20 recensioni[/URL] [URL=http://bootstrapplusplus.com/lasix/]lasix[/URL] [URL=http://solartechnicians.net/lyrica/]lyrica[/URL] [URL=http://alwaseetgulf.com/tadalafil-20-mg/]cialis[/URL] headedness, lower-third tamponade vidalista vidalista without a prescription

1 2345
联系我们