在Backbone视图中定义变量的最佳实践

时间:2014-06-22 18:17:00

标签: javascript backbone.js requirejs

我有一个Backbone视图,必须处理很多逻辑。我正在使用require.js,我想知道为该视图创建变量的最佳方法是什么。我目前的设置是这样的。

define([
'jquery',
'underscore',
'backbone',
'pixi',
'tweenlite',
'easepack',
'app/models/tower-item-model',
'app/views/tower-item-view',
'app/templates'

], function($, _, Backbone, PIXI, TweenLite, EasePack, TowerItemModel, TowerItemView, Templates){
'use strict';

// ********* create view variables ************

var numberOfTowers = 1;  // this is set by the icons in the top right of the view. Default is 1
var sectionWidth = 180;
var mmToPixelRatio = 180/300;
var currentWidth = 0;
var currentHeight = 0;
var currentDepth = 0;
var frameColourPressed = false;

var hiliteIntensity = 0;
var hiliteUp = true;
var hiliteIntervalID;



var TowerView = Backbone.View.extend({
    id: 'tower-view',
    className: 'tower-view',
我是否认为这些变量目前在全局命名空间中?如果是这样,我想这不好。我有另一个这样的视图设置,应用程序正在创建它的几个实例。我注意到其中一个变量的变化影响了所有变量。

是否有一种更简单的方式来声明变量,使它们成为真正的实例变量?

非常感谢

1 个答案:

答案 0 :(得分:3)

您只需在视图类

中添加变量即可

例如,

var TowerView = Backbone.View.extend(
{
    id: 'tower-view',
    className: 'tower-view',
    currentWidth : 0,
    currentHeight : 0,
    currentDepth : 0,
    frameColourPressed : false,
    setTowerHeight : function()
                     {
                         console.log(this.currentwidth);
                     }
});

这些被称为真正的类变量,它们对于每个实例都是不同的。