source

각진서비스 vs angular.factory

nicesource 2023. 2. 6. 23:44
반응형

각진서비스 vs angular.factory

angular.factory() angular를 모두 보았습니다.service()는 서비스 선언에 사용되지만 찾을없습니다. angular.service이치노

법법법 차이 ??? ??? ???
어떤 용도로 사용해야 합니까(다른 작업을 수행하는 경우)?

  angular.service('myService', myServiceFunction);
  angular.factory('myFactory', myFactoryFunction);

저는 이 개념을 이해하는데 어려움을 겪었습니다.이렇게 생각하기 전까지는요.

서비스: 작성하는 기능은 새로운 에디션입니다.

  myInjectedService  <----  new myServiceFunction()

Factory: 작성한 함수(컨스트럭터)가 호출됩니다.

  myInjectedFactory  <---  myFactoryFunction()

그걸로 뭘 하냐에 따라 다르지만 유용한 패턴도 있고...

공개 API를 공개하기 위한 서비스 함수 작성 등:

function myServiceFunction() {
  this.awesomeApi = function(optional) {
    // calculate some stuff
    return awesomeListOfValues;
  }
}
---------------------------------------------------------------------------------
// Injected in your controller
$scope.awesome = myInjectedService.awesomeApi();

또는 공장 기능을 사용하여 공개 API를 공개하는 경우:

function myFactoryFunction() {
  var aPrivateVariable = "yay";

  function hello() {
    return "hello mars " + aPrivateVariable;
  }
  
  // expose a public API
  return {
    hello: hello
  };
}
---------------------------------------------------------------------------------
// Injected in your controller
$scope.hello = myInjectedFactory.hello();

또는 공장 함수를 사용하여 생성자를 반환하는 경우:

function myFactoryFunction() {
    return function() {
        var a = 2;
        this.a2 = function() {
            return a*2;
        };
    };
}
---------------------------------------------------------------------------------
// Injected in your controller
var myShinyNewObject = new myInjectedFactory();
$scope.four = myShinyNewObject.a2();

어떤 것을 사용할까요?

둘 다 같은 일을 할 수 있어요.다만, 공장에서는, 보다 심플한 구문을 사용해 주입 가능한 것을 작성할 수 있는 유연성을 조금 더 갖추고 있는 경우가 있습니다.이는 myInjectedService가 항상 개체여야 하지만 myInjectedFactory는 개체, 함수 참조 또는 모든 값이 될 수 있기 때문입니다.예를 들어 위의 마지막 예시와 같이 컨스트럭터를 작성하기 위해 서비스를 작성한 경우 다음과 같이 인스턴스화해야 합니다.

var myShinyNewObject = new myInjectedService.myFunction()

이는 다음과 같이 바람직하지 않습니다.

var myShinyNewObject = new myInjectedFactory();

(단, 컨트롤러에 새로운 오브젝트가 추가되면 테스트용으로 모의하기 어려운 추적하기 어려운 의존관계가 생기기 때문에 처음부터 이런 유형의 패턴을 사용하는 것에 주의해야 합니다.서비스를 통해 객체 컬렉션을 관리하는 것이 사용보다 낫다.new()★★★★★★★★★★★★★★★★★★」


한 가지 더, 그들은 모두 싱글톤이다...

또한 두 경우 모두 각도가 싱글톤 관리에 도움이 된다는 것을 기억하십시오.서비스 또는 함수를 어디에, 또는 몇 번 삽입하든 동일한 개체 또는 함수에 대한 동일한 참조를 얻을 수 있습니다.(공장에서 단순히 숫자나 문자열과 같은 값을 반환하는 경우는 예외입니다.이 경우 항상 같은 값을 얻을 수 있지만 참조는 얻을 수 없습니다.)

간단히 말하면...

const user = {
  firstName: 'john'
};

// Factory
const addLastNameFactory = (user, lastName) => ({
  ...user,
  lastName,
});

console.log(addLastNameFactory(user, 'doe'));

// Service
const addLastNameService = (user, lastName) => {
  user.lastName = lastName; // BAD! Mutation
  return user;
};

console.log(addLastNameService(user, 'doe'));

주요 차이점은 다음과 같습니다.

서비스

문::module.service( 'serviceName', function );

결과: serviceName을 주입 가능한 인수로 선언하면 함수 인스턴스가 에 전달됩니다.module.service.

사용방법: 단순히 추가만 하면 호출에 유용한 유틸리티 기능을 공유할 수 있습니다.( )참조할 수 있습니다., 음음음음음 could could could could could could could could could could could could could could could could could could could could와 함께 사용할 수도 있습니다.injectedArg.call( this )또는 이와 유사합니다.

공장

문::module.factory( 'factoryName', function );

결과: factoryName을 주입 가능한 인수로 선언하면 전달된 함수 참조를 호출하여 반환되는 값이 제공됩니다.module.factory.

용도: 인스턴스를 만들기 위해 새로 만들 수 있는 '클래스' 함수를 반환할 때 유용합니다.

다음은 서비스와 팩토리를 사용하는 예입니다.Angular에 대해 자세히 알아보기JS 서비스 vs 팩토리

또한 Angular를 확인할 수 있습니다.스택 오버플로우에 관한 JS 문서 및 유사한 질문이 서비스와 팩토리에 대해 혼동되었습니다.

TL;DR

1) Factory를 사용하는 경우 오브젝트를 만들고 오브젝트에 속성을 추가한 후 동일한 오브젝트를 반환합니다.이 팩토리를 컨트롤러로 전달하면 오브젝트상의 이러한 속성은 공장에서 해당 컨트롤러에서 사용할 수 있게 됩니다.

