모델이란 무엇입니까?
백본의 저자는 모델을 다음과 같이 정의합니다.
모델은 모든 웹 애플리케이션의 핵심이며 대화식 데이터와 대부분의 논리가 포함되어 있습니다. 예 : 변환, 확인, 속성 및 액세스 권한 등.
그래서 먼저 모델을 만들어 봅시다.
person = backbone.model.extend ({initialize : function () {alert ( "backbone에 오신 것을 환영합니다!");}); var person = new Person;위의 코드에서는 사람이 지명 된 모델을 정의하고 인스턴스화 후에는 사람을 얻습니다. 모델을 인스턴스화 할 때마다 초기화 () 메소드가 자동으로 트리거됩니다 (이 원리는 수집,보기에도 적용됨). 물론, 모델을 정의 할 때 초기화 () 메소드는 필수가 아니지만 백본을 사용하면 필수 불가능합니다.
모델 속성을 설정하십시오
이제 모델 인스턴스를 만들 때 모델의 속성을 설정할 때 일부 매개 변수를 전달하려고합니다.
person = backbone.model.extend ({initialize : function () {alert ( "backbone!");}}); // set var person = new person ({name : "stephenlee", age : 22}); // 모델이 세트 ()에 의해 인스턴스화 된 후 var person = new Person ()을 설정할 수 있습니다. var person = new Person (); person.set ({이름 : "Stephenlee", 나이 : 22});모델 속성을 얻습니다
get () 모델의 메소드를 사용하여 속성을 얻을 수 있습니다.
person = backbone.model.extend ({initialize : function () {alert ( "backbone에 오신 것을 환영합니다!");}}); var person = new Person ({name : "Stephenlee", age : 22}); var age = person.get ( "age"); // 22var name = person.get ( "name"); // "Stephenlee"모델 기본 속성을 설정합니다
때로는 모델의 기본 속성 값을 인스턴스화 할 때 기본 속성 값을 포함시키기를 원하며 모델의 기본값을 정의하여 달성 할 수 있습니다.
person = backbone.model.extend ({기본값 : {이름 : "lebronjames", Age : 30,}, 초기화 : function () {alert ( "backbone에 오신 것을 환영합니다!"); var person = new Person ({이름 : "Stephenlee"}); "Age"( "Age"); // 인스턴스화 중에 연령 값이 지정되지 않기 때문에 기본값은 30var name = person.get ( "name")입니다. // 인스턴스화가 이름 값을 설정 한 경우 "Stephenlee"입니다.모델 속성을 사용하십시오
모델에서 메소드를 사용자 정의하여 모델 내에서 속성을 사용할 수 있습니다. (모든 사용자 정의 메소드 기본값으로 공개)
person = backbone.model.extend ({기본값 : {이름 : "lebronjames", Age : 30, Hobby : "Basketball"}, 초기화 : function () {alert ( "backbone to backbone!");}, function (HobbyName) {this.set ({Hobby : Hobbyname});});});}); "Stephenlee", 나이 : 22}); person.like ( "Coding"); // Stephenlee의 취미를 Codingvar Hobby = person.get ( "Hobby")에 설정합니다. // "코딩"모델 속성의 변경을 들어보십시오
백본 메커니즘에 따르면, 우리는 모델의 모든 속성을들을 수 있습니다. 다음으로, 초기화 () 메소드에서 모델의 속성을 바인딩하여 속성 이름을 예로 들어 보려고합니다.
person = backbone.model.extend ({defaults : {이름 : "lebronjames", age : 30,}, 초기화 : function () {alert ( "backbone to backbone!"); this.on ( "Change : name", function (model) {var name = model.get ( "name"); 'kobebryant'alert ( " + name); }}); var person = new Person (); var age = person.set ({이름 : "kobebryant"});위의 코드를 통해 모델의 특정 속성을 듣는 방법을 알고 있습니다. 모델의 모든 속성에 대해 들어야한다고 가정하면 'this.on ( "Change", function (model) {})을 사용하십시오. .
서버와 모델 간의 데이터 상호 작용
앞에서 언급했듯이 모델에는 대화식 데이터가 포함되어 있으므로 기능 중 하나는 서버에서 전송 된 데이터를 전달하고 서버와 상호 작용하는 것입니다. 이제 서버에 MySQL의 테이블 사용자가 있으며 3 개의 필드 ID, 이름 및 이메일이 있다고 가정 해 봅시다. 서버 측은 REST 스타일을 사용하여 프론트 엔드와 통신하고 URL : /사용자를 사용하여 상호 작용합니다. 우리의 모델은 다음과 같이 정의됩니다.
var usermodel = backbone.model.extend ({urlroot : '/user', defaults : {name : '', 이메일 : ''}});모델을 만듭니다
백본의 각 모델에는 속성 ID가 있으며 서버 측 데이터에 하나씩 해당합니다. 서버 측 MySQL 테이블 사용자에 새 레코드를 추가하려면 모델을 인스턴스화하고 Save () 메소드를 호출하면됩니다. 현재 모델 인스턴스의 속성 ID가 비어 있으므로 모델이 새로 생성되므로 백본은 지정된 URL에 게시물 요청을 보냅니다.
var usermodel = backbone.model.extend ({urlroot : '/user', defaults : {name : ', email :' '}}); var user = new usermodel (); // var userdetails = {이름 :'stephenlee ', 이메일 :'Stephenlee ', 이메일 : '[email protected]'}; // 모델에는 ID 속성이 없기 때문에 현재 Save () 메소드를 사용하십시오. 백본은 서버 측에 게시물 요청을 보냅니다. 데이터를 수신 한 후 서버 측은 IT를 저장하고 ID를 포함하는 정보를 ModelUser.Save (userDetails, {success : function (user) {alert (user.tojson ());})에 반환합니다.현재 서버의 MySQL 사용자 테이블에 Stephenlee라는 이름과 이메일 [email protected]이있는 추가 레코드가 있습니다.
모델을 얻으십시오
방금 모델을 만들어 서버 측 데이터베이스에 저장했습니다. 모델을 작성할 때 서버 측에서 리턴 된 ID 속성 값은 1이라고 가정하면 현재 ID 값을 통해 저장된 데이터를 검색 할 수 있습니다. ID 속성 값으로 모델 인스턴스를 초기화하면 fetch () 조작을 통해 백본은 지정된 URL에 GET 요청을 보냅니다.
var user = new usermodel ({id : 1}); // 초기화 중에 ID 값을 지정하십시오. // fetch () 메소드를 사용하여 사용자/1에게 데이터를 요청하고 서버 측은 이름, 이메일 및 기타 정보 사용자를 포함하여 전체 사용자 레코드를 반환합니다 ({user (user) {alert (user.tojson ();}}).모델을 업데이트하십시오
저장된 사용자 레코드를 수정 해야하는 경우 알려진 ID 값을 사용하고 Save () 메소드를 사용하지만 현재 ID가 비어 있지 않기 때문에 Backbone은 지정된 URL에 PUT 요청을 보냅니다.
var user = new usermodel ({id : 1, name : 'stephenlee', email : '[email protected]'}); // id 값이 지정되어 있으므로 ID 값을 지정할 때 ID 값을 지정하십시오.이 시간에 저장 () 메소드를 사용하십시오. Backbone은 PUT 요청을 사용자/1에 보내고 데이터베이스 user.Save에서 ID 1이있는 레코드의 이메일을 수정합니다 ({이메일 : '[email protected]'}, {success : function (model) {alert (user.tojson ());}});모델을 삭제하십시오
데이터베이스에서 레코드를 삭제 해야하는 경우 알려진 ID 값을 사용하고 Destrove () 메소드를 사용하십시오. 이 시점에서 백본은 지정된 URL로 삭제 작업을 보냅니다.
var user = new usermodel ({id : 1, name : 'stephenlee', email : '[email protected]'}); // id 값이 지정되기 때문에 ID 값을 지정하기 때문에 Destion () 메소드를 사용하여 Backbone은 삭제 요청을 사용자에게 보냅니다. 요청을 수신하면 ID 1이있는 데이터가 데이터베이스 user.destroy에서 삭제됩니다 ({success : function () {alert ( 'destroyed');}});컬렉션이란 무엇입니까?
요컨대, 백본의 컬렉션은 예를 들어 순서대로 모델 모음입니다. 예를 들어 다음 상황에서 사용될 수 있습니다.
모델 : 학생, 컬렉션 : ClassStudentsModel : TODO 항목, 컬렉션 : TODO LISTMODEL : Animal, Collection : Zoo
컬렉션은 일반적으로 동일한 유형의 모델 만 사용하지만 모델은 다음과 같은 다른 유형의 컬렉션에 속할 수 있습니다.
모델 : 학생, 컬렉션 : Gym ClassModel : 학생, 컬렉션 : Art ClassModel : 학생, 컬렉션 : 영어 수업
컬렉션을 만듭니다
// 모델 정의 송바 송 = backbone.model.extend ({defaults : {이름 : {name : "specified", 아티스트 : "지정되지 않음"}, 초기화 : function () {console.log ( "Music is the Answer");}); // collection define alick it) Song1 = New Song ({이름 : "How Bizarre", 아티스트 : "OMC"}); var Song1 = New Song ({이름 : "How"How ", Artist :"OMC "}); var Song2 = New Song ({성적 치유", var Song 3 = New Song (Artist : "Bed"); myalbum = 새 앨범 ([song1, song2, song3]); console.log (myalbum.models); // 출력은 [Song1, Song2, Song3]입니다.