оператор возврата не выходит из цикла

0

Я хочу навести ярлыки createJS и показать перевод на английский язык только для китайского лейбла (Ex: "Wan" будет показывать "Bowl"), который я навешиваю.

1) Таким образом, я добавляю все свои метки для создания в массив

2) Затем hitTest() все метки в hitTest() и добавьте обработчик mouseover/mouseout к ним

3), тогда handleMouseEvent() будет включать или выключать английскую метку в зависимости от зависания

4), то toggleItemLabel() перебирает все контейнеры createJS, содержащие этот ярлык... если зависающее китайское слово соответствует метке, принадлежащей контейнеру, тогда оно установит этот второй ввод метки на английском языке и покажет его.

Это отлично работает, за исключением того, что toggleItemLabel() похоже, продолжает цикл через все метки в allMyLabels[] даже после того, как он нашел совпадение и вернулся.

Как вы можете видеть на выходе, он показывает 4 выхода... что означает, что он не возвращается/выходит из цикла, когда находит совпадение.

Почему это?

Вывод:

Lee Xian Sheng, Lee Xian Sheng 
Lee Xian Sheng, Lee Xian Sheng 
Lee Xian Sheng, Lee Xian Sheng 
Lee Xian Sheng, Lee Xian Sheng 

Изображение 174551

function hitTest() {
    for (var i = 0 ; i < allMyLabels.length; ++i) {
        allMyLabels[i].on("mouseover", handleMouseEvent);
        allMyLabels[i].on("mouseout", handleMouseEvent);
    }
}

function handleMouseEvent(evt) {
    for (var i = 0 ; i < allMyLabels.length; ++i) {
        if (evt.type === "mouseover") { 
            toggleItemLabel(allMyLabels[i].text, false);        
        }
        else {
            toggleItemLabel(allMyLabels[i].text, true);
        }
    }
}

function toggleItemLabel(word, hide) {

    for (var i = 0; i < All_Items_Array.length; i++) {
        for (var j = 0; j < All_Items_Array[i].children.length; j++) {
            log(word + ", " + All_Items_Array[i].children[j].children[1].text);
            if (word === All_Items_Array[i].children[j].children[1].text) {
                if (hide) {
                    return All_Items_Array[i].children[j].children[2].text = "";
                }
                else {
                    return All_Items_Array[i].children[j].children[2].text = All_Items_Array[i].children[j].name;
                }
            }
        }
    }
    stage.update();
}

EDIT: дать некоторое представление о том, что находится в All_Items_Array:

Когда создается новый элемент:

function createNewItem(itemObj) {
    if (itemObj.name != "undefined") {
        if (!checkIfExists(itemObj.name) || itemObj.quest_name == null) {       
            container = new createjs.Container();
            bitmap = new createjs.Bitmap(itemObj.path);
            container.x = itemObj.x;
            container.y = itemObj.y;
            container.name = itemObj.name;

            container.taskNum = 0;

            cn_label = new createjs.Text(itemObj.cn_name, "14px Arial", "white");   
            cn_label.y = -45;

            en_label = new createjs.Text("", "14px Arial", "black");    
            en_label.y = -25;           

            //loop through all labels, check hittest for each
            allMyLabels.push(cn_label);

            container.addChild(bitmap, cn_label, en_label);

            container.cn = itemObj.cn_name;

            if (itemObj.itemType === "newItem") {
                container.count = 0;
                ContainerOfItems.addChild(container);
            }
            else {
                container.questName = itemObj.quest_name;
                ContainerOfPeople.addChild(container)
            }       
        }
        else {
            log(itemObj.quest_name + " already added...");
        }
    }
    hitTest(); //add mouse listeners to newly added labels
    stage.update();
}

И All_Items_Array.push(ContainerOfPeople, ContainerOfItems);


EDIT 2: попробовал инструкции break в цикле вместо возвратов:

Теперь, когда я навешиваю ярлык, он возвращает английские метки для всех китайских ярлыков:

Изображение 174551

Первая console.log() выводит все элементы в массиве, независимо от того, имеет ли word===label text или word===label text. Это не верно. Наведение курсора на wan должно только возвращаться, когда wan === wan:

wǎn , Lee Xian Sheng 
wǎn , fàn 
wǎn , shūcài 
wǎn , wǎn  
text: bowl, result: bowl 

Обновлен toggleItemLabel():

function toggleItemLabel(word, hide) {
    var result = "", label = "";
    for (var i = 0; i < All_Items_Array.length; i++) {
        for (var j = 0; j < All_Items_Array[i].children.length; j++) {
            log(word + ", " + All_Items_Array[i].children[j].children[1].text);
            if (word === All_Items_Array[i].children[j].children[1].text) {
                label = All_Items_Array[i].children[j].children[2];
                if (hide) {
                    result = "";
                    break;
                }
                else {
                    result = All_Items_Array[i].children[j].name;
                    break;
                }
            }
        }
    }
    label.text = result;
    log("text: " + label.text + ", result: " +  result);
    return label;
}
  • 3
    Возвращение во время такого цикла - плохая практика. Вы должны сохранить эти результаты в переменной и просто разорвать ваши циклы, а затем вернуть переменную в конце функции.
  • 0
    Согласитесь с @scrowler, это также повышает удобочитаемость и уменьшает усилия по отладке.
Показать ещё 1 комментарий
Теги:
for-loop

1 ответ

0

Я бы переписал это, чтобы больше походить

function hitTest() {
    $(allMyLabels).on('mouseenter mouseleave', function(e) {
        var word = $(this).text, 
            hide = e.type == 'mouseenter';

        $.each(All_Items_Array, function(_, arr) {
            $.each(arr.children, function(_, child) {
                var w = child.children[1].text;
                log(word + ", " + w);
                if (word == w) {
                    child.children[1].text = hide ? child.name : '';
                }
            });
        });
    });
}
  • 0
    Спасибо adeneo, гораздо более элегантное решение. Это не работает, однако. в log(word + ", " + w) слово дает function (a){return f.access(this,function(a){return a===b?f.text(this):this.empty().append((this[0]&&this[0].ownerDocument||c).createTextNode(a))},null,a,arguments.length)}
  • 0
    @Growler - я понятия не имею, что это за children и свойства text ? Кажется, у вас есть массив с некоторыми объектами и т. Д., И только вы знаете, что находится в этом массиве? Конечно, есть также методы jQuery, которые называются children() и text() , но я предположил, что вы не пытаетесь использовать их, так как это потребует реальных объектов jQuery и вызова функций, но полученный вами записанный результат действительно кажется как будто вы действительно пытаетесь использовать text() jQuery text() , но кто знает!
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню