在原型构造函数中创建对象引用

Question

I'm trying to wrap my head around using Javascript prototype objects and have run into a block perhaps due to my understanding of a traditional classes.

My code looks like the following:

$(document).ready(function () {
    var instance = new cards();
    $dom = instance.buildItem(5);
}
var cards = function () {
    //constructor
    this.chromaObj = chroma.scale(["lightblue", "navy"]).domain([2, 6]);
}
cards.prototype.buildItem = function (val) {
    var scale = this.chromaObj;
    var $item = $("<span>" + val + "</span>").addClass("label-default").addClass("label").css({
        "background-color": scale(val)
    });
    return $item;
}

Every time scale is called in the buildItem function, I receive an error in the console that scale is not a function, however, if I create the scale instance inside of the buildItem function, it works as expected.

Can someone please point me in the right direction as to why I am unable to access the function reference when it is defined in the constructor?

Answer 1

The original code does in fact work correctly.

My problem turned out to be that I was calling buildItem from another method (not shown here) using the generic cards.prototype.buildItem() , which caused a subsequent call to chromaObj to be undefined.

The solution was to change all calls to cards.prototype.buildItem() to this.buildItem() .