AngularJS에서 Promise --- $q 서비스 자세히 설명

먼저 Promise와 $q이 무엇인지 설명해 보겠습니다. Promise는 비동기 처리 모델로, 많은 구현 방식이 있습니다. 예를 들어, 유명한 Kris Kwal's Q와 JQuery의 Deffered와 같습니다.

Promise는 무엇인가요?

Ajax를 알고 있는 사람들은 콜백의 고통을 잘 알 수 있습니다. 동기 코드는 디버깅하기 쉽지만, 비동기 콜백 코드는 개발자를 방황하게 만들고 추적할 수 없게 합니다. 예를 들어:

funA(arg1,arg2,function(){
  funcB(arg1,arg2,function(){
    funcC(arg1,arg2,function(){
       xxxx....
    })
  })  
})

본질적으로 내장된 네이밍이 이해하기 어려운 것에 더해, 언제 콜백이 발생할지 알 수 없으므로, 이는 눈물에 눈물을 씁니다.

اما با این استاندارد Promise، می‌تواند به توسعه‌دهندگان کمک کند تا به روش همزمان، کد‌های غیر همزمان را بنویسند، مانند استفاده از این روش در AngularJS:}

deferABC.resolve(xxx)
.then(funcSuccess(){},funcError(){},funcNotify(){});

وقتی شیء در داخل resolve موفق به اجرا شود، funcSuccess فعال می‌شود، اگر شکست بخورد، funcError فعال می‌شود. شبیه

deferABC.resolve(function(){
  Sunccess:funcSuccess,
  error:funcError,
  notify:funcNotify
})

بیشتر به سادگی بگوییم، Promise یک تعریف پیش‌نوشته برای نتایج غیر معین است، اگر موفق شود، xxxx خواهد شد؛ اگر شکست بخورد، xxxx خواهد شد، مانند وعده‌های قبلی که داده شده‌اند.

مثلاً، شیبای در دوران تحصیل بسیار تنبل بود و همیشه از همکلاسی‌اش برای غذای همراه درخواست می‌کرد و قبلاً با او توافق کرده بود که اگر قدرتمند تخم مرغ باشد، این غذای را بخرید، اگر نه، تخم مرغ و گوجه فرنگی را بخرید؛ و در هر صورت باید یک بسته سیگار را با خود ببرید.

شیبای از همکلاسی برای غذای همراه می‌خواهد()
.then(قدرتمند تخم مرغ، تخم مرغ و گوجه فرنگی)
.finally(با سیگار)

سرویس $q

سرویس q یک پیامدهای خودکار (Promise) تحویل می‌دهد که در AngularJS خودکار پیاده‌سازی شده است و نسبت به Q Kris Kwal بسیار سبک‌تر است.
ابتدا چندین روش معمولی $q را معرفی می‌کنیم:

defer() یک شیء deferred ایجاد می‌کند، این شیء می‌تواند چندین روش معمولی را اجرا کند، مانند resolve، reject، notify و غیره
all() یک آرایه از Promise‌ها را وارد می‌کند، اجرای گروهی انجام می‌دهد و یک شیء promise بازمی‌گرداند
اگر پارامتر غیر معین به when() وارد شود و استاندارد Promise را رعایت کند، یک شیء promise بازمی‌گرداند.

در Promise، سه حالت تعریف شده است: حالت انتظار، حالت تکمیل، حالت رد.

در مورد حالت چندین قوانین وجود دارد:

1 تغییرات حالت غیر قابل بازگشت هستند
2 حالت انتظار می‌تواند به حالت تکمیل یا رد تبدیل شود

روش defer()

در $q می‌توان از روش resolve برای تبدیل به حالت تکمیل استفاده کرد؛ از روش reject برای تبدیل به حالت رد استفاده می‌شود.

아래는 $q의 간단한 사용법을 보겠습니다：

