instance.method не является функцией (javascript) - PullRequest
Новая
       1

instance.method не является функцией (javascript)

2 голосов
/ 17 декабря 2011

Привет, я новичок в javascript. Поэтому я просто попытался создать простой объект, который рисует два квадрата на холсте. Чтобы лучше понять ориентацию объекта, я поместил их в разные объекты (где drawtest.js является основным). К сожалению, я не вижу, где моя ошибка. Я искал сообщения на stackoverflow в течение нескольких часов, даже пример из моей профессии выглядит (похоже), как мой, я не вижу разницы, но его версия работает. В firebug я получаю:

testobject.draw не является функцией

Что я забыл или сделал неправильно?

"index.html" 

<!DOCTYPE html>
<html>  

<head>  
<title>simple object test</title>
<script src="js/drawtest.js" type="text/javascript"></script>
<script src="js/testobject.js" type="text/javascript"></script>

</head>  

<body>

<canvas id="canvas" width="300" height="300"></canvas>  

</body>  

</html>

тестовый файл "drawtest.js" 

window.onload = function(){ init(); };

var canvas;
var context;

function init() 
{
canvas = document.getElementById("canvas");  
context = canvas.getContext("2d"); 

testobject = new Test(context);

testobject.draw();  //this is where I get testobject.draw is not a function

}

объект "testobject.js" 

function Test(context){

this.context = context;


Test.prototype=
{

draw:.
function()
{   
this.context.fillStyle = "rgb(200,0,0)";  
this.context.fillRect (10, 10, 55, 50);  

this.context.fillStyle = "rgba(0, 0, 200, 0.5)";  
this.context.fillRect (30, 30, 55, 50);  
}
};
}

1 Ответ

3 голосов
/ 17 декабря 2011

Несколько проблем:

  1. У вас есть синтаксическая ошибка: 

    draw:.
//   ^--- here

    Удалите точку.Синтаксическая ошибка должна отображаться в консоли JavaScript / error любого браузера, который вы используете.Пройдите по системе меню вашего браузера, чтобы найти его инструменты для разработчиков;Вы хотите познакомиться с ними.У Chrome неплохой набор, в последние версии Firefox они встроены, более старые версии могут использовать плагин Firebug.

  2. Лучше не заменять aфункции конструктора prototype;вместо этого просто добавьте к нему: 

    Test.prototype.draw = function() {   
    this.context.fillStyle = "rgb(200,0,0)";  
    this.context.fillRect (10, 10, 55, 50);  

    this.context.fillStyle = "rgba(0, 0, 200, 0.5)";  
    this.context.fillRect (30, 30, 55, 50);  
};

  3. Вы не хотите вносить свои prototype модификации в функции конструктора, перемещая эту часть за пределыфункция конструктора.Таким образом, функция Test и связанные с ней свойства прототипа становятся такими: 

    function Test(context){

    this.context = context;
}

Test.prototype.draw = function() {   
    this.context.fillStyle = "rgb(200,0,0)";  
    this.context.fillRect (10, 10, 55, 50);  

    this.context.fillStyle = "rgba(0, 0, 200, 0.5)";  
    this.context.fillRect (30, 30, 55, 50);  
};
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...