tips & tricksBackbone.js

dasolute.com

신대현@dahinir

백수

Alloy X Backbone

VesionBackbone 최신 1.1.2

Alloy 사용 버젼 0.9.2

http://docs.appcelerator.com/backbone/0.9.2/

앱 설정값을 backbone.js 로 저장 해보자!

전역적으로 사용될 설정값들. 예를 들어

run_count

theme

active_tab

..

저장된 앱 셋팅을 불러오자// 아마도 alloy.js(앱 시작)에 쓰일 코드 // 저장된 앱 설정값을 불러온다.Alloy.Globals.settings = { run_count: Ti.App.Properties.getString("run_count"), theme: Ti.App.Properties.getString("theme"), active_tab: Ti.App.Properties.getString("active_tab") // etcs..};

Backbone.model 을 쓰자var settings = Alloy.createModel('settings');

// 저장된 앱 설정값을 불러온다.settings.set({ run_count: Ti.App.Properties.getString("run_count"), theme: Ti.App.Properties.getString("theme"), active_tab: Ti.App.Properties.getString("active_tab")});

// 이제 settings를 쓸 수 있다!myTabGroup.setActiveTab( settings.get('active_tab') );

이렇게 쓰고 싶어var settings = Alloy.createModel('settings');

// 저장된 앱 설정값을 불러온다.settings.fetch();

.save() 했던걸 .fetch() 했더니..// 싱글톤으로 생성 var settings = Alloy.Models.instance('settings');settings.save('theme', 'green');

// 앱이 종료 된것 처럼 완전 삭제 settings.clear();delete settings;

// 재시작 된 것 처럼 처음부터 다시var settings = Alloy.Models.instance('settings');settings.fetch();settings.get('theme'); // undefined

안되네?

아 맞다 id같은 id를 지정해야 같은걸 넣고 뺀다.

var settings = Alloy.Models.instance('settings');// 아이디를 뭘로 하든 같은것만 쓰면 된다 settings.id = "WHAT_EVER_YOU_WANT";settings.save('theme', 'green');

var settings = Alloy.Models.instance('settings');settings.id = "WHAT_EVER_YOU_WANT";settings.fetch();settings.get('theme'); // 'green'

model.idvs

model.set('id')with idAttribute

먼저 model.attributesvar settings = Alloy.createModel('settings');settings.set('run_count', 3);

settings.attributes.run_count; //3settings.get('run_count'); // 3

일반적으로 쓰이는 모델 변수들은 실제로 model.attributes 에 저장됨

하지만 id 는 특별한 property각 모델의 identity를 결정하는 meta data

하지만 model.attributes 에도 저장됨

settings.set('id', 'WHAT_EVER_YOU_WANT');

settings.id; // WHAT_EVER_YOU_WANTsettings.get('id'); // WHAT_EVER_YOU_WANT

settings.id = 'WHAT_EVER_YOU_WANT';

settings.id; // WHAT_EVER_YOU_WANTsettings.get('id'); // undefined

id동작은 model.id 기반으로 함

id는 일반 변수 중 하나로 지정되서 사용됨

햇갈? .idAttribute 기본값이 'id' 라서 햇갈햇반

model.idAttribute = _id;settings.idAttribute = "_id";settings.set('_id') = "WHAT_EVER_YOU_WANT";

settings.id; // 그래도 이건 아이디(변수 자체가 Backbone이 지정)settings._id; // undefinedsettings.attributes._id; // 이게 아이디로 사용settings.get('_id'); // 이것도settings.get('id'); // undefined

.idAttribute는 .attributes의 변수중 id로 사용할 변수의 이름을 지정

아까 그거var settings = Alloy.Models.instance('settings');settings.id = "WHAT_EVER_YOU_WANT";settings.save('theme', 'green');

var settings = Alloy.Models.instance('settings');settings.id = "WHAT_EVER_YOU_WANT";settings.fetch();

settings.get('theme'); // 'green'

우아하게 쓰려면..var settings = Alloy.Models.instance('settings');settings.save('theme', 'green');

var settings = Alloy.Models.instance('settings');settings.fetch();

settings.get('theme'); // 'green'

모델 정의에서 해결config: { adapter: { type: "properties" }},extendModel: function(Model) { _.extend(Model.prototype, { id: "WHAT_EVER_YOU_WANT" }); return Model;}

되진 되지만..var settings = Alloy.Models.instance('settings');settings.fetch();

settings.id; // WHAT_EVER_YOU_WANTsettings.get('id') // undefined

.attributes에 셋팅되야 할것은.defaults에

config: { .. },extendModel: function(Model) { _.extend(Model.prototype, { defaults: { id: "WHAT_EVER_YOU_WANT" } }); return Model;}

appcelerator문서에는 defaults를 config안에 넣으라 되있지만..

type: "properties" 일 때..// config :Alloy가 다루는 백본 설정 config: { defaults: { theme: "blue" // 안돼요! }, adapter: { type: "properties", // not "sql" collection_name: "settings", idAttribute: "_id" // 안돼요!! }},extendModel: function(Model) { _.extend(Model.prototype, { idAttribute: "_id", // 여기!! id: "WHAT_EVER_YOU_WANT", // 굳이쓴다면.. not _id defaults: { // attributes의 기본값 _id: "WHAT_EVER_YOU_WANT", theme: "blue" // 여기!! } }); return Model;}

type: "properties" 결론Alloy보단 Backbone을 믿는게..

-

내가 사용할 모델 프로퍼티와 id는 .get()과 .set()을 사용한다.

이것들은 model.attributes에 저장된다.

이것들의 기본값은 model.defaults 객체에 선언한다.

-

id를 제외한 특수 목적의 백본 변수 기본값은 Model.prototype에 직접

id는 model.id에도 저장되고 model.attributes.id에도 저장되서 햇반

model.cid 는 또 뭐야백본이 알아서 생성하는 아이디

클라이언트에서만 유일한 값

같은 인스턴스인지 체크할때 유용

model.defaults에 객체를 넣으려면// photo modeldefaults: { url: "/photo/defaults.png", owner: { name: "Me", age: -1 }}

?!!var myPhoto1 = Alloy.createModel('photo');var myPhoto2 = Alloy.createModel('photo');

myPhoto1.get('owner').age; // -1myPhoto2.get('owner').age; // -1

myPhoto2.get('owner').age = 22;

myPhoto1.get('owner').age; // 22myPhoto2.get('owner').age; // 22

in JavaScript, objects are passed by reference

define defaults as a function// photo modeldefaults: function(){ return { url: "/photo/defaults.png", owner: { name: "Me", age: -1 } };}

tutorialshttp://backbonejs.org

http://backbonetutorials.comhttp://addyosmani.github.io/backbone-fundamentals/

Keep Your Models Fat!Code Strong!