TextField appears on stage when it's not a child of DisplayContainer?

Question

Really need some help understanding whats going on after

textFields[i].text = thisWord.charAt(i);

I understand it updates a value at that particular index, I just can't figure out why it affects:

textContainer.addChild(tempText);
textFields.push(tempText);

The value that gets changed appears on the stage but I don't understand why because it's never added as a child of textContainer.

var loader:URLLoader;
var allWords:Array;
var thisWord:String;

var textContainer:MovieClip;

var textFields:Array;
var textStyle:TextFormat;
var underline:MovieClip;

function init():void
{
    loader = new URLLoader();
    allWords = new Array();

    textContainer = new MovieClip();
    textFields = new Array();

    textStyle = new TextFormat();
    textStyle.font = "Courier New";
    textStyle.size = 48;
    textStyle.bold = true;

    textContainer.y = stage.stageHeight / 2 - 50;
    addChild(textContainer);

    loader.load(new URLRequest("words.txt"));
    loader.addEventListener(Event.COMPLETE, textLoaded);
    guess_btn.addEventListener(MouseEvent.CLICK, guess);

}

function textLoaded(event:Event):void
{
    var tempText:TextField;

    var stringOfWords:String = event.target.data;
    allWords = stringOfWords.split(",");
    thisWord = allWords[Math.floor(Math.random() * allWords.length)];
    trace(thisWord);

    for (var i:uint = 0; i < thisWord.length; i++)
    {
        tempText = new TextField();
        tempText.defaultTextFormat = textStyle;
        tempText.name = "textField" + i;
        tempText.text = "1";//for restart

        tempText.width = 48;
        tempText.x = i * tempText.width;
        tempText.selectable = false;
        textContainer.addChild(tempText);

        textFields.push(tempText);

        if (thisWord.charAt(i) != " ")
        {
            underline = new Underline();
            underline.x = tempText.x + tempText.width / 3;
            underline.y = tempText.y + tempText.height / 2 + 5;
            //textContainer.addChild(underline);
        }
    }

    textContainer.x = stage.stageWidth / 2 - textContainer.width / 2;



}

function guess(event:MouseEvent):void
{
    if (guess_txt.text != "")
    {
        if (thisWord.indexOf(guess_txt.text) != -1)
        {
            for (var i:uint = 0; i < textFields.length; i++)
            {
                if (thisWord.charAt(i) == guess_txt.text)
                {
                    textFields[i].text = thisWord.charAt(i);
                    trace(textFields[i].text);
                }
            }

        }
        else if (guesses_txt.text == "")
        {
            guesses_txt.appendText(guess_txt.text);
        }
        else
        {
            guesses_txt.appendText("," + guess_txt.text);
        }
    }

    guess_txt.text = "";
    findch();
}

init();

I'm pretty sure theres a rule I'm missing or not understanding....

Thanks.

Answer 1

You pointed out right in your question that it actually is being added. Each tempText object you create in that loop is added to textContainer which had been added to stage in the constructor.

textContainer.addChild(tempText);

textFields[i].text = thisWord.charAt(i); is just updating the text of the TextField at the specific index within the array. There is no reason the text on the stage should not be updating here.