2012-05-17 19 views
18

मैं दो चर है:जावास्क्रिप्ट में, जब कोई चर का मान बदल जाता है तो ईवेंट को ट्रिगर कैसे करें?

var trafficLightIsGreen = false; 
var someoneIsRunningTheLight = false; 

मैं घटना ट्रिगर करना चाहते हैं जब दो चर मेरी शर्तों से सहमत:

if(trafficLightIsGreen && !someoneIsRunningTheLight){ 
    go(); 
} 

यह मानते हुए कि उन दो बूलियन्स किसी भी क्षण में बदल सकते हैं, कैसे कर सकते जब मैं अपनी शर्तों के अनुसार बदलता हूं तो मैं अपनी go() विधि को ट्रिगर करता हूं?

+1

आपने पहले से क्या प्रयास किया है? –

+0

उन्हें गेटटर और सेटर विधियों के साथ ऑब्जेक्ट्स में लपेटें, फिर ईवेंट को सेटटर में ट्रिगर करें। –

+1

मुझे लगता है कि आप इस पर एक नज़र डालना चाहते हैं http://www.codeproject.com/Articles/13914/Observer- डिज़ाइन- पैटर्न- उपयोग- जावास्क्रिप्ट – MilkyWayJoe

उत्तर

27

कोई घटना है जो जब एक दिया मूल्य है उठाया है नहीं है जावास्क्रिप्ट में बदल गया। आप जो कर सकते हैं वह उन कार्यों का एक सेट प्रदान करता है जो विशिष्ट मानों को लपेटते हैं और मानों को संशोधित करने के लिए बुलाए जाने पर ईवेंट उत्पन्न करते हैं।

function Create(callback) { 
    var isGreen = false; 
    var isRunning = false; 
    return { 
    getIsGreen : function() { return isGreen; }, 
    setIsGreen : function(p) { isGreen = p; callback(isGreen, isRunning); }, 
    getIsRunning : function() { return isRunning; }, 
    setIsRunning : function(p) { isRunning = p; callback(isGreen, isRunning); } 
    }; 
} 

अब आप इस समारोह कह सकते हैं और जाने निष्पादित करने के लिए कॉलबैक लिंक():

var traffic = Create(function(isGreen, isRunning) { 
    if (isGreen && !isRunning) { 
    go(); 
    } 
}); 

traffic.setIsGreen(true); 
+0

+1 मैंने केवल टाइपिंग शुरू कर दी है :) महान जवाब! –

0

setInterval/Timeout के साथ मतदान किए बिना ऐसा करने का कोई तरीका नहीं है।

आप Firefox केवल समर्थन कर सकते हैं, तो आप उपयोग कर सकते हैं https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/watch

कौन आपको बता देंगे एक वस्तु परिवर्तन का एक संपत्ति है।

आपका सबसे अच्छा समाधान शायद उन्हें एक वस्तु का हिस्सा बना रही है और ही टिककर खेल जोड़ने, setters कि आप बाहर सूचनाएं अपने आप को भेज सकते हैं, के रूप में JaredPar उसके जवाब में पता चला है

0
function should_i_go_now() { 
    if(trafficLightIsGreen && !someoneIsRunningTheLight) { 
     go(); 
    } else { 
     setTimeout(function(){ 
      should_i_go_now(); 
     },30); 
    } 
} 
setTimeout(function(){ 
    should_i_go_now(); 
},30); 
1

सबसे विश्वसनीय तरीका है कि जैसे setters उपयोग करने के लिए है:

var trafficLightIsGreen = false; 
var someoneIsRunningTheLight = false; 

var setTrafficLightIsGreen = function(val){ 
    trafficLightIsGreen = val; 
    if (trafficLightIsGreen and !someoneIsRunningTheLight){ 
     go(); 
    }; 
}; 
var setSomeoneIsRunningTheLight = function(val){ 
    trafficLightIsGreen = val; 
    if (trafficLightIsGreen and !someoneIsRunningTheLight){ 
     go(); 
    }; 
}; 

और उसके बाद एक चर को मान निर्दिष्ट करने के बजाय, आप बसटर को आमंत्रित करते हैं:

setTrafficLightIsGreen(true); 
0

