// Рекурсия: HTML tree
{
    function htmlTree(parent){
        let strHtml
        if (parent.tagName) {
            strHtml = `<${parent.tagName}`
            
            if (parent.attrs) {
                for (const attr in parent.attrs) {
                    strHtml += ` ${attr} = ${parent.attrs[attr]}`
                }
            }
            strHtml += '>'

            for (const child of parent.children) {
                strHtml += htmlTree(child)
            }
            strHtml += `</${parent.tagName}>`
        }

        else {
            strHtml = parent
        }

        return strHtml
    }


    let container = document.createElement('container')
    container.innerHTML= htmlTree(table)
    document.body.append(container)
}

//Рекурсия: DOM tree
{
    function domTree(parentHtmlTree,jsTree){
        
        if (jsTree.tagName) {
            let tag = document.createElement(jsTree.tagName)
            
            if (jsTree.attrs) {
                for (const attr in jsTree.attrs) {
                    tag[attr] = jsTree.attrs[attr]
                }
            }
            parentHtmlTree.append(tag)
           

            for (const child of jsTree.children) {
                domTree(tag,child)
            }
            
        }

        else {
            parentHtmlTree.append(jsTree)
        }
        

        
    }


    const table = {
        tagName: 'table',
        attrs: {
            border: "1",
        },
        children: [
            {
                tagName: 'tr',
                children: [
                    {
                        tagName: "td",
                        children: ["1x1"],
                    },
                    {
                        tagName: "td",
                        children: ["1x2"],
                    },
                ]
            },
            {
                tagName: 'tr',
                children: [
                    {
                        tagName: "td",
                        children: ["2x1"],
                    },
                    {
                        tagName: "td",
                        children: ["2x2"],
                    },
                ]
            }
        ]
    }
    domTree(document.body, table)
}


//Рекурсия : Глубокое копирование
{
    function deepCopy(parent){
        let data 
        
        if(Array.isArray(parent)){
            data=[]
        }
        else if(typeof parent === "object" && !Array.isArray(parent) && parent != null){
            data={}
        }
        else{
            return data=parent
        }
        
        for(let el in parent){
            data[el] = deepCopy(parent[el])
        }

        return data
    }
    
    const table = {
        tagName: 'table',
        attrs: {
            border: "1",
        },
        children: [
            {
                tagName: 'tr',
                children: [
                    {
                        tagName: "td",
                        children: ["1x1"],
                    },
                    {
                        tagName: "td",
                        children: ["1x2"],
                    },
                ]
            },
            {
                tagName: 'tr',
                children: [
                    {
                        tagName: "td",
                        children: ["2x1"],
                    },
                    {
                        tagName: "td",
                        children: ["2x2"],
                    },
                ]
            }
        ]
    }
    const arr  = [1,"string", null, undefined, {a: 15, b: 10, c: [1,2,3,4],d: undefined, e: true }, true, false]
    const arr2 = deepCopy(arr) //arr2 и все его вложенные массивы и объекты - другие объекты, которые можно менять без риска поменять что-то в arr
    const table2 = deepCopy(table) //аналогично
}


//Рекурсия : My Stringify
{
    function stringify(parent){
        let text=''
        function stringifyNested(parent){
            let data 
            let type
            if(Array.isArray(parent)){
                data=[]
                text+='['
            }
            else if(typeof parent === "object" && !Array.isArray(parent) && parent != null){
                data={}
                text+='{'
                type="object"
            }
            else{
            
                return data=parent
            }
            let i = 0
            for(let el in parent){
                if(type==="object"){
                    text+= '"'+el+'":'
                }
                data[el] = stringifyNested(parent[el])
                i++
                
                if(typeof data[el] === 'number'|| data[el]===null || typeof data[el] === 'boolean'){
                    text+=data[el]+','
                }
                else if(typeof data[el] === 'string'){
                    text+='"'+data[el]+'",'
                }
                else if(typeof data[el] === 'undefined'){
                    text+= null+','
                }
                
                if(parent.length===i || Object.keys(parent).length===i){
                    text=text.slice(0,-1)
                    type==="object"? text+= '},':text+= '],'
                }

                
            }
            
            return data
        }
        stringifyNested(parent)
        return text.slice(0,-1)
    }
    

    const arr  = [1,"string", null, undefined, {a: 15, b: 10, c: [1,2,3,4],d: undefined, e: true }, true, false]
    const jsonString = stringify(arr) //напишите функцию stringify без использования JSON.stringify
    console.log(JSON.parse(jsonString)) //не должно поломаться и должно вернуть структуру, во всем схожую с оригинальным arr или table
}