콜백에서 전달 된 변수 수정

Question

콜백 내부에서 전달 된 변수를 수정/업데이트 할 수 있습니까?

예 :이 snipet을 실행하면

function App() { 
 
    this.components = {}; 
 
    this.queue = {}; 
 
} 
 

 
App.prototype.import = function (name, cb) { 
 

 
    if (this.components[name]) { 
 
    return cb(this.components[name]); 
 
    } 
 

 
    if (!this.queue[name]) { 
 
    this.queue[name] = []; 
 
    } 
 

 
    // push to queue 
 
    this.queue[name].push(cb); 
 

 
}; 
 

 
App.prototype.export = function (name, data) { 
 
    
 
    let that = this; 
 

 
    // set components instance 
 
    this.components[name] = data; 
 

 
    // call queue ? 
 
    if (this.queue[name]) { 
 

 
    // call each import request 
 
    this.queue[name].forEach(function (cb) { 
 
     cb(that.components[name]); 
 
    }); 
 

 
    // clean up 
 
    delete this.queue[name]; 
 

 
    } 
 
}; 
 

 
App.prototype.reload = function (name, data) { 
 
    console.log("Reload module %s", name); 
 
    delete this.components[name]; 
 
    this.components[name] = data; 
 
}; 
 

 

 
var app = new App(); 
 

 
app.import("module1", function(data){ 
 
    console.log("Imported module1"); 
 
    setInterval(function(){ 
 
    console.log(data, app.components["module1"]); 
 
    }, 1000); 
 
}); 
 

 
setTimeout(function(){ 
 
    app.export("module1", {data: "Hello World"}) 
 
}, 1000); 
 

 
setTimeout(function(){ 
 
    app.reload("module1", {data: "Changed data"}); 
 
}, 5000);

당신이 볼 수 app.components.module1 업데이트하지만 콜백 범위입니다. 어떻게 해결할 수 있습니까?

app.components.module1이 cb의 변수도 업데이트하고 싶습니다.

Answer 1

참조가 불완전하기 때문에 개체를 삭제할 수 없습니다.

App.prototype.reload = function (name, data) { 
    console.log("Reload module %s", name); 
    Object.keys(this.components[name]).forEach(key =>{ 
    delete this.components[name][key]; 
    }); 
    Object.assign(this.components[name],data); 
}; 

(기본 유형과 그 실 거예요 작업과 최고의 코드 디자인 밤은)

을 또는 당신은 리스너 패턴처럼 STH 구현 : 그러나 당신은 그것을 돌연변이 수 있도록

class Listener { 
constructor(){ 
    this.listeners = new Map(); 
    } 
    on(event,handler){ 
    if(this.listeners.has(event)){ 
     this.listeners.get(event).push(handler); 
    }else{ 
     this.listeners.set(event,[handler]); 
    } 
    } 

    trigger(event, ...params){ 
    (this.listeners.get(event) || []).forEach(handler => handler(...params)); 
    } 
} 

한 수 do :

const loader = new Listener(); 
loader.on("sth",console.log); 

loader.trigger("sth",{a:1});