If you’ve ever attempted to use arrays or objects on a Backbone.js model, you might have run into some strange behavior.
At first glance, everything seams perfectly normal. You can define a model with arrays/objects as properties no problem.
But as soon as you try to change those properties you’ll see that your model doesn’t fire change events consistently.
Setting the property to a new array does fire the change event.
.get() and changing the array does not fire the change event, but does change the model.
(now it gets really weird)
.get(), changing the array, and re-setting it also does not fire the change event, but does change the model.
So what to do now?
Always use _.clone()
Underscore (a dependency of backbone), includes a handy
clone() function that can fix this problem. If you clone the array first, it will behave just like any other property.
This problem can be especially tricky to catch, because you most often won’t notice it until your views are only rendering part of the time.
If you want to read more on this problem, there’s a good in-depth answer on stackoverflow on the subject.