AngularJS $http .then syntax difference causes TypeError

Question

I am trying to obtain data from getAllDatas method.

This works fine without any error:

var getAlldatas = function ($http) {
    var getuser = function (username) {
        return $http.get("https://api.github.com/users/" + username).then(function (response) {
            return response.data;
        });
    };

This throws error:

 var getAlldatas = function ($http) {
     var getuser = function (username) {
         var pro = $http.get("https://api.github.com/users/" + username).then(getThis);

         var getThis = function (response) {
             return response.data;
         };

         return pro;
     };

How ever i get the following error message for the second one

angular.js:10071 TypeError: Cannot read property 'protocol' of undefined

How is the second one different from first and why does this throw error?
Why don't both behave in a similar way?

In the second example the var pro = ... line is actually var pro = $http.get("https://api.github.com/users/" + username).then(undefined); -> Hoisting — Andreas
– Andreas, Commented Nov 4, 2017 at 11:42

score 4 · Accepted Answer · 2018-03-20 23:40:37Z

4

It's how JavaScript works. Function declarations are hoisted to the top of the code page while initializations aren't.

Reference--Thanks to @Andreas

You are defining getThis after you are using it.

edited Mar 20, 2018 at 23:40

answered Nov 4, 2017 at 12:24

user4932805

Sign up to request clarification or add additional context in comments.

1 Comment

JLRishe Over a year ago

Function declarations are hoisted.

dhilt · Accepted Answer · 2017-11-04 12:23:27Z

Your second definition breaks into

 var getuser = function (username) {
    var pro, getThis;
    pro = $http.get("https://api.github.com/users/" + username).then(getThis);
    getThis = function (response) {
        return response.data;
    };
    return pro;
};

And getThis is just undefined during assigning a value to the pro variable. This issue occurs due to immediate .then call and taking it's callback argument which is undefined in work. The next code fixes the problem:

 var getuser = function (username) {
    var pro = $http.get("https://api.github.com/users/" + username)
              .then(function(result) { getThis(result); });
    var getThis = function (response) {
        return response.data;
    };
    return pro;
};

In this case the callback argument is not undefined and it will pass to the AngularJS properly, and getThis variable will have time to get it's value.

saranchel n · Accepted Answer · 2017-11-04 17:46:37Z

1

use like this:

  var getuser = function (username) {
  var pro = $http.get("https://api.github.com/users/" + username)
          .then(function(getdata) { getThis(getdata); });
  var getThis = function (response) {
    return response.data;
  };
  return pro;
  };

answered Nov 4, 2017 at 17:46

saranchel n

6332 gold badges9 silver badges19 bronze badges

Collectives™ on Stack Overflow

AngularJS $http .then syntax difference causes TypeError

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related