app.controller('myFactoryCtrl', function($scope, myFactory){
  $scope.artist = myFactory.getArtist();
});

app.factory('myFactory', function(){
  var _artist = 'Shakira';
  var service = {};

  service.getArtist = function(){
    return _artist;
  }

  return service;
});


2) 서비스를 사용하는 경우 Angular는 'new' 키워드를 사용하여 백그라운드에서 서비스를 인스턴스화합니다.그 때문에, 「이것」에 속성을 추가하고, 서비스에서는 「이것」을 반환합니다.서비스를 컨트롤러에 전달하면 'this'의 속성이 서비스를 통해 해당 컨트롤러에서 사용할 수 있게 됩니다.

app.controller('myServiceCtrl', function($scope, myService){
  $scope.artist = myService.getArtist();
});

app.service('myService', function(){
  var _artist = 'Nelly';
  this.getArtist = function(){
    return _artist;
  }
});



비 TL;DR

1) ★★
서비스를 만들고 구성하는 가장 일반적인 방법은 공장입니다.TL;DR에 관한 것입니다.개체를 만들고 여기에 속성을 추가한 다음 동일한 개체를 반환하기만 하면 됩니다.그런 다음 공장을 컨트롤러로 넘기면 오브젝트 상의 이러한 속성은 공장에서 해당 컨트롤러로 사용할 수 있게 됩니다.하다

app.factory('myFactory', function(){
  var service = {};
  return service;
});

이제 'myFactory'를 컨트롤러에 전달하면 '서비스'에 첨부하는 모든 속성을 사용할 수 있습니다.

이제 콜백 함수에 몇 가지 '개인' 변수를 추가해 보겠습니다.컨트롤러에서 직접 액세스할 수는 없지만, 필요에 따라 이러한 '개인' 변수를 변경할 수 있도록 '서비스'에 몇 가지 getter/setter 메서드를 설정할 것입니다.

app.factory('myFactory', function($http, $q){
  var service = {};
  var baseUrl = 'https://itunes.apple.com/search?term=';
  var _artist = '';
  var _finalUrl = '';

  var makeUrl = function(){
   _artist = _artist.split(' ').join('+');
    _finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK';
    return _finalUrl
  }

  return service;
});

이러한 변수/함수는 '서비스'에 부가되지 않습니다.나중에 사용하거나 수정하기 위해 작성했을 뿐입니다.

  • baseUrl은 iTunes API에 필요한 기본 URL입니다.
  • _marker는 우리가 조회하고자 하는 아티스트입니다.
  • _finalUrl은 iTunes makeUrl을 호출하는 최종적이고 완전한 URL입니다.이것은 iTunes에 친숙한 URL을 만들고 반환하는 함수입니다.

이제 도우미/개인 변수와 함수가 배치되었으므로 'service' 개체에 몇 가지 속성을 추가해 보겠습니다.'myFactory'를 사용하는 컨트롤러에서는 어떤 서비스를 사용하든 직접 사용할 수 있습니다.

아티스트를 되돌리거나 설정하기만 하면 되는 set Artist 메서드와 get Artist 메서드를 만듭니다.또, 작성한 URL로 iTunes API를 호출하는 메서드를 작성합니다.이 메서드는 iTunes API에서 데이터가 돌아오면 이행할 약속을 반환합니다.Angular에서 약속을 사용한 경험이 많지 않다면 자세히 살펴보는 것이 좋습니다.

