2

我不知道为什么会出现此错误：

错误是：无法获得“0”的值：对象为空或未定义

这是我的代码：

var Box = function(width, height, type){
var top = 0,
    right = 0;
this.width = width;
this.height = height;
this.position = {
    top: top,
    right: right,
    set: function(top, right){
        this.top = top;
        this.right = right;
    }
};
this.type = type;
this.area = this.width * this.height;
this.className = "box_" + this.width + "_" + this.height;};

    var box01 = new Box(2, 2, "slideShow");
    var box02 = new Box(2, 1, "clinics");
    var box03 = new Box(1, 2, "articles");
    var box04 = new Box(1, 1, "news");
    var box05 = new Box(2, 1, "news");
    var box06 = new Box(2, 1, "clinics");

    var boxArray = [];
    boxArray.push(box01);
    boxArray.push(box02);
    boxArray.push(box03);
    boxArray.push(box04);
    boxArray.push(box05);
    boxArray.push(box06);



var BoxUtility = function(parentId) {
this.parentId = parentId;
this.boxList = Array.prototype.pop.apply(arguments);
Object.defineProperties(this, {
    totalArea: {
        get: function(){
            var x = 0;
            for(var i = 0, len = this.boxList.length; i <= len - 1; i++){
                x = x + this.boxList[i].area;
            };
            return x;
        }
    },
});};


BoxUtility.prototype.positionCalculateMasonry = function(preDefinedRows, firstColumnWidth, restColumnWidth, itemIndex){
var firstColumnArea = preDefinedRows * firstColumnWidth,
    restColumnArea = preDefinedRows * restColumnWidth,
    firstColumnAreaRemained = firstColumnArea,
    restColumnAreaRemained = restColumnArea,
    Position = function(top, right){
        this.top = top;
        this.right = right;
        this.restFirstWidth = firstColumnWidth - right;
        this.restSecondWidth = restColumnWidth - right;
    },
    firstPosition = new Position(0, 0),
    positionStack = [],
    boxStack = [],
    indexStack = [];

positionStack.push(firstPosition);

for(var i = itemIndex, len = this.boxList.length; i <= len - 1; i++){
    if(this.boxList[i].area <= firstColumnAreaRemained){
        var temp = positionStack.filter(function(el){
            return (el.restFirstWidth >= this.boxList[i].width);
        });
    } else {

    };
};};

var x = new BoxUtility(clinica ,boxArray);
x.positionCalculateMasonry(5, 3, 2, 0);

我在这里收到此错误：

return (el.restFirstWidth >= this.boxList[i].width);

我相信它关于在过滤方法中传递 this 关键字

有什么帮助吗？谢谢

4

3 回答 3

2 
BoxUtility.prototype.positionCalculateMasonry = function(preDefinedRows, firstColumnWidth, restColumnWidth, itemIndex){
var firstColumnArea = preDefinedRows * firstColumnWidth,
    restColumnArea = preDefinedRows * restColumnWidth,
    firstColumnAreaRemained = firstColumnArea,
    restColumnAreaRemained = restColumnArea,
    Position = function(top, right){
        this.top = top;
        this.right = right;
        this.restFirstWidth = firstColumnWidth - right;
        this.restSecondWidth = restColumnWidth - right;
    },
    firstPosition = new Position(0, 0),
    positionStack = [],
    boxStack = [],
    indexStack = [],
    that = this;

positionStack.push(firstPosition);

for(var i = itemIndex, len = this.boxList.length; i <= len - 1; i++){
    if(this.boxList[i].area <= firstColumnAreaRemained){
        var temp = positionStack.filter(function(el){
            return (el.restFirstWidth >= that.boxList[i].width);
        });
    } else {

    };
};};

海报代码的问题是上下文在回调中不可用。添加的是一个变量'that'来保存上下文。然后使用闭包将上下文传递给回调。

于 2012-12-28T23:52:14.323 回答
1

关键字将根据this它被调用的上下文引用不同的对象。

简单地说，错误表示boxList没有在引用的对象内定义this。

于 2012-12-28T23:51:55.517 回答
1

filter函数内部的this含义与外部不同，因为函数本身就是一个对象方法。

您需要将外部存储在另一个变量中，然后通过闭包this将其传递给函数：filter

// Outside the for loop
var that=this;
...
// Inside filter()
return el.restFirstWidth >= that.boxList[i].width;
于 2012-12-28T23:55:06.477 回答