Different ways to invoke functions - Javascript

There's a big difference.

The first example creates an anonymous function and sets $scope.test to the return value of that function. Since the function doesn't return anything, method one sets $scope.test to undefined.

Method 2 actually sets $scope.test to a function and then calls it.

var f1 = function(){ 
    alert("You'll see this right away!  the function is called directly after definition")
  }()

alert(f1)

var f2 = function(){
    alert("f2 has been called")
  }

alert("note, f2 hasn't been actually _called_ yet, just defined.");

f2();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

These two are different. The first one will assign the return value of the function to $scope.test, while the second one will assign the definition of the function to $scope.test.

I don't really see a lot of people who would use Method 1 in normal cases. But this is how I see the differences between those two:

In Method 1, $scope.test stores the return value of the function invoked, which implicitly returns undefined, so $scope.test is undefined.

In Method 2, $scope.test actually stores a reference to the function and you can invoke it whenever you want using $scope.test(), but you cannot do the same with Method 1.

Method 1 is called, Anonymous function. Let’s look at another anonymous function:

(function() {
    alert('Hello World');
})();

Those last two parentheses are the self-executing part. They cause everything in the preceding parentheses to be executed immediately.

Let’s talk about self-executing anonymous functions inside and outside of objects:

(function() {
    var Person = {
        sayHello: function() {
            alert('Hello World');
        }
    }
})();

Here we have a self-executing anonymous function with an object inside of it that contains its own anonymous function.

Note: It’s short for initializing. That name(Person) however, carries no special meaning.

Method 2, actually stores a reference to the function and you can invoke it later anytime you want.

Few things; there is no jQuery usage in this code you pasted.

In the first example you are executing an anonymous function which do not have a return statement so you are assigning an undefined value to the $scope.test property.

In the second example you are assigning a function to the $scope.test property and then executing the function.

go check the MDN docs about Functions if still do you have any question go add a comment.