Различного рода конфигурации провайдера в угловых

Question

Учиться под углом на разных ресурсах в интернете очень непонятно. все используют различные виды шаблонов для написания функций. Просьба пролить свет на эту концепцию.provider

я пытался .provider с 4 разными рисунками и все работают

шаблон A: используя все функции внутри return

app.provider('other', function() {
    name ="Default";
    return {
        $get: function () {
                return {
                    sayHello: function () { console.log('provider example say my name is :' + name )}
                }
        },
        setName: function (newName) {
            name = newName;
        }
    };
}); 

---

шаблон B: используя this и отличаются $get и другими методами

app.provider('other', function() {
    this.name ="Default";
    this.$get = function () {
        var name = this.name;
        return {
            sayHello: function () { console.log('provider example say my name is :' + name )}
        };
    };

    this.setName = function(name) {
        this.name = name;
    };
});

шаблон C: также найден где-то с помощью массива [ ] как раз перед функцией, которая имеет возврат

this.$get = [function () {
        var name = this.name;
        return {
            sayHello: function () { console.log('provider example say my name is :' + name )}
        }
    }];

---

UPADTE

Шаблон D: с.factory, а затем functionNameProvider.$ Get.methodName() с.config

app.factory('alpha', function(){
        var c = ['Cadbury','Perk','Dairy Milk'];
        return {
            sayHello: function() { console.log('Hello, I am from Provider');},
            getAllData: function() { return c; }
        };
});

затем

app.config(['alphaProvider',function(alphaProvider) {
 console.group('Checking Factory Pattern');
 alphaProvider.$get().sayHello();
 var cdata = alphaProvider.$get().getAllData();
 console.log(cdata);
 console.groupEnd();
}]);

создал jsfiddle для того же, пожалуйста, скажите мне, какой правильный / предпочтительный способ?

Answer 1

Оба шаблона A и B являются правильными способами создания провайдера / услуги.

function вы переходите к provider() Метод является конструктором экземпляра провайдера. Экземпляр провайдера - это просто объект с $get метод. У вас есть два варианта, как его создать:

• явный возврат экземпляра провайдера из функции конструктора (шаблон A)
• использование this синтаксис и ничего не возвращать из конструктора (шаблон B). В этом случае angular создаст экземпляр провайдера как новый Object и запустить ваш конструктор против него (с this связаны с этим).

Шаблон C - это встроенная аннотация массива - способ указать зависимости вашего компонента / функции. Массив должен содержать имена зависимостей, за которыми следует function где вы хотите их вводить. Может использоваться с подходами A и B.

ОБНОВИТЬ

Как отмечает @estus, подход B более эффективен, потому что в случае A новый Object также создается, но никогда не используется.