Soru Sözler JavaScript'te nasıl çalışır?


AngularJS'de başka bir söze dayanan bir söz veren ilk fonksiyonumu uyguladım ve işe yaradı. Ama karar vermeden önce sadece Yap, ben 2 saatini okudum ve sözlerin arkasındaki kavramları anlamaya çalıştım. Sözlerin nasıl işlediğini simüle eden basit bir kod parçası yazabilseydim, daha sonra nasıl çalıştığını bilmeden onu kullanmak yerine kavramsal olarak anlayabiliyordum. Bu kodu yazamadım.

Yani, birisi vanilya JavaScript'te nasıl söz verebilir? Nasıl sözler çalışır?


21
2017-08-24 18:56


Menşei


Sadece beklentilerinizi açıklığa kavuşturmak için ... vaatler, uygulayacağınız bir şeydir, ve vanilyalı JavaScript'de bir dil kurgusu değildir. Şuna bak: benlesh.com/2012/09/javascript-promises-promises.html - Brad
Bu sorunun çok geniş bir şekilde kapatılmış olması için bir sebep yok. Bu çok açık ve özel bir soru. - Brad


Cevaplar:


Bir söz, temelde iki yöntemle bir nesnedir. Bir yöntem ne yapacağını tanımlamak içindir ve bir tanesi ne zaman yapılacağını anlatmak içindir. İki yöntemin herhangi bir sırayla çağrılması mümkün olmalıdır, böylece nesnenin hangisinin çağrıldığını takip etmesi gerekir:

var promise = {
  isDone: false,
  doneHandler: null,
  done: function(f) {
    if (this.isDone) {
        f();
    } else {
        this.doneHandler = f;
    }
  },
  callDone: function() {
    if (this.doneHandler != null) {
        this.doneHandler();
    } else {
        this.isDone = true;
    }
  }
};

İlk önce eylemi tanımlayabilir, ardından tetikleyebilirsin:

promise.done(function(){ alert('done'); });
promise.callDone();

İlk önce eylemi tetikleyebilir, sonra tanımlayabilirsiniz:

promise.callDone();
promise.done(function(){ alert('done'); });

Demo: http://jsfiddle.net/EvN9P/

Eşzamansız bir işlevde bir söz kullandığınızda, işlev boş söz yaratır, ona bir referans tutar ve ayrıca başvuruyu döndürür. Eşzamansız yanıtı işleyen kod, söz konusu eylemi tetikler ve eşzamansız işlevi çağıran kod, eylemi tanımlayacaktır.

Bunlardan herhangi biri herhangi bir sırada gerçekleşebileceğinden, eşzamansız işlevi çağıran kod sözlüğe asılabilir ve eylemi istediği zaman tanımlayabilir.


30
2017-08-24 19:13





Muhtemelen vaatler kullanımının en basit örneği şuna benzer:

var method1 = (addings = '') => {
  return new Promise(resolve => {
    console.log('method1' + addings)
    resolve(addings + '_adding1');
  });
}
var method2 = (addings = '') => {
  return new Promise(resolve => {
    console.log('method2' + addings)
    resolve(addings + '_adding2');
  });
}

method1().then(method2).then(method1).then(method2);
// result:
// method1            
// method2_adding1    
// method1_adding1_adding2
// method2_adding1_adding2_adding1

Bu temellerin temelidir. Sahip olmak, reddetmeyle deneyebilirsiniz:

var method1 = (addings = '*') => {
  return new Promise((resolve, reject) => {
    console.log('method1' + addings)
    resolve(addings + '_adding1');
  });
}
var method2 = (addings = '*') => {
  return new Promise((resolve, reject) => {
    console.log('method2' + addings)
    reject();
  });
}
var errorMethod = () => {
  console.log('errorMethod')
}
method1()
.then(method2, errorMethod)
.then(method1, errorMethod)
.then(method2, errorMethod)
.then(method1, errorMethod)
.then(method2, errorMethod);
// result:
// method1*           
// method2*_adding1
// errorMethod
// method2*
// errorMethod
// method2*

Gördüğümüz gibi, hata durumunda hata fonksiyonu devreye girer (ki her zaman ikinci argüman olur then) ve sonra zincirdeki bir sonraki işlev, herhangi bir argüman olmadan ateşlenir.

Gelişmiş bilgi için sizi davet ediyorum İşte.


0
2017-09-07 23:42





Javascript'teki vaatleri anlamanın sadeliği için. Aşağıdaki örneğe başvurabilirsiniz. Yeni bir php / html dosyasına yapıştırın ve çalıştırın.

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">

function test(n){
    alert('input:'+n);

    var promise = new Promise(function(fulfill, reject) {         
      /*put your condition here */
      if(n) {
        fulfill("Inside If! match found");
      }
      else {
        reject(Error("It broke"));
      }
    });
    promise.then(function(result) {
      alert(result); // "Inside If! match found"
    }, function(err) {
      alert(err); // Error: "It broke"
    });
}

</script>

</head>
<body>
<input type="button" onclick="test(1);" value="Test"/>

</body>
</html>
  1. Tıklamak Ölçek buton,
  2. Yeni bir söz yaratacak
  3. Durum doğru olacaksa cevabı yerine getirir,
  4. Daha sonra promise.then denilen ve dayalı olarak yazdıracak sonuç.
  5. Reddetme durumunda promise.then hata mesajını döndürür.

-1
2017-08-24 06:49