आप हमेशा एक ऑब्जेक्ट का हिस्सा बन सकते हैं और फिर इसकी सामग्री को संशोधित करने के लिए एक विशेष फ़ंक्शन का उपयोग कर सकते हैं। या window के माध्यम से उन्हें एक्सेस करें।

निम्नलिखित कोड जब मूल्यों जब तक आप प्रारूप changeIndex(myVars, 'variable', 5); का उपयोग variable = 5; की तुलना में बदल दिया गया है कस्टम घटनाओं आग इस्तेमाल किया जा सकता

उदाहरण:

function changeIndex(obj, prop, value, orgProp) { 
    if(typeof prop == 'string') { // Check to see if the prop is a string (first run) 
     return changeIndex(obj, prop.split('.'), value, prop); 
    } else if (prop.length === 1 && value !== undefined && 
       typeof obj[prop[0]] === typeof value) { 
     // Check to see if the value of the passed argument matches the type of the current value 
     // Send custom event that the value has changed 
     var event = new CustomEvent('valueChanged', {'detail': { 
                  prop : orgProp, 
                  oldValue : obj[prop[0]], 
                  newValue : value 
                 } 
                }); 
     window.dispatchEvent(event); // Send the custom event to the window 
     return obj[prop[0]] = value; // Set the value 
    } else if(value === undefined || typeof obj[prop[0]] !== typeof value) { 
     return; 
    } else { 
     // Recurse through the prop to get the correct property to change 
     return changeIndex(obj[prop[0]], prop.slice(1), value); 
    } 
}; 
window.addEventListener('valueChanged', function(e) { 
    console.log("The value has changed for: " + e.detail.prop); 
}); 
var myVars = {}; 
myVars.trafficLightIsGreen = false; 
myVars.someoneIsRunningTheLight = false; 
myVars.driverName = "John"; 

changeIndex(myVars, 'driverName', "Paul"); // The value has changed for: driverName 
changeIndex(myVars, 'trafficLightIsGreen', true); // The value has changed for: traggicIsGreen 
changeIndex(myVars, 'trafficLightIsGreen', 'false'); // Error. Doesn't set any value 

var carname = "Pontiac"; 
var carNumber = 4; 
changeIndex(window, 'carname', "Honda"); // The value has changed for: carname 
changeIndex(window, 'carNumber', 4); // The value has changed for: carNumber 

आप हमेशा खींचने के लिए चाहते हैं तो window ऑब्जेक्ट से आप ओबीजे को हमेशा विंडो के लिए सेट करने के लिए changeIndex संशोधित कर सकते हैं।

0

यदि आप जांचों के बीच एक 1 मिलीसेकंड देरी के बारे में है के लिए तैयार थे, तो आप लगा सके

window.setInterval() 
उस पर

, उदाहरण के लिए यह आपके ब्राउज़र को नष्ट नहीं होगा:

window.setInterval(function() { 
    if (trafficLightIsGreen && !someoneIsRunningTheLight) { 
     go(); 
    } 
}, 1); 
+1

क्या यह गेटर्स और सेटर्स के बजाय 'setInterval' का उपयोग करके अच्छा कोडिंग अभ्यास होगा? – lowtechsun

1
//ex: 
/* 
var x1 = {currentStatus:undefined}; 
your need is x1.currentStatus value is change trigger event ? 
below the code is use try it. 
*/ 
function statusChange(){ 
    console.log("x1.currentStatus_value_is_changed"+x1.eventCurrentStatus); 
}; 

var x1 = { 
    eventCurrentStatus:undefined, 
    get currentStatus(){ 
     return this.eventCurrentStatus; 
    }, 
    set currentStatus(val){ 
     this.eventCurrentStatus=val; 
    } 
}; 
console.log("eventCurrentStatus = "+ x1.eventCurrentStatus); 
x1.currentStatus="create" 
console.log("eventCurrentStatus = "+ x1.eventCurrentStatus); 
x1.currentStatus="edit" 
console.log("eventCurrentStatus = "+ x1.eventCurrentStatus); 
console.log("currentStatus = "+ x1.currentStatus); 
संबंधित मुद्दे

 संबंधित मुद्दे