Models contain data of an
application. Model contain business entity , with validation a business
logic. Model is responsible to supply data to view and get data from
view for storage. Model is core object of in JavaScript application.Below are the list of method that can be used .
1.extend : You can create custom Model class ,extend Backbone.Model and provide instance properties.
syntax :Backbone.Model.extend(properties, [classProperties])
Example
Output :
Here is the result :john|4
2.constructor / initialize :You can create instance of a model, you can pass in the initial values of the attributes to set model.
Initialize function is invoke when the model is created.
Example
3.get :Get the value of an attribute from the model.
';
- extend
- constructor / initialize
- get
- set
- escape
- has
- unset
- clear
- id
- idAttribute
- cid
- attributes
- changed
- defaults
- toJSON
- sync
- fetch
- save
- destroy
- validate
- validationError
- isValid
- url
- urlRoot
- parse
- clone
- isNew
- hasChanged
- changedAttributes
- previous
- previousAttributes
1.extend : You can create custom Model class ,extend Backbone.Model and provide instance properties.
syntax :Backbone.Model.extend(properties, [classProperties])
Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" type="text/javascript"></script>
<script
type="text/javascript">
var
student = new
Backbone.Model({
name:
"john",
class:
4
});
document.write('Here
is the result :'
+ student.get('name')
+ '|'
+ student.get('class'));
</script>
</head>
</html>
Output :
Here is the result :john|4
2.constructor / initialize :You can create instance of a model, you can pass in the initial values of the attributes to set model.
Initialize function is invoke when the model is created.
Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
student
= Backbone.Model.extend({
defaults:
{
name:
"",
class:
""
},
initialize:
function
(a,b)
{
document.write("This
is a initial function.");
this.set("name",
a);
this.set("class",
b);
}
});
var
mymodel = new
student('john',12);
document.write('Name
:'+mymodel.get('name')
+ '');
document.write('class
:'
+ mymodel.get('class')
+ '');
</script>
</head>
</html>
Output :
This is a initial function.
Name :john
class :12
Name :john
class :12
syntax :model.get(attribute)
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
student
= Backbone.Model.extend({
defaults:
{
name:
"",
class:
""
},
initialize:
function
(a,b)
{
document.write("This
is a initial function.");
this.set("name",
a);
this.set("class",
b);
}
});
var
mymodel = new
student('john',12);
document.write('Name
:'+mymodel.get('name')
+ '');
document.write('class
:'
+ mymodel.get('class')
+ '');
</script>
</head>
</html>
Output :
This is a initial function.
Name :john
class :12
Name :john
class :12
4. set :Set a value of attributes on the model.
Syntax :model.set(attributes, [options])Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
student
= Backbone.Model.extend({
defaults:
{
name:
"",
class:
""
},
initialize:
function
(a,b)
{
document.write("This
is a initial function.");
this.set("name",
a);
this.set("class",
b);
}
});
var
mymodel = new
student('john',12);
document.write('Name
:'+mymodel.get('name')
+ '');
document.write('class
:'
+ mymodel.get('class')
+ '');
</script>
</head>
</html>
Output :
This is a initial function.
Name :john
class :12
Name :john
class :12
5.escape : Same like get, but returns the HTML-escaped version of a model's attribute.
Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
student
= Backbone.Model.extend({
defaults:
{
banner:
""
},
initialize:
function
(a, b) {
var
htm = '
Ayan :' + b + '
Name :
+ a + 'Ayan :' + b + '
this.set("banner",
htm);
}
});
var
mymodel = new
student('john',12);
document.write('----------------Example
of get------------');
document.write(mymodel.get('banner')
+ '');
document.write('----------------Example
of escape------------');
document.write(mymodel.escape('banner')
+ '');
</script>
</head>
</html>Output :
