使用享元模式 实现文件上传

        // 内部状态----------
        const Upload = function(uploadType) {
            this.uploadType = uploadType
        }
        Upload.prototype.delFile = function(id) {
            // 通过外部管理器的方法给共享对象设置正确的外部状态  把id对应的外部状态组装到共享对象中
            uploadManager.setExternalState(id, this) 
            if (this.fileSize < 3000) {
                return this.dom.parentNode.removeChild(this.dom)
            }
            if (window.confirm('确定要删除文件吗？' + this.fileName)) {
                return this.dom.parentNode.removeChild(this.dom)
            }
        }
        // 工厂进行对象实例化------
        const UploadFactory = (function() {
            const createdFlyWeightObjs = {}
            return {
                create: function(uploadType) {
                    if(createdFlyWeightObjs[uploadType]) {
                        return createdFlyWeightObjs[uploadType]
                    }
                    return createdFlyWeightObjs[uploadType] = new Upload(uploadType)
                }
            }
        })()
        // 管理封装外部状态：向factory提交创建对象的请求，保存并传递upload对象的外部状态
        const uploadManager = (function(){
            const uploadDatabase = {}
            return {
                add: function(id, uploadType, fileName, fileSize) {
                    const flyWeightObj = UploadFactory.create(uploadType)

                    const dom = document.createElement( 'div' );
                    dom.innerHTML = 
                        `<span>文件名称：${fileName}, 文件大小：${fileSize}</span>
                        <button class="del">删除</button>`
                    dom.querySelector('.del').onclick = function() {
                        flyWeightObj.delFile( id )
                    } 
                    document.body.appendChild( dom );  

                    uploadDatabase[id] = {
                        fileName: fileName,
                        fileSize: fileSize,
                        dom: dom
                    }
                    return flyWeightObj
                },
                setExternalState: function(id, flyWeightObj) {
                    const uploadData = uploadDatabase[id] 
                    for (const key in uploadData) {
                        flyWeightObj[key] = uploadData[key]
                    }
                }
            }
        })()
        // 触发上传的功能
        let id = 0;
        const startUpload = function( uploadType, files ){
            for ( var i = 0, file; file = files[ i++ ]; ){
                uploadManager.add( ++id, uploadType, file.fileName, file.fileSize );
            }
        }
        startUpload('plugin', [
            {
                fileName: '1.txt',
                fileSize: 1000
            },
            {
                fileName: '2.txt',
                fileSize: 2000
            },
            {
                fileName: '3.txt',
                fileSize: 5000
            }
        ])
        startUpload('flash', [
            {
                fileName: '4.txt',
                fileSize: 1000
            },
            {
                fileName: '5.txt',
                fileSize: 3000
            },
            {
                fileName: '6.txt',
                fileSize: 5000
            }
        ])