यह पाश क्यों एक ढेर अतिप्रवाह का कारण बनता है?

Question

मैंने jquery के साथ गड़बड़ करने का फैसला किया और एक सरल अक्षोनिक मानचित्र आधारित गेम बना दिया। यह कुछ मानचित्र प्रस्तुत करता है, फिर स्टैक के साथ एक मुद्दा है। (अधिकतम कॉल स्टैक आकार पार हो गया) मैं अभी टाइल के लिए पृष्ठभूमि रंगों का उपयोग कर रहा हूं।

JS Bin Here

var map = [ 
    "g","g","g","s","s", 
    "g","g","s","s","w", 
    "g","g","s","w","w", 
    "g","g","s","w","w", 
    "g","g","s","w","w" 
]; 
var x = 0; 
var y = 0; 
var count = 0; 
var background; 
function init() { $.each(map, function(key, value) { 

    x += 30; 
    y += 60; 
    if (count > 4){ 
    x -= 120; 
    y -= 360; 
    count = 0; 
    } 
    if (value == "g"){background = "#00ff00";} 
    if (value == "w"){background = "#0000ff";} 
    if (value == "s"){background = "#ffff00";} 

    $('.map_piece').clone().appendTo('body').css({'top' : x + 'px', 'left' : y + 'px','display' : 'block','background' : background}); 
     count ++; 
}); 
       } 

$('document').ready(function(){ 
init(); 

}); 

Answer 1

प्रत्येक पुनरावृत्ति के में, आप 2^के आइटम क्लोन करते हैं।

इसके बजाय एक तत्व क्लोनिंग की, यह सिर्फ आसान एक नए तत्व हर बार बनाने के लिए हो सकता है:

$('<div class="map_piece">') 
    .appendTo('body') 
    .css({'top' : x + 'px', 'left' : y + 'px','display' : 'block','background' : background}); 

Answer 2

$('.map_piece').clone() क्लोन सभी टुकड़ों कि अभी तक नहीं बनाई गई है कॉलिंग। यह लूप चलाने पर हर बार क्लोन तत्वों की संख्या में घातीय वृद्धि का कारण बनता है। ऐसा करने के लिए जो आप करना चाहते हैं, first() का उपयोग कर क्लोन को केवल एक तत्व तक सीमित करें।

$('.map_piece').first().clone().appendTo('body').css({'top' : x + 'px', 'left' : y + 'px','display' : 'block','background' : background});