2014-02-16 5 views
0

I имеют следующую структуру:Ссылка ошибка «свойство объекта не определен»

appInterface = { 
    mainWinCanvas: document.getElementById("mainwindow"), 
    mainWinContext: mainWinCanvas.getContext("2d"), 
    mainWinCanvasWidth: mainWinCanvas.width, 
    mainWinCanvasHeight: mainWinCanvas.height, 
    mainWinCanvasData: mainWinContext.getImageData(0, 0, mainWinCanvasWidth, mainWinCanvasHeight) 
} 

и получить эту ошибку в Firebug: mainWinCanvas is not defined

Что вызывает это? Я уверен, что сценарий называется элементом AFTER. Предыдущие дети полностью загружены. Моя цель состоит в том, чтобы сделать код более читаемым, это не объект-версия работает :(

+0

Итак, что делать? Кажется, первый комментатор уничтожил предложение ... – 1000Gbps

+0

Просто замените имя свойства 'document.getElementById (« mainwindow »)' (также можно кэшировать вне литерала объекта) или использовать [getter] (https: // developer. mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters) или создать объект с помощью функции-конструктора. – Teemu

+0

Да, но это добавляет слишком много писем в код. Вторая идея классная, но это означает отсутствие хорошо структурированных объектов. Третий, похоже, добавит больше кода. – 1000Gbps

ответ

1

Там не намного больше кодирования, при создании объекта с помощью функции конструктора:

function AppInterface (cnvid) { 
    this.mainWinCanvas = document.getElementById(cnvid); 
    this.mainWinContext = this.mainWinCanvas.getContext("2d"); 
    this.mainWinCanvasWidth = this.mainWinCanvas.width; 
    this.mainWinCanvasHeight = this.mainWinCanvas.height; 
    this.mainWinCanvasData = this.mainWinContext.getImageData(0, 0, this.mainWinCanvasWidth, this.mainWinCanvasHeight); 
} 
var appInterface = new AppInterface("mainwindow"); 

Вы даже можете повторно использовать конструктор, если вам нужно больше, чем один «appInterFace» в вашем приложении.

+0

На данный момент ваш ответ является самым ясным решением. – 1000Gbps

0

Объект не имеет локального контекста, вы должны доступом его главным заданием appInterface

appInterface = { 
    mainWinCanvas: document.getElementById("mainwindow"), 
    mainWinContext: appInterface.mainWinCanvas.getContext("2d"), 
    mainWinCanvasWidth: appInterface.mainWinCanvas.width, 
    mainWinCanvasHeight: appInterface.mainWinCanvas.height, 
    mainWinCanvasData: appInterface.mainWinContext.getImageData(0, 0, appInterface.mainWinCanvasWidth, appInterface.mainWinCanvasHeight) 
} 

Если вы хотите иметь локальные функции использования контекста вместо

EDIT

использование функции конструктора вместо этого, вам нужен живой экземпляр для самостоятельной ссылки

var appInterface = new function(){ 
    this.test = 4; 
}; 
appInterface = { 
    anotherTest:appInterface.test 
} 

console.log(appInterface.test) 
+1

Вы протестировали это? Got 'appInterface undefined' –

+0

Истинно, тогда с объектом нет go, должна быть функция – markcial

+0

Для' mainWinContext' я получаю 'TypeError: appInterface undefined' – 1000Gbps

2

Все, что вам нужно сделать, это обернуть это в функции и возвращает его как объект так this контекст должен быть доступен для текущего appInterface объекта. Также преобразуйте свои свойства в методы, чтобы вы могли выполнять цепочку методов.

var appInterface = function() { 
    return { 
     canvas: null, 
     ctx: null, 
     mainWinCanvas: function (elem) { 
      if (this.canvas === null) { 
       this.canvas = document.getElementById(elem); 
      } 
      return this; 
     }, 
     mainWinContext: function() { 
      this.ctx = this.canvas.getContext("2d"); 
      return this; 
     }, 
     mainWinCanvasWidth: function() { 
      return this.canvas.width; 
     }, 
     mainWinCanvasHeight: function() { 
      return this.canvas.height; 
     }, 
     mainWinCanvasData: function() { 
      this.ctx.getImageData(0, 0, this.mainWinCanvasWidth(), this.mainWinCanvasHeight()); 
      return this; 
     } 
    }; 
}; 

Использование:

appInterface().mainWinCanvas('mainWindow').mainWinContext().mainWinCanvasWidth(); 
+0

Это отбрасывает еще один' TypeError: appInterface.CPanel не определен, пока пытаясь добавить в 'document.body.onload'' appInterface.CPanel.addEventListener ('click', function() {}); ' – 1000Gbps

+0

@Teemu Это было не то, что я пытался опубликовать, это было опубликовано слишком раньше. Кстати, я забыл преобразовать свойства в методы. Теперь это должно сработать. –

+1

@ 1000Gbps См. Обновленный код, если он вам поможет. –

0

Один хромой обходной путь, чтобы избежать функции Writting и геттеры/сеттеры, чтобы сделать следующее:

appInterface = new Object(); 
appInerface.mainWinCanvas = document.getElementById("mainwindow"); 
appInerface.mainWinContext = appInerface.mainWinCanvas.getContext("2d"); 
... 

Это глупо, я не глубоко JS, но не вижу разницы между новым Object() и соответствующим определением его свойств или структуры в вопросе ...

Смежные вопросы