JavaScript for C#Developers Study(2)

JavaScript Functions

 

• Not like c#, less parameter(s) can be passed to a function, the omitted one(s) would be undefined

• There isn’t method overloading like c#, the latter definition simply makes the former one disappear.

• arguments object can be used within a function to check the parameters

• Using the arguments object to access the values

 

• Return Values
  • if there isn’t return in the function, or the return expression doesn’t return anything, the return value of the function is undefined.

 

• Function object itself has its own properties and member functions

• Anonymous Function

 

• The “this” keyword in a function
  • “this” applies to the run time owner of the function

 

• • Details of the “this” keyword, get more HERE

• • bind() lets you change the owner of a function

JavaScript function invocation under the hood

Functions, like pretty much everything else in JavaScript, are objects: each function is an instance of the core Function object and thus inherits a method named call which invokes the code defined within the function body. The call method expects at least one argument which is the object that will act as the value of this within the particular execution of the function: any further arguments are passed along as arguments for the function body.

function greet(name) {
    alert("Hi " + name + ", my name is " + this.name + ".");
}

var me = {
    name: "Nathaniel"
};

greet.call(me, "John"); // "Hi John, my name is Nathaniel."

Of course, it’s unlikely that you see this particular style of function invocation as frequently as you see the more common identifier(arg1, arg2, ..., argN) syntax, but in reality that’s nothing more than a convenience syntax offered by the language so that developers don’t have to use the call method over and over again.

function greet(name) {
    alert("Hi " + name + ", my name is " + this.name + ".");
}

// From JavaScript's perspective this...
greet("Jane");

// ...is actually this.
greet.call(window, "Jane");

Note that when we make a baseless function call, e.g. greet("Jane"), JavaScript automatically passes in the global context (the window object) as the first argument of the implicit call method so any function called in this manner uses the global context.

Another common way to call a function is to invoke it as the method of an object in which case JavaScript determines that the object should be passed as the context argument.

function greet(name) {
    alert("Hi " + name + ", my name is " + this.name + ".");
}

me = {
    name: "Nathaniel",
    greet: greet
};

// From JavaScript's perspective this...
me.greet("Jeff");

// ...is actually this.
greet.call(me, "Jeff");

Read more HERE

Examples of baseless function invocation and self invocation:

var a = {
    b: function() {
        return this;
    }
};

var foo = a.b;
foo(); //window

var a = {
    b: function() {
        var c = function() {
            return this;
        };
        return c();  // baseless invocation
    }
};

a.b(); //window

var a = {
    b: function() {
        return (function() {return this;})(); // self invoking
    }
};

a.b(); //window

Read more HERE

• Closures
  • References outside a function are accessible in function, regardless of lifetime

 

• Scoping
  • In c#, Curly Braces make a scope, variables defined inside won't live outside

• • In JavaScript, Curly Braces DON’T make a scope, that means variables defined inside still live outside

• • The ONLY thing creates a scope in JavaScript is Function

 

• Namespace
  • Polluting the Global Scope
    • Name Collision Problematic in Large Projects

 

• • Create an object as Namespace

• • Namespaces and Anonymous Self-Executing Function handles the global pollution