아래 setArtist는 아티스트를 받아들이고 아티스트를 설정할 수 있습니다.getArtist는 아티스트 callItunes를 먼저 makeUrl()로 호출하여 $http 요청과 함께 사용할 URL을 만듭니다.그런 다음 약속 개체를 설정하고 최종 URL을 사용하여 $http 요청을 작성합니다.그러면 $http는 약속을 반환하므로 요청 후에 .success 또는 .error를 호출할 수 있습니다.그런 다음 iTunes 데이터와의 약속을 해결하거나 '오류가 발생했습니다'라는 메시지로 약속을 거부합니다.

app.factory('myFactory', function($http, $q){
  var service = {};
  var baseUrl = 'https://itunes.apple.com/search?term=';
  var _artist = '';
  var _finalUrl = '';

  var makeUrl = function(){
    _artist = _artist.split(' ').join('+');
    _finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
    return _finalUrl;
  }

  service.setArtist = function(artist){
    _artist = artist;
  }

  service.getArtist = function(){
    return _artist;
  }

  service.callItunes = function(){
    makeUrl();
    var deferred = $q.defer();
    $http({
      method: 'JSONP',
      url: _finalUrl
    }).success(function(data){
      deferred.resolve(data);
    }).error(function(){
      deferred.reject('There was an error')
    })
    return deferred.promise;
  }

  return service;
});

이제 우리 공장은 완성되었다.이제 모든 컨트롤러에 'myFactory'를 삽입할 수 있게 되었습니다. 그러면 서비스 개체에 연결된 메서드(setArtist, getArtist 및 callItunes)를 호출할 수 있습니다.

app.controller('myFactoryCtrl', function($scope, myFactory){
  $scope.data = {};
  $scope.updateArtist = function(){
    myFactory.setArtist($scope.data.artist);
  };

  $scope.submitArtist = function(){
    myFactory.callItunes()
      .then(function(data){
        $scope.data.artistData = data;
      }, function(data){
        alert(data);
      })
  }
});

'myFactory'를 선택합니다.myFactory'라는 $scope입니다.위의 유일한 까다로운 코드는 당신이 전에 약속을 다뤄본 적이 없다는 것이다.하기 때문에 .할 수 데이터로 에만 $설정할 수 .callItunes는 .then을 사용합니다.이 컨트롤러는 매우 얇습니다.델의 모든 논리와 영속적인 데이터는 컨트롤러가 아닌 델의 서비스에 있습니다.

2) 2) 비 2
서비스를 만들 때 가장 중요한 점은 'new' 키워드를 사용하여 서비스가 인스턴스화된다는 것입니다.JavaScript의 전문가에게는 이것이 코드의 성질에 대한 큰 힌트를 줄 것입니다.JavaScript에 대한 지식이 한정되어 있는 분이나 'new' 키워드의 실제 기능에 대해 잘 모르는 분들을 위해 최종적으로 서비스의 성격을 이해하는 데 도움이 되는 몇 가지 JavaScript의 기초에 대해 알아보겠습니다.

'new' 키워드를 사용하여 함수를 호출했을 때 발생하는 변경을 실제로 확인하려면 함수를 만들고 'new' 키워드를 사용하여 호출한 후 인터프리터가 'new' 키워드를 보았을 때 수행하는 작업을 보여 줍니다.최종 결과는 둘 다 동일합니다.

먼저 컨스트럭터를 만듭니다.

var Person = function(name, age){
  this.name = name;
  this.age = age;
}

이것은 일반적인 JavaScript 컨스트럭터 함수입니다.이제 "new" 키워드를 사용하여 Person 함수를 호출할 때마다 "this"가 새로 생성된 개체에 바인딩됩니다.

이제 개인 '클래스'의 모든 인스턴스에서 사용할 수 있도록 개인 프로토타입에 메서드를 추가해 보겠습니다.

Person.prototype.sayName = function(){
  alert('My name is ' + this.name);
}

이제 sayName 함수를 프로토타입에 넣기 때문에 Person의 모든 인스턴스가 sayName 함수를 호출하여 해당 인스턴스의 이름을 알릴 수 있습니다.

이제 개인 컨스트럭터 함수와 sayName 함수가 프로토타입에 포함되었으므로 실제로 개인 인스턴스를 만들고 sayName 함수를 호출합니다.

var tyler = new Person('Tyler', 23);
tyler.sayName(); //alerts 'My name is Tyler'