<html ng-app="myApp">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
</head>
<body>
  <div ng-controller="myctrl">
    {{test}}
  </div>
  <script type="text/javascript">
     var myAppModule = angular.module("myApp",[]);
     myAppModule.controller("myctrl",["$scope","$q",function($scope, $ q ){
      $scope.test = 1;//이는 angularjs가 정상적으로 작동하는지 테스트하기 위한 것이며, 다른 어떤 역할도 하지 않습니다.
      var defer1 = $q.defer();
      var promise1 = defer1.promise;
      promise1
      .then(function(value){
        console.log("in promise1 ---- success");
        console.log(value);
      },function(value){
        console.log("in promise1 ---- error");
        console.log(value);
      },function(value){
        console.log("in promise1 ---- notify");
        console.log(value);
      })
      .catch(function(e){
        console.log("in promise1 ---- catch");
        console.log(e);
      })
      .finally(function(value){
        console.log('in promise1 ---- finally');
        console.log(value);
      });
      defer1.resolve("hello");
      // defer1.reject("sorry,reject");
     });
  </script>
</body>
</html>

defer()는 deferred 객체를 생성하는 데 사용되며, defer.promise는 promise 객체를 반환하여 then 메서드를 정의합니다. then에는 성공 콜백, 실패 콜백, 상태 변경 콜백이 세 가지 있습니다.

resolve에 전달된 변수나 함수의 반환 결과는 첫 번째 then 메서드의 인자로 사용됩니다. then 메서드는 promise 객체를 반환하므로 다음과 같이 작성할 수 있습니다.

xxxx
.then(a,b,c)
.then(a,b,c)
.then(a,b,c)
.catch()
.finally()

그렇다면 위의 코드에 대해 계속 설명해 보겠습니다. then...catch...finally는 java의 try...catch...finally와 같이 생각할 수 있습니다.

all() 메서드

이 all() 메서드는 여러 promise의 배열을 하나의 배열로 합치게 합니다. 모든 promise가 성공적으로 실행되면, 그 뒤의 콜백이 실행됩니다. 콜백의 매개변수는 각 promise가 실행된 결과입니다.

일정한 메서드를 대량으로 실행할 때, 이 메서드를 사용할 수 있습니다.

   var funcA = function(){
        console.log("funcA");
        return "hello,funA";
      }
      var funcB = function(){
        console.log("funcB");
        return "hello,funB";
      }
      $q.all([funcA(),funcB()])
      .then(function(result){
        console.log(result);
      });

실행 결과:

funcA
funcB
Array [ "hello,funA", "hello,funB" ]

when() 메서드

when 메서드에는 매개변수를 전달할 수 있으며, 이 매개변수는 값일 수도 있고, promise 표준을 준수하는 외부 객체일 수도 있습니다.　　　　　

   var funcA = function(){
        console.log("funcA");
        return "hello,funA";
      }
      $q.when(funcA())
      .then(function(result){
        console.log(result);
      });

전달된 매개변수가 불확실할 때, 이 메서드를 사용할 수 있습니다.

hello,funA

위에서 설명한 AngularJS의 Promise --- $q 서비스의 자세한 설명을 제공하겠습니다. 이어서 관련 자료를 추가할 예정입니다. 많은 관심과 지지에 감사합니다!

선언: 이 문서의 내용은 인터넷에서 가져왔으며, 저작권자는 모두입니다. 내용은 인터넷 사용자가 자발적으로 기여하고 업로드한 것이며, 이 사이트는 소유권을 가지지 않으며, 인공 편집 처리를 하지 않았으며, 관련 법적 책임도 부담하지 않습니다. 저작권 위반이 의심되는 내용이 있으시면, notice#w로 이메일을 보내 주시기 바랍니다.3codebox.com（메일을 보내는 경우, #을 @으로 변경하십시오. 신고하시고 관련 증거를 제공하시면, 해당 내용이 실제로 위반된 경우, 이 사이트는 즉시 해당 위반 내용을 삭제합니다.）

기본 가이드

좋아하는 것