따라서 모두 합쳐서 인물 생성자를 만들고, 함수를 프로토타입에 추가하고, 인물 인스턴스를 만들고, 프로토타입에서 함수를 호출하는 코드는 다음과 같습니다.

var Person = function(name, age){
  this.name = name;
  this.age = age;
}
Person.prototype.sayName = function(){
  alert('My name is ' + this.name);
}
var tyler = new Person('Tyler', 23);
tyler.sayName(); //alerts 'My name is Tyler'

이제 JavaScript에서 'new' 키워드를 사용하면 실제로 어떤 일이 일어나는지 살펴보겠습니다.이 예에서 'new'를 사용한 후 메서드(sayName)를 객체처럼 'tyler'에서 호출할 수 있습니다.그것은 객체이기 때문입니다.먼저, 코드 내에서 볼 수 있는지 여부에 관계없이 개인 생성자가 개체를 반환하고 있음을 알 수 있습니다.둘째, sayName 함수는 사용자 인스턴스가 아닌 프로토타입에 위치하기 때문에 사용자 함수가 반환하는 객체는 룩업이 실패했을 때 해당 프로토타입에 위임되어야 합니다.간단히 말하면, tyler.sayName()을 호출하면 인터프리터가 "OK, 방금 만든 'tyler' 객체를 보고 sayName 함수를 찾은 후 호출합니다.잠깐만요, 여기 안 보이는데요. 이름과 나이만 보여요. 시제품을 확인해 볼게요.네, 시제품에 있는 것 같아요. 그렇게 부르죠."

아래는 'new' 키워드가 JavaScript에서 실제로 무엇을 하고 있는지에 대한 코드입니다.기본적으로 위 단락의 코드 예시입니다.해석자가 코드를 보는 방식이나 '인터프리터 뷰'를 메모 안에 넣었습니다.

var Person = function(name, age){
  //The line below this creates an obj object that will delegate to the person's prototype on failed lookups.
  //var obj = Object.create(Person.prototype);

  //The line directly below this sets 'this' to the newly created object
  //this = obj;

  this.name = name;
  this.age = age;

  //return this;
}

이제 'new' 키워드가 JavaScript에서 실제로 어떤 역할을 하는지 알게 되면 서비스를 Angular로 작성하는 것이 이해하기 쉬울 것입니다.

서비스를 작성할 때 가장 이해해야 할 것은 'new' 키워드를 사용하여 서비스가 인스턴스화된다는 것입니다.이러한 지식을 상기 예와 조합하여 '이것'에 직접 속성 및 방법을 첨부하고, 서비스 자체에서 반환해야 합니다.이 동작에 대해 살펴보겠습니다.

공장 출하 시의 예시와 달리 오브젝트를 작성한 후 반환할 필요가 없습니다.이전에도 여러 번 언급했듯이 'new' 키워드를 사용했기 때문에 인터프리터가 오브젝트를 생성하여 프로토타입에 위임한 후 반환할 필요가 없습니다.

먼저, 우리의 '프라이빗'과 도우미 기능을 만들어 봅시다.저희 공장에서도 똑같은 작업을 했기 때문에 매우 친숙해 보일 것입니다.여기서는 각 라인의 기능에 대해서는 설명하지 않습니다.공장 예에서는 설명했으므로 혼란스럽다면 공장 예제를 다시 읽어보십시오.

app.service('myService', function($http, $q){
  var baseUrl = 'https://itunes.apple.com/search?term=';
  var _artist = '';
  var _finalUrl = '';

  var makeUrl = function(){
    _artist = _artist.split(' ').join('+');
    _finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
    return _finalUrl;
  }
});

이제 컨트롤러에서 사용할 수 있는 모든 메서드를 'this'에 첨부합니다.

app.service('myService', function($http, $q){
  var baseUrl = 'https://itunes.apple.com/search?term=';
  var _artist = '';
  var _finalUrl = '';

  var makeUrl = function(){
    _artist = _artist.split(' ').join('+');
    _finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
    return _finalUrl;
  }

  this.setArtist = function(artist){
    _artist = artist;
  }

  this.getArtist = function(){
    return _artist;
  }

  this.callItunes = function(){
    makeUrl();
    var deferred = $q.defer();
    $http({
      method: 'JSONP',
      url: _finalUrl
    }).success(function(data){
      deferred.resolve(data);
    }).error(function(){
      deferred.reject('There was an error')
    })
    return deferred.promise;
  }

});

공장에서와 마찬가지로 setArtist, getArtist 및 callItunes는 myService를 제공하는 컨트롤러에서 사용할 수 있습니다.이것은 myService 컨트롤러(공장 컨트롤러와 거의 동일)입니다.

app.controller('myServiceCtrl', function($scope, myService){
  $scope.data = {};
  $scope.updateArtist = function(){
    myService.setArtist($scope.data.artist);
  };

  $scope.submitArtist = function(){
    myService.callItunes()
      .then(function(data){
        $scope.data.artistData = data;
      }, function(data){
        alert(data);
      })
  }
});

앞서 말씀드렸듯이, 일단 '새로운'의 기능을 제대로 이해하게 되면 서비스는 Angular의 공장과 거의 동일합니다.

단서는 이름에 있다.

서비스와 공장은 서로 비슷하다.둘 다 다른 오브젝트에 주입할 수 있는 싱글톤 오브젝트를 생성하기 때문에 종종 서로 교환할 수 있습니다.

이들은 의미론적으로 다른 설계 패턴을 구현하기 위해 사용됩니다.

서비스는 서비스 패턴을 구현하기 위한 것입니다.

서비스 패턴은 애플리케이션이 논리적으로 일관된 기능 단위로 분할되는 패턴입니다.예를 들어 API 접근자 또는 비즈니스 로직 집합이 있습니다.

이는 특히 Angular에서 중요한데, Angular 모델은 일반적으로 서버에서 가져온 JSON 객체이기 때문에 비즈니스 로직을 배치할 장소가 필요하기 때문입니다.

예를 들어 Github 서비스가 있습니다.기둡과 대화하는 법을 알고 있어URL 및 메서드에 대해 알고 있습니다.컨트롤러에 주입하면 확약이 생성되어 반환됩니다.

(function() {
  var base = "https://api.github.com";

  angular.module('github', [])
    .service('githubService', function( $http ) {
      this.getEvents: function() {
        var url = [
          base,
          '/events',
          '?callback=JSON_CALLBACK'
        ].join('');
        return $http.jsonp(url);
      }
    });
  )();

공장에서는 공장 패턴을 구현합니다.

반면 공장은 공장 패턴을 구현하기 위한 것입니다.팩토리 함수를 사용하여 객체를 생성하는 팩토리 패턴입니다.일반적으로 모델을 만드는 데 사용할 수 있습니다.다음은 작성자 생성자를 반환하는 공장입니다.

angular.module('user', [])
  .factory('User', function($resource) {
    var url = 'http://simple-api.herokuapp.com/api/v1/authors/:id'
    return $resource(url);
  })

다음과 같이 활용합니다.

angular.module('app', ['user'])
  .controller('authorController', function($scope, User) {
    $scope.user = new User();
  })

공장에서도 싱글톤이 반환된다는 점에 유의하십시오.

공장에서 건설자를 반환할 수 있습니다.

팩토리에서는 오브젝트를 반환하기만 하면 되기 때문에 위에서 보듯이 컨스트럭터 함수를 포함한 원하는 오브젝트를 반환할 수 있습니다.

공장에서 오브젝트를 반환하고 서비스를 신규로 할 수 있습니다.

또 다른 기술적 차이는 서비스와 공장의 구성 방식에 있습니다.개체를 생성하기 위한 서비스 함수가 새로 생성됩니다.공장 함수가 호출되어 개체를 반환합니다.

  • 서비스는 새로운 컨스트럭터입니다.
  • 공장은 단순히 불러서 물건을 돌려준다.

즉, 서비스에서는 컨스트럭터의 컨텍스트에서 구축 중인 개체를 가리키는 "this"에 추가됩니다.

이를 설명하기 위해 서비스 및 팩토리를 사용하여 작성된 동일한 단순한 개체를 다음에 나타냅니다.

angular.module('app', [])
  .service('helloService', function() {
    this.sayHello = function() {
      return "Hello!";
    }
  })
  .factory('helloFactory', function() {
    return {
      sayHello: function() {
        return "Hello!";
      }
    }
  });

여기의 모든 답변은 서비스와 공장에 관한 것으로 보입니다.그것은 질문의 대상이 되었기 때문에 유효합니다. 이 에도 여러 중요한 provider(),value() , , , , 입니다.constant().

기억해야 할 열쇠는 각각이 서로의 특별한 경우라는 것이다.각각의 특별한 케이스는 코드 수를 줄이면서 동일한 작업을 수행할 수 있습니다.각각 다른 제한 사항도 있습니다.

어느 것을 사용할지 결정하는 것은, 어느 것을 사용하고 싶은 것을 보다 적은 코드로 실행할 수 있는지를 확인하는 것입니다.다음 그림은 두 제품이 얼마나 유사한지 보여 줍니다.

여기에 이미지 설명 입력

상세한 스텝 바이 스텝의 설명과 각 사용 타이밍에 대한 빠른 참조는 다음 이미지를 취득한 블로그 포스트를 참조하십시오.

http://www.simplygoodcode.com/2015/11/the-difference-between-service-provider-and-factory-in-angularjs/

app.factory "fn", fn) vs.app.service "fn", fn)

건설

공장에서는 Angular가 함수를 호출하여 결과를 얻습니다.캐시되어 주입된 결과입니다.

 //factory
 var obj = fn();
 return obj;

서비스의 경우 Angular는 new를 호출하여 생성자 함수를 호출합니다.생성된 함수는 캐시되고 주입됩니다.

  //service
  var obj = new fn();
  return obj;

실행

반환값은 컨트롤러, 런블록, 디렉티브 등에 삽입되는 값이기 때문에 공장에서는 일반적으로 오브젝트 리터럴을 반환합니다.

  app.factory('fn', function(){
         var foo = 0;
         var bar = 0;
         function setFoo(val) {
               foo = val;
         }
         function setBar (val){
               bar = val;
         }
         return {
                setFoo: setFoo,
                serBar: setBar
         }
  });

일반적으로 서비스 함수는 아무것도 반환하지 않습니다.대신 초기화 및 노출 기능을 수행합니다.함수는 'new'를 사용하여 구성되었기 때문에 'this'를 참조할 수도 있습니다.

app.service('fn', function () {
         var foo = 0;
         var bar = 0;
         this.setFoo = function (val) {
               foo = val;
         }
         this.setBar = function (val){
               bar = val;
         }
});

결론

공장이나 서비스 이용에 관해서는 둘 다 매우 유사합니다.컨트롤러, 디렉티브, 실행 블록 등에 삽입되어 클라이언트코드에 거의 같은 방법으로 사용됩니다.둘 다 싱글톤입니다.즉, 서비스/공장이 주입되는 모든 장소에서 동일한 인스턴스가 공유됩니다.

그럼 어느 쪽이 좋습니까?둘 다 비슷해서 차이가 작습니다.둘 중 하나를 선택할 경우 적절하게 구현할 수 있도록 구성 방식만 숙지하십시오.

나는 그 차이를 알아내기 위해 꽤 시간을 보냈다.

그리고 공장 함수는 모듈 패턴을 사용하고 서비스 함수는 표준 자바 스크립트 컨스트럭터 패턴을 사용하고 있다고 생각합니다.

출하시 패턴은 객체뿐만 아니라 함수와 값을 반환할 수 있기 때문에 더욱 유연합니다.

서비스 패턴 IMHO는 공장에서도 쉽게 할 수 있기 때문에 큰 의미가 없습니다.예외는 다음과 같습니다.

  • 어떤 이유로 인스턴스화된 서비스의 선언된 유형에 관심이 있는 경우 - 서비스 패턴을 사용하는 경우, 컨스트럭터는 새로운 서비스의 유형이 됩니다.
  • 다른 곳에서 이미 사용하고 있는 컨스트럭터 함수가 있고 서비스로도 사용하고 싶은 경우(아무것도 삽입하고 싶은 경우에는 그다지 쓸모가 없을 수도 있습니다!).

구문의 관점에서 새로운 오브젝트를 작성하는 것이 서비스 패턴보다 조금 더 좋은 방법이지만 인스턴스화 비용도 더 많이 듭니다.다른 사람들은 angular가 서비스를 만들기 위해 "새로운"을 사용한다고 지적했지만, 이는 사실이 아닙니다. 서비스 컨스트럭터마다 파라미터의 수가 다르기 때문에 그렇게 할 수 없습니다.각도가 실제로 하는 일은 공장 패턴을 내부적으로 사용하여 컨스트럭터 함수를 랩하는 것입니다.그런 다음 javascript의 "new" 연산자를 시뮬레이션하여 다양한 수의 주입 가능한 인수를 사용하여 컨스트럭터를 호출합니다.그러나 공장 패턴을 직접 사용하면 이 단계를 생략할 수 있으며, 따라서 코드 효율성이 매우 약간 향상됩니다.

언급URL : https://stackoverflow.com/questions/14324451/angular-service-vs-angular-factory